/*
 * Peptilab — Default global styles
 * Loaded on every frontend page (after variables.css).
 *
 * Holds shared utilities — content container, baseline button look —
 * so per-page CSS files can stay focused on page-specific concerns.
 */

/* ============================================================
   .pl-container — shared centered wrapper.
   Desktop: max-width 1360px, 60px horizontal padding.
   Mobile (≤768): 24px horizontal padding.
   Mirrors the other section containers on the home page.
   ============================================================ */
.pl-container {
	width: 100%;
	max-width: 1360px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 60px;
	padding-right: 60px;
	box-sizing: border-box;
}

@media (max-width: 768px) {
	.pl-container {
		padding-left: 24px;
		padding-right: 24px;
	}
}

/* ============================================================
   Global button — match the product-card add-to-cart look.
   Any .wp-block-button__link.wp-element-button gets accent fill,
   white text, generous padding, smooth hover lift. Product-card
   specific rules in product-card.css use !important, so they
   continue to win where they need slightly different sizing.
   ============================================================ */
.wp-block-button__link.wp-element-button {
	display:         inline-block;
	padding:         13px 24px;
	background:      var(--pl-accent, #537FF4);
	color:           #fff;
	text-align:      center;
	border:          none;
	border-radius:   var(--pl-border-radius, 50px);
	font-family:     var(--pl-font-body, Inter, sans-serif);
	font-size:       16px;
	font-weight:     600;
	line-height:     1.63;
	text-decoration: none;
	cursor:          pointer;
	box-sizing:      border-box;
	transition:      background var(--pl-transition, .2s ease),
	                 box-shadow var(--pl-transition, .2s ease),
	                 transform var(--pl-transition-fast, .1s ease);
}

.wp-block-button__link.wp-element-button:hover,
.wp-block-button__link.wp-element-button:focus-visible {
	background:      var(--pl-accent-dark, #3F66D6);
	color:           #fff;
	text-decoration: none;
	transform:       translateY(-1px);
	box-shadow:      var(--pl-shadow-card-atc, 0 4px 14px rgba(83, 127, 244, 0.25));
	outline:         none;
}

.wp-block-button__link.wp-element-button:active {
	transform: translateY(0);
}