/* =====================================================================
   Brina Product System V2 — Single Product Page (Phase 1 foundation,
   Phase 2 Buy Box, Phase 3 product experience + discovery)
   Loaded on single product pages only (inc/brina-product-page.php).
   Scope: Bricks template 1362 (.brina-pdp, .brina-pdp-below). Header 35 and
   footer 230 are not targeted.

   Primary area (grid areas):
     gallery | summary (brand + wishlist, title, rating) | buy | about
     (short description, at-a-glance facts)
   Phone  (< 768px)     one column: summary (identity), gallery, about
                        (short description + options/decision area), buy,
                        info
   Tablet (768–1199px)  two columns: gallery + about | summary + buy, then
                        info across both
   Desktop (>= 1200px)  three columns: gallery | summary + about | buy, then
                        info (About this item) under gallery + centre, beside
                        the Buy Box column (Phase 4: no empty band)
   Below the fold (.brina-pdp-below): Ratings & reviews, discovery rails,
   then the footer.

   Columns use fr units with minmax(0, …), so gaps never push the grid past
   its container. ":not(#brina-pdp)" adds one ID of specificity where a rule
   must win over Bricks' generated #brxe-… element rules.
   ===================================================================== */

.brina-pdp,
.brina-pdp-below {
	--brina-pdp-gap: 24px;
	--brina-pdp-max: 1400px;
	--brina-pdp-ink: #111827;
	--brina-pdp-muted: #4B5563;
	--brina-pdp-line: #E5E7EB;
	--brina-pdp-navy: #173B6C;
	--brina-pdp-focus: #5B4CF0;
	--brina-pdp-stage: #F6F7FB;
	--brina-pdp-brand: #101C3D;
}

/* ---- 1. Main grid --------------------------------------------------- */

.brina-pdp__main:not(#brina-pdp) {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"summary"
		"gallery"
		"about"
		"buy"
		"info";
	gap: var(--brina-pdp-gap);
	align-items: start;
	width: 100%;
	max-width: var(--brina-pdp-max);
	margin-inline: auto;
}

.brina-pdp__gallery:not(#brina-pdp) { grid-area: gallery; min-width: 0; position: relative; }
.brina-pdp__summary:not(#brina-pdp) { grid-area: summary; min-width: 0; }
.brina-pdp__buy:not(#brina-pdp)     { grid-area: buy;     min-width: 0; }
.brina-pdp__about:not(#brina-pdp)   { grid-area: about;   min-width: 0; }
.brina-pdp__info-area:not(#brina-pdp) { grid-area: info; min-width: 0; }

@media (min-width: 768px) {
	.brina-pdp__main:not(#brina-pdp) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		grid-template-areas:
			"gallery summary"
			"gallery buy"
			"about   buy"
			"info    info";
		grid-template-rows: auto auto 1fr auto;
		column-gap: 32px;
		row-gap: 16px;
	}
}

@media (min-width: 1200px) {
	.brina-pdp__main:not(#brina-pdp) {
		grid-template-columns: minmax(0, 11fr) minmax(0, 8fr) minmax(300px, 6fr);
		grid-template-areas:
			"gallery summary buy"
			"gallery about   buy"
			"info    info    buy";
		grid-template-rows: auto 1fr auto; /* spare gallery height goes below the key facts, not inside the identity block */
		column-gap: 36px;
		row-gap: 14px;
	}
}

/* Phone: tighter section gutters. */
@media (max-width: 767.98px) {
	.brina-pdp:not(#brina-pdp) {
		padding-inline: 16px;
		padding-top: 16px;
	}

	.brina-pdp .brina-pdp__summary h1:not(#brina-pdp) {
		font-size: 22px;
		margin-bottom: 6px;
	}

	.brina-pdp__main:not(#brina-pdp) {
		row-gap: 16px;
	}
}

/* ---- 2. Gallery (WooCommerce native gallery + thumbnails) -------------
   The stage keeps every image at its natural aspect ratio (contain, never
   cropped). Thumbnails: a vertical rail beside the stage from 1024px when the
   gallery column is wide enough, a horizontal strip below it otherwise. Any
   image count works: one image has no thumbnail list at all; long lists
   scroll inside the rail/strip. The lightbox is WooCommerce's; the hover zoom
   is Brina's clean in-place zoom (Phase 4, brina-product-page.js). */

.brina-pdp .brxe-product-gallery {
	max-width: 100%;
}

.brina-pdp .woocommerce-product-gallery:not(#brina-pdp) {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 12px;
	width: 100%;
	margin: 0;
	float: none;
}

.brina-pdp .woocommerce-product-gallery > .flex-viewport,
.brina-pdp .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
	grid-row: 1;
	min-width: 0;
	border-radius: 16px;
	background: var(--brina-pdp-stage);
	overflow: hidden;
}

.brina-pdp .woocommerce-product-gallery__wrapper {
	margin: 0;
}

/* Padding lives on the inner link: flexslider subtracts a slide's own
   padding from its computed width, which would let the next slide show. */
.brina-pdp .woocommerce-product-gallery__image {
	display: flex !important; /* flexslider slides; keeps images centred */
	align-items: center;
	justify-content: center;
	padding: 0;
	background: var(--brina-pdp-stage); /* backdrop for the multiply blend inside flexslider's transformed track */
}

.brina-pdp .woocommerce-product-gallery__image > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: clamp(12px, 3vw, 28px);
}

.brina-pdp .woocommerce-product-gallery__image img:not(#brina-pdp) {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: min(560px, 68vh);
	margin: 0 auto;
	object-fit: contain;
	mix-blend-mode: multiply; /* white product backgrounds sit on the stage */
}

/* Thumbnails */
.brina-pdp ol.flex-control-thumbs:not(#brina-pdp) {
	grid-row: 2;
	display: flex;
	gap: 8px;
	margin: 0;
	padding: 2px;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.brina-pdp ol.flex-control-thumbs li {
	flex: 0 0 64px;
	width: 64px !important;
	margin: 0 !important;
	float: none !important;
}

.brina-pdp ol.flex-control-thumbs img {
	display: block;
	width: 64px;
	height: 64px;
	padding: 4px;
	object-fit: contain;
	background: #FFFFFF;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 10px;
	opacity: .72;
	cursor: pointer;
	transition: opacity .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.brina-pdp ol.flex-control-thumbs img:hover,
.brina-pdp ol.flex-control-thumbs img.flex-active {
	opacity: 1;
}

.brina-pdp ol.flex-control-thumbs img.flex-active {
	border-color: var(--brina-pdp-brand);
	box-shadow: 0 0 0 1px var(--brina-pdp-brand);
}

@media (min-width: 1024px) {
	/* The rail column is reserved as soon as the gallery has 2+ images
	   (before flexslider runs), so the stage already has its final width
	   when flexslider measures the slides. */
	.brina-pdp .woocommerce-product-gallery:has(.woocommerce-product-gallery__image:nth-child(2)):not(#brina-pdp) {
		grid-template-columns: 72px minmax(0, 1fr);
		gap: 14px;
	}

	.brina-pdp .woocommerce-product-gallery:has(.woocommerce-product-gallery__image:nth-child(2)) > .flex-viewport,
	.brina-pdp .woocommerce-product-gallery:has(.woocommerce-product-gallery__image:nth-child(2)) > .woocommerce-product-gallery__wrapper {
		grid-column: 2;
	}

	.brina-pdp ol.flex-control-thumbs:not(#brina-pdp) {
		grid-column: 1;
		grid-row: 1;
		flex-direction: column;
		align-self: start;
		max-height: min(616px, 76vh);
		overflow-x: hidden;
		overflow-y: auto;
	}

	.brina-pdp ol.flex-control-thumbs li {
		flex: 0 0 auto;
		width: 68px !important;
	}

	.brina-pdp ol.flex-control-thumbs img {
		width: 68px;
		height: 68px;
	}
}

/* Zoom (lightbox) trigger: WooCommerce's control, restyled, top-right of the stage. */
.brina-pdp .woocommerce-product-gallery__trigger:not(#brina-pdp) {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 9;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 1px 3px rgba(16, 28, 61, .16);
	font-size: 0;
	text-indent: 0;
}

.brina-pdp .woocommerce-product-gallery__trigger:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

/* ---- 3. Summary ----------------------------------------------------- */

.brina-pdp__brand {
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--brina-pdp-muted);
}

.brina-pdp__brand a {
	color: inherit;
	text-decoration: none;
}

.brina-pdp__brand a:hover,
.brina-pdp__brand a:focus-visible {
	color: var(--brina-pdp-navy);
	text-decoration: underline;
}

.brina-pdp__rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	font-size: 14px;
	color: var(--brina-pdp-muted);
}

/* Meta links (categories, tags): comfortable touch targets. */
.brina-pdp .brxe-product-meta a {
	display: inline-block;
	padding-block: 3px;
}

/* ---- 4. Buy box (Phase 2) ------------------------------------------
   Order: price/deal · stock · quantity · Add to Cart · Buy Now ·
   delivery & shipping (incl. "Ships by") · Sold by + Visit store · More
   sellers (only with real offers) · trust/policies. (Buy Box refinement: the cart-threshold
   progress bar moved out of the product Buy Box.)
   ":not(#brina-pdp)" beats the Bricks element rules of vuoens / xbzywn. */

.brina-pdp__buybox:not(#brina-pdp) {
	--bb-radius: 12px;
	--bb-control-h: 48px;
	--bb-primary: #101C3D;
	--bb-primary-hover: #1B2B57;
	--bb-primary-press: #0A1330;
	--bb-accent: #5B4CF0;
	--bb-accent-hover: #4A3BD6;
	--bb-accent-press: #3E30BD;
	--bb-line: #E3E7EF;
	--bb-sale: #A8244A;
	--bb-ok: #166534;
	--bb-warn: #92400E;
	--bb-bad: #B42318;
	gap: 16px;
	padding: 22px 20px;
	background: #FFFFFF;
	border: 1px solid var(--bb-line);
	border-radius: 16px;
	box-shadow: 0 1px 2px rgba(16, 28, 61, .04), 0 10px 28px rgba(16, 28, 61, .06);
}

/* Price + deal (Buy Box refinement: a more restrained scale on a neutral
   system sans with lining, tabular figures; colours unchanged). */
.brina-pdp__pricebox {
	--bb-num-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.brina-pdp__price .price,
.brina-pdp__price > .amount,
.brina-pdp__price {
	margin: 0;
	font-family: var(--bb-num-font);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.005em;
	font-variant-numeric: lining-nums tabular-nums;
	color: var(--brina-pdp-ink);
}

/* Each amount stays on one line; old and new price wrap only as whole units. */
.brina-pdp__price .amount { white-space: nowrap; }

.brina-pdp__price del {
	margin-right: 6px;
	font-size: 14px;
	font-weight: 500;
	color: #6B7280;
}

.brina-pdp__price ins {
	text-decoration: none;
	color: var(--brina-pdp-ink);
}

.brina-pdp__deal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 6px;
	margin: 0;
	font-family: var(--bb-num-font);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.3;
	font-variant-numeric: lining-nums tabular-nums;
	color: var(--bb-sale);
}

.brina-pdp__deal-badge {
	padding: 1px 6px;
	font-size: 10.5px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--bb-sale);
	background: #FDEEF2;
	border-radius: 999px;
}

/* Stock */
.brina-pdp__stock {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	margin: 0;
	font-size: 15px;
	line-height: 1.35;
}

.brina-pdp__stock strong::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 8px;
	border-radius: 50%;
	background: currentColor;
	vertical-align: 1px;
}

.brina-pdp__stock.is-in strong,
.brina-pdp__stock.is-low strong { color: var(--bb-ok); }
.brina-pdp__stock.is-low span { font-weight: 600; color: var(--bb-warn); }
.brina-pdp__stock.is-backorder strong { color: var(--bb-warn); }
.brina-pdp__stock.is-out strong { color: var(--bb-bad); }
.brina-pdp__stock.is-out span { color: var(--brina-pdp-muted); }

/* Form: quantity, Add to Cart, Buy Now */
.brina-pdp__buybox form.cart {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
}

.brina-pdp__buybox .cart .quantity:not(#brina-pdp) {
	height: var(--bb-control-h);
	border: 1px solid #CDD3E0;
	border-radius: var(--bb-radius);
	grid-template-columns: 48px 1fr 48px;
}

/* Quantity: <button>s (inc/brina-product-page.php). */
.brina-pdp .quantity .brina-qty__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	color: var(--brina-pdp-ink);
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background-color .15s ease;
}

.brina-pdp .quantity .brina-qty__btn:active { background: #E5E7EB; }

.brina-pdp .quantity .brina-qty__btn svg {
	pointer-events: none; /* Bricks' handler reads the button's own class. */
}

.brina-pdp .quantity .brina-qty__btn:focus-visible,
.brina-pdp .quantity .qty:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: -2px;
}

.brina-pdp .quantity input[type="hidden"] ~ .brina-qty__btn {
	display: none;
}

.brina-pdp__buybox .cart .single_add_to_cart_button:not(#brina-pdp) {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-width: 100%;
	min-height: var(--bb-control-h);
	margin: 0;
	padding: 12px 20px;
	font-family: Inter, sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .01em;
	color: #FFFFFF;
	background: var(--bb-primary);
	border: 0;
	border-radius: var(--bb-radius);
	box-shadow: 0 1px 2px rgba(16, 28, 61, .12);
	cursor: pointer;
	transition: background-color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.brina-pdp__buybox .cart .single_add_to_cart_button:not(#brina-pdp):hover {
	background: var(--bb-primary-hover);
	box-shadow: 0 4px 12px rgba(16, 28, 61, .18);
}

.brina-pdp__buybox .cart .single_add_to_cart_button:not(#brina-pdp):active {
	background: var(--bb-primary-press);
	transform: translateY(1px);
	box-shadow: none;
}

.brina-pdp__buybox .cart .single_add_to_cart_button.brina-buy-now:not(#brina-pdp) {
	background: var(--bb-accent);
}

.brina-pdp__buybox .cart .single_add_to_cart_button.brina-buy-now:not(#brina-pdp):hover {
	background: var(--bb-accent-hover);
	box-shadow: 0 4px 12px rgba(91, 76, 240, .28);
}

.brina-pdp__buybox .cart .single_add_to_cart_button.brina-buy-now:not(#brina-pdp):active {
	background: var(--bb-accent-press);
}

.brina-pdp__buybox .cart .single_add_to_cart_button:not(#brina-pdp):focus-visible {
	outline: 3px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

/* Variable products: WooCommerce marks both buttons disabled until a
   variation is chosen. */
.brina-pdp__buybox .cart .single_add_to_cart_button.disabled:not(#brina-pdp) {
	opacity: .45;
	cursor: not-allowed;
	box-shadow: none;
}

/* Free-shipping progress (shared markup: brina_free_shipping_progress_html) */
.brina-pdp__shipping { display: flex; flex-direction: column; gap: 6px; }

.brina-fs { margin: 0; }

.brina-fs__message {
	margin: 0 0 8px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--brina-pdp-ink);
}

.brina-fs.is-unlocked .brina-fs__message { color: var(--bb-ok); }

.brina-fs__bar {
	height: 6px;
	border-radius: 999px;
	background: #EEF0F5;
	overflow: hidden;
}

.brina-fs__fill {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--bb-accent);
	transition: width .25s ease;
}

.brina-fs.is-unlocked .brina-fs__fill { background: #16A34A; }

.brina-pdp__shipping-rule,
.brina-pdp__shipping-note {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.45;
	color: var(--brina-pdp-muted);
}

/* Seller */
.brina-pdp__seller {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 6px;
	margin: 0;
	padding-top: 14px;
	border-top: 1px solid var(--bb-line);
	font-size: 14px;
	line-height: 1.45;
	color: var(--brina-pdp-muted);
}

.brina-pdp__seller-name {
	font-weight: 700;
	color: var(--bb-primary);
	overflow-wrap: anywhere;
}

a.brina-pdp__seller-name { text-decoration: none; }

a.brina-pdp__seller-name:hover,
a.brina-pdp__seller-name:focus-visible { text-decoration: underline; }

/* Trust / policies */
.brina-trust {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 12px;
	margin: 0;
	padding: 14px 0 0;
	list-style: none;
	border-top: 1px solid var(--bb-line);
}

.brina-trust__item {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	font-size: 13px;
	line-height: 1.35;
	color: var(--brina-pdp-ink);
}

.brina-trust__icon {
	flex: 0 0 18px;
	margin-top: -1px;
	color: var(--bb-primary);
}

.brina-trust__text { display: flex; flex-direction: column; min-width: 0; }
.brina-trust__label { font-weight: 600; }
.brina-trust__label a { color: inherit; }
.brina-trust__summary { font-size: 12px; color: var(--brina-pdp-muted); }

/* Phone: a little more air; the card spans the screen. */
@media (max-width: 767.98px) {
	.brina-pdp__buybox:not(#brina-pdp) {
		padding: 18px 16px;
		border-radius: 14px;
	}

	.brina-pdp__price .price,
	.brina-pdp__price { font-size: 23px; }
}

/* ---- 6. Below the fold ---------------------------------------------- */

.brina-pdp-below:not(#brina-pdp) {
	width: 100%;
	padding: 8px 24px 56px;
	background: #FFFFFF;
}

.brina-pdp-below__inner:not(#brina-pdp) {
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
	max-width: var(--brina-pdp-max);
	margin-inline: auto;
}

.brina-pdp-section {
	width: 100%;
	padding-top: 32px;
	border-top: 1px solid var(--brina-pdp-line);
}

.brina-pdp-section__title {
	margin: 0 0 16px;
	font-size: 22px;
	font-weight: 700;
	color: var(--brina-pdp-ink);
}

.brina-pdp-prose {
	max-width: 75ch;
	font-size: 15px;
	line-height: 1.7;
	color: #374151;
	overflow-wrap: anywhere;
}

.brina-pdp-prose > * + * {
	margin-top: 1em;
}

@media (max-width: 767.98px) {
	.brina-pdp-below:not(#brina-pdp) {
		padding-inline: 16px;
	}
}

/* =====================================================================
   Phase 3 — product header, facts, seller, trust panel, information,
   reviews, discovery rails.
   ===================================================================== */

/* ---- Product header: brand + wishlist, title, rating ---------------- */

.brina-pdp__summary:not(#brina-pdp) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	column-gap: 12px;
	align-items: start;
}

.brina-pdp__summary > .brina-pdp__id-brand  { grid-column: 1; grid-row: 1; min-width: 0; }
.brina-pdp__summary > .brina-pdp__id-wish   { grid-column: 2; grid-row: 1 / span 2; justify-self: end; }
.brina-pdp__summary > .brina-pdp__id-title  { grid-column: 1; grid-row: 2; min-width: 0; overflow-wrap: anywhere; }
.brina-pdp__summary > .brina-pdp__id-rating { grid-column: 1 / -1; grid-row: 3; }

.brina-pdp .brina-wishlist.brina-pdp__wish {
	--brina-heart-size: 26px;
	--brina-heart-hit: 44px;
	position: relative;
	top: auto;
	right: auto;
	margin: -6px -8px 0 0;
}

/* ---- About (center column): short description + buying-decision area -- */

.brina-pdp__about .brxe-product-short-description {
	font-size: 15px;
	line-height: 1.65;
	color: #374151;
}

/* ---- Buy Box V2 additions: seller line + trust panel ----------------- */

.brina-pdp__seller:not(#brina-pdp) {
	justify-content: space-between;
	align-items: center;
	gap: 6px 12px;
}

.brina-pdp__seller-line {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 6px;
	margin: 0;
	min-width: 0;
}

.brina-pdp__seller-visit {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 4px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--bb-accent, #5B4CF0);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.brina-pdp__seller-visit:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	border-radius: 6px;
}

.brina-trust-panel {
	margin: 0;
	padding: 14px 14px 12px;
	border-radius: 12px;
	background: var(--brina-pdp-stage);
}

.brina-trust-panel__title {
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--brina-pdp-muted);
}

.brina-trust-panel .brina-trust:not(#brina-pdp) {
	padding-top: 0;
	border-top: 0;
}

/* ---- Below the fold: sections -------------------------------------- */

.brina-pdp-below__inner:not(#brina-pdp) {
	gap: 48px;
}

.brina-pdp-section__title {
	font-size: clamp(20px, 2.2vw, 24px);
	letter-spacing: -.01em;
	text-wrap: balance;
}

/* About this item */
.brina-pdp-info__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
}

@media (min-width: 1024px) {
	.brina-pdp-info__grid:not(.is-single) {
		grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
		gap: 48px;
		align-items: start;
	}
}

.brina-pdp-info__main,
.brina-pdp-info__side {
	display: grid;
	gap: 28px;
	min-width: 0;
}

.brina-pdp-info__title {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
	color: var(--brina-pdp-ink);
}

.brina-pdp-info__side .brina-pdp-info__block {
	padding: 18px 18px 8px;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 14px;
	background: #FFFFFF;
}

.brina-pdp-table {
	margin: 0;
}

.brina-pdp-table__row {
	display: grid;
	grid-template-columns: minmax(110px, 42%) minmax(0, 1fr);
	gap: 14px;
	padding: 10px 0;
	border-top: 1px solid var(--brina-pdp-line);
	font-size: 14px;
	line-height: 1.45;
}

.brina-pdp-table__row:first-child {
	border-top: 0;
	padding-top: 0;
}

.brina-pdp-table dt {
	font-weight: 600;
	color: var(--brina-pdp-muted);
}

.brina-pdp-table dd {
	margin: 0;
	color: var(--brina-pdp-ink);
	overflow-wrap: anywhere;
}

.brina-pdp-prose h1,
.brina-pdp-prose h2,
.brina-pdp-prose h3,
.brina-pdp-prose h4 {
	margin: 1.4em 0 .5em;
	font-size: 17px;
	line-height: 1.35;
	font-weight: 700;
	color: var(--brina-pdp-ink);
}

.brina-pdp-list {
	margin: 0;
	padding-left: 1.2em;
	display: grid;
	gap: 6px;
	font-size: 15px;
	line-height: 1.6;
}

.brina-pdp-explore__group + .brina-pdp-explore__group {
	margin-top: 14px;
}

.brina-pdp-explore__label {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--brina-pdp-muted);
}

.brina-pdp-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
}

.brina-pdp-chip {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 6px 12px;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	color: var(--brina-pdp-ink);
	text-decoration: none;
	background: #FFFFFF;
	transition: border-color .15s ease, background-color .15s ease;
}

.brina-pdp-chip:hover {
	border-color: var(--brina-pdp-brand);
	background: var(--brina-pdp-stage);
}

.brina-pdp-chip:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

/* ---- Ratings & reviews (WooCommerce native markup) ------------------ */

.brina-reviews__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
}

@media (min-width: 1024px) {
	.brina-reviews__layout {
		grid-template-columns: 300px minmax(0, 1fr);
		gap: 48px;
		align-items: start;
	}
}

.brina-reviews__summary {
	padding: 20px;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 14px;
}

.brina-reviews__score {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0 0 14px;
}

.brina-reviews__avg {
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
}

.brina-reviews__count {
	flex-basis: 100%;
	font-size: 14px;
	color: var(--brina-pdp-muted);
}

.brina-reviews__bars {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	font-variant-numeric: tabular-nums;
}

.brina-reviews__bar {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr) 28px;
	align-items: center;
	gap: 8px;
}

.brina-reviews__track {
	height: 8px;
	border-radius: 999px;
	background: #EEF0F5;
	overflow: hidden;
}

.brina-reviews__track > span {
	display: block;
	height: 100%;
	background: #F59E0B;
}

.brina-reviews__native #reviews {
	scroll-margin-top: 96px;
}

.brina-reviews__native .woocommerce-Reviews-title {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
}

.brina-reviews__native .woocommerce-noreviews,
.brina-reviews__native .woocommerce-verification-required {
	margin: 0 0 12px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--brina-pdp-stage);
	color: var(--brina-pdp-muted);
	font-size: 14.5px;
}

.brina-reviews__native .commentlist {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 14px;
}

.brina-reviews__native .commentlist li .comment_container {
	display: flex;
	gap: 14px;
	padding: 16px;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 14px;
}

.brina-reviews__native .commentlist img.avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	float: none;
	position: static;
	padding: 0;
	border: 0;
}

.brina-reviews__native .comment-text {
	flex: 1;
	min-width: 0;
	margin: 0 !important;
	border: 0 !important;
	padding: 0 !important;
}

.brina-reviews__native .woocommerce-review__verified {
	font-size: 12.5px;
	font-weight: 600;
	color: #166534;
}

.brina-reviews__native #review_form_wrapper {
	padding: 20px;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 14px;
}

.brina-reviews__native .comment-reply-title {
	display: block;
	margin: 0 0 10px;
	font-size: 16px;
	font-weight: 700;
}

.brina-reviews__native #review_form input[type="text"],
.brina-reviews__native #review_form input[type="email"],
.brina-reviews__native #review_form textarea,
.brina-reviews__native #review_form select {
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid #CDD3E0;
	border-radius: 10px;
	font: inherit;
}

.brina-reviews__native #review_form .form-submit input[type="submit"] {
	min-height: 44px;
	padding: 10px 22px;
	border: 0;
	border-radius: 12px;
	background: var(--brina-pdp-brand);
	color: #FFFFFF;
	font-weight: 700;
	cursor: pointer;
}

.brina-reviews__native p.stars a {
	min-width: 32px;
	min-height: 32px;
}

/* ---- Discovery rails ----------------------------------------------- */

.brina-pdp-discovery {
	display: grid;
	gap: 44px;
	padding-top: 32px;
	border-top: 1px solid var(--brina-pdp-line);
}

.brina-pdp-rail {
	display: grid;
	gap: 14px;
	min-width: 0;
}

.brina-pdp-rail__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
}

.brina-pdp-rail__title {
	margin: 0;
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--brina-pdp-ink);
	text-wrap: balance;
}

.brina-pdp-rail__tools {
	display: flex;
	align-items: center;
	gap: 8px;
}

.brina-pdp-rail__action {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 6px;
	font-size: 14px;
	font-weight: 600;
	color: var(--brina-pdp-brand);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.brina-pdp-rail__nav {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid #CDD3E0;
	border-radius: 12px;
	background: #FFFFFF;
	color: var(--brina-pdp-ink);
	cursor: pointer;
}

.brina-pdp-rail__nav[hidden] { display: none; }

.brina-pdp-rail__nav:disabled {
	opacity: .35;
	cursor: default;
}

.brina-pdp-rail__nav:focus-visible,
.brina-pdp-rail__action:focus-visible,
.brina-pdp-rail__track:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

.brina-pdp-rail__track {
	--rail-gap: 16px;
	--rail-per-view: 6;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--rail-per-view) - 1) * var(--rail-gap)) / var(--rail-per-view));
	gap: var(--rail-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 2px;
	padding: 2px 2px 10px;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

.brina-pdp-rail__track > .brina-card {
	scroll-snap-align: start;
	min-width: 0;
}

@media (max-width: 1199.98px) { .brina-pdp-rail__track { --rail-per-view: 4; } }
@media (max-width: 767.98px)  { .brina-pdp-rail__track { --rail-per-view: 2.3; --rail-gap: 12px; } }
@media (max-width: 380px)     { .brina-pdp-rail__track { --rail-per-view: 2.15; } }

/* Cards in rails: the shared card, with a 44px heart hit area on touch. */
.brina-pdp-rail .brina-card .brina-wishlist {
	--brina-heart-hit: 44px;
	top: 2px;
	right: 2px;
}

/* Trust panel: one column when the panel itself is narrow (desktop Buy Box
   at 1280–1366px is ~300px wide; "Authenticity" would overflow a half column). */
.brina-trust-panel {
	container-type: inline-size;
}

@container (max-width: 250px) {
	.brina-trust-panel .brina-trust:not(#brina-pdp) {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}
}

/* ---- Buy Box refinement: delivery & shipping ----------------------------
   Rows from [brina_pdp_shipping]: shipping eligibility, delivery estimate
   (provider only), Deliver to. Icon + one short line (+ optional sub-line).
   The progress-bar rules above (.brina-fs*) stay for the shared markup,
   which the cart/checkout still renders. */

.brina-pdp__delivery:not(#brina-pdp) {
	gap: 8px;
}

.brina-dl__row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-width: 0;
	margin: 0;
}

.brina-dl__icon {
	flex: 0 0 18px;
	margin-top: 1px;
	color: var(--bb-primary, #101C3D);
}

.brina-dl__row.is-free .brina-dl__icon,
.brina-dl__row.is-free .brina-dl__main strong { color: var(--bb-ok, #166534); }

.brina-dl__text {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	margin: 0;
	font-size: 13.5px;
	line-height: 1.4;
	color: var(--brina-pdp-ink);
	overflow-wrap: anywhere;
}

.brina-dl__main strong { font-weight: 700; }

.brina-dl__sub {
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--brina-pdp-muted);
}

.brina-dl__sub[hidden] { display: none; }

.brina-dl__link {
	display: inline-block;
	padding-block: 3px; /* 24px+ target (WCAG 2.5.8) without growing the row */
	margin-block: -3px;
	font-weight: 600;
	color: var(--bb-accent, #5B4CF0);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.brina-dl__link--place { color: var(--bb-primary, #101C3D); }

.brina-dl__link:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ---- Buy Box refinement: More sellers (button + drawer) ----------------- */

.brina-offers-open {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 8px 12px;
	font: inherit;
	text-align: left;
	color: var(--brina-pdp-ink);
	background: #FFFFFF;
	border: 1px solid var(--bb-line, #E3E7EF);
	border-radius: 10px;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}

.brina-offers-open:hover { border-color: #CDD3E0; background: #FAFBFD; }

.brina-offers-open:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

.brina-offers-open__text {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 8px;
	min-width: 0;
}

.brina-offers-open__label { font-size: 14px; font-weight: 700; }

.brina-offers-open__summary { font-size: 13px; color: var(--brina-pdp-muted); }

.brina-offers-open__chev { flex: 0 0 18px; color: var(--brina-pdp-muted); }

html.brina-offers-lock { overflow: hidden; }

/* Drawer: right side on wider screens, bottom sheet on phones. */
.brina-offers {
	--offers-w: min(420px, 100vw);
	position: fixed;
	inset: 0 0 0 auto;
	width: var(--offers-w);
	max-width: 100vw;
	height: 100%;
	max-height: 100%;
	margin: 0;
	padding: 0;
	color: #111827;
	background: #FFFFFF;
	border: 0;
	box-shadow: -12px 0 40px rgba(16, 28, 61, .18);
	overflow: hidden;
}

.brina-offers::backdrop { background: rgba(10, 19, 48, .45); }

.brina-offers[open] { display: flex; }

.brina-offers__inner {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 0;
}

.brina-offers__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 18px 16px 14px 20px;
	border-bottom: 1px solid #E3E7EF;
}

.brina-offers__title {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	color: #111827;
}

.brina-offers__product {
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #4B5563;
	overflow-wrap: anywhere;
}

.brina-offers__close {
	display: flex;
	flex: 0 0 44px;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -8px -6px 0 0;
	padding: 0;
	color: #111827;
	background: transparent;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
}

.brina-offers__close:hover { background: #F1F3F8; }

.brina-offers__close:focus-visible {
	outline: 2px solid #5B4CF0;
	outline-offset: 0;
}

.brina-offers__list {
	flex: 1 1 auto;
	min-height: 0;
	margin: 0;
	padding: 4px 20px 20px;
	list-style: none;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.brina-offer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0;
	padding: 14px 0;
	border-bottom: 1px solid #EEF0F5;
}

.brina-offer__body { min-width: 0; }

.brina-offer__price {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	font-variant-numeric: lining-nums tabular-nums;
	color: #111827;
}

.brina-offer__price del { margin-right: 6px; font-size: 13px; font-weight: 500; color: #6B7280; }
.brina-offer__price ins { text-decoration: none; }

.brina-offer__seller,
.brina-offer__title,
.brina-offer__meta {
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #4B5563;
	overflow-wrap: anywhere;
}

.brina-offer__seller strong { color: #101C3D; }
.brina-offer.is-out .brina-offer__meta { color: #B42318; }

.brina-offer__cta {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	min-height: 44px;
	padding: 0 16px;
	font-size: 14px;
	font-weight: 700;
	color: #FFFFFF;
	text-decoration: none;
	white-space: nowrap;
	background: #101C3D;
	border-radius: 10px;
}

.brina-offer__cta:hover { background: #1B2B57; }

.brina-offer__cta:focus-visible {
	outline: 3px solid #5B4CF0;
	outline-offset: 2px;
}

@media (max-width: 767.98px) {
	.brina-offers {
		inset: auto 0 0 0;
		width: 100%;
		height: auto;
		max-height: 85vh;
		max-height: 85dvh;
		border-radius: 16px 16px 0 0;
		box-shadow: 0 -12px 40px rgba(16, 28, 61, .18);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.brina-offers[open] { animation: brina-offers-in .2s ease-out; }
	@keyframes brina-offers-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
	@media (max-width: 767.98px) {
		@keyframes brina-offers-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
	}
}

/* ---- Buy Box refinement: policy links (only when a published page exists)
   The panel keeps its look; a linked label gets an understated underline. */

.brina-trust__label a {
	text-decoration: underline;
	text-decoration-color: rgba(17, 24, 39, .35);
	text-underline-offset: 3px;
}

.brina-trust__label a:hover { text-decoration-color: currentColor; }

.brina-trust__label a:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ---- Owner review: Ships by, quantity limit tip, Add to Cart toast ------ */

/* "Ships by" is a secondary line of the shipping row (same weight as the
   rule line), never competing with price, stock or the buttons. */
.brina-dl__ships { display: block; }

.brina-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Quantity limit tip: floats above the quantity control (no layout shift). */
.brina-pdp__buybox form.cart { position: relative; }

.brina-qty-tip {
	position: absolute;
	left: 50%;
	z-index: 5;
	width: max-content; /* one line when it fits (left: 50% would otherwise halve the width) */
	max-width: calc(100% - 16px);
	padding: 6px 10px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
	color: #FFFFFF;
	background: #111827;
	border-radius: 8px;
	box-shadow: 0 4px 14px rgba(16, 28, 61, .2);
	transform: translate(-50%, -100%);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .15s ease, visibility 0s linear .15s;
}

.brina-qty-tip.is-visible {
	opacity: 1;
	visibility: visible;
	transition: opacity .15s ease;
}

/* Add to Cart toast */
.brina-toast {
	position: fixed;
	/* Top-center, just below the header/navigation. The header is not sticky,
	   so the controller sets --brina-toast-top from its rendered bottom (+12px,
	   never above 12px from the viewport top); the value here is the no-JS
	   fallback. Centred with auto margins: transform belongs to the animation. */
	top: var(--brina-toast-top, 170px);
	right: 0;
	left: 0;
	margin: 0 auto;
	z-index: 2147483000; /* above third-party widgets (chat, sign-up forms) */
	display: flex;
	align-items: center;
	gap: 10px;
	width: min(400px, calc(100vw - 32px));
	padding: 12px 8px 12px 14px;
	color: #111827;
	background: #FFFFFF;
	border: 1px solid #E3E7EF;
	border-left: 4px solid #16A34A;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(16, 28, 61, .18);
	box-sizing: border-box;
	/* Visible from the first paint (no script needed to show it). Without
	   JavaScript it fades out after 12 s; the inline controller replaces that
	   with the 4 s behaviour (.is-managed). */
	animation: brina-toast-in .2s ease-out both, brina-toast-out .25s ease-in 12s forwards;
}

.brina-toast.is-managed { animation: brina-toast-in .2s ease-out both; }

.brina-toast.is-out {
	animation: brina-toast-out .2s ease-in forwards;
	pointer-events: none;
}

.brina-toast[hidden] { display: none; }

@keyframes brina-toast-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: none; }
}

@keyframes brina-toast-out {
	to { opacity: 0; transform: translateY(8px); visibility: hidden; }
}

.brina-toast__icon { flex: 0 0 20px; color: #16A34A; }

.brina-toast__msg {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	font-size: 14px;
	line-height: 1.35;
}

/* Long names are cut to one line; "added to cart" is always visible. */
.brina-toast__name {
	display: block;
	overflow: hidden;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.brina-toast__tail { display: block; }

.brina-toast__link {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 8px;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	color: #5B4CF0;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.brina-toast__close {
	flex: 0 0 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	color: #4B5563;
	background: transparent;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
}

.brina-toast__close:hover { background: #F1F3F8; }

.brina-toast__link:focus-visible,
.brina-toast__close:focus-visible {
	outline: 2px solid #5B4CF0;
	outline-offset: 2px;
	border-radius: 8px;
}

@media (max-width: 767.98px) {
	.brina-toast {
		top: var(--brina-toast-top, 247px);
		right: 16px;
		left: 16px;
		width: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	.brina-qty-tip { transition: none; }
	.brina-toast { animation: brina-toast-out .01s linear 12s forwards; }
	.brina-toast.is-managed { animation: none; }
	.brina-toast.is-out { animation: brina-toast-out .01s linear forwards; }
}

/* ---- Compact purchase information (between Deliver to and Sold by) ----- */

/* Same scale as the Delivery & Shipping text (13.5px / 400, 18px line
   icons); hairline separator; no heading, card or background. */
.brina-pdp__pinfo {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 16px; /* = the Buy Box stack gap before the Sold by separator */
	padding: 14px 0 0;
	border-top: 1px solid var(--bb-line);
	list-style: none;
}

.brina-pi__row {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	margin: 0;
	font-size: 13.5px;
	line-height: 1.4;
	color: var(--brina-pdp-ink);
}

.brina-pi__icon { margin-top: 0; }

.brina-pi__label {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: anywhere;
}

/* Info control: 24px target (WCAG 2.5.8) that does not grow the 19px row;
   32px on phones. */
.brina-pi__info {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin: -2.5px -4px -2.5px 0;
	padding: 0;
	color: var(--brina-pdp-muted);
	background: none;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.brina-pi__info:hover { color: var(--bb-primary, #101C3D); background: #F1F3F8; }

.brina-pi__row:has(.brina-pi__pop:popover-open) .brina-pi__info { color: var(--bb-primary, #101C3D); background: #F1F3F8; }

.brina-pi__info:focus-visible,
.brina-pi__close:focus-visible,
.brina-pi__link:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
}

/* Popover (top layer). Fallback without CSS anchor positioning: a compact
   card at the bottom of the viewport. */
.brina-pi__pop {
	position: fixed;
	inset: auto 0 16px 0;
	width: min(300px, calc(100vw - 32px));
	height: auto;
	margin: 0 auto;
	padding: 12px 40px 12px 14px;
	overflow: visible;
	color: var(--brina-pdp-ink);
	background: #FFFFFF;
	border: 1px solid #E3E7EF;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(16, 28, 61, .18);
	box-sizing: border-box;
	font-size: 13px;
	line-height: 1.45;
	text-align: left;
}

/* Anchored beside its control (to the left, top-aligned): the card covers
   labels only, never another row's info control, so a second control can be
   activated directly (popover="auto" then closes the first). Flips upward
   near the bottom of the viewport; keeps 8px from the viewport edge. */
@supports (anchor-name: --a) {
	.brina-pi__pop {
		inset: auto;
		width: auto;
		max-width: 300px;
		margin: -3px 6px 0 8px;
		position-area: inline-start span-block-end;
		position-try-fallbacks: --brina-pi-up;
	}

	@position-try --brina-pi-up {
		position-area: inline-start span-block-start;
		margin: 0 6px -3px 8px;
	}
}

@supports not selector(:popover-open) {
	.brina-pi__pop { display: none; }
}

.brina-pi__pop-title {
	margin: 0 0 4px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.35;
}

.brina-pi__pop-text { margin: 0; color: var(--brina-pdp-muted); }

.brina-pi__links {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	margin: 8px 0 0;
}

.brina-pi__link {
	display: inline-block;
	padding-block: 3px;
	margin-block: -3px;
	font-weight: 600;
	color: var(--bb-primary, #101C3D);
	text-decoration: underline;
	text-decoration-color: rgba(16, 28, 61, .35);
	text-underline-offset: 3px;
}

.brina-pi__close {
	position: absolute;
	top: 6px;
	right: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	color: var(--brina-pdp-muted);
	background: none;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.brina-pi__close:hover { background: #F1F3F8; color: var(--brina-pdp-ink); }

@media (max-width: 767.98px) {
	/* Easier thumb targets on phones (32px, rows spaced so targets never overlap). */
	.brina-pdp__pinfo { gap: 13px; }
	.brina-pi__info { width: 32px; height: 32px; margin: -6.5px -8px -6.5px 0; }
	.brina-pi__close { width: 32px; height: 32px; top: 4px; right: 4px; }
}

/* =====================================================================
   Phase 4 — complete marketplace product page
   ===================================================================== */

/* ---- Info area inside the main grid (desktop: under gallery + centre) -- */

.brina-pdp__info-area .brina-pdp-section {
	margin-top: 12px;
	padding-top: 28px;
}

@media (min-width: 1200px) {
	/* Two columns inside the ~2/3-width info area. */
	.brina-pdp__info-area .brina-pdp-info__grid:not(.is-single) {
		grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
		gap: 36px;
	}
}

@media (max-width: 1023.98px) and (min-width: 700px) {
	/* Tablet: description beside the details instead of one long column. */
	.brina-pdp__info-area .brina-pdp-info__grid:not(.is-single) {
		grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
		gap: 28px;
		align-items: start;
	}
}

/* ---- Category context ------------------------------------------------ */

.brina-pdp__context ol {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 0;
	margin: 0 0 6px;
	padding: 0;
	list-style: none;
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--brina-pdp-muted);
}

.brina-pdp__context li + li::before {
	content: "›";
	margin: 0 6px;
	color: #9CA3AF;
}

.brina-pdp__context a {
	display: inline-block;
	padding-block: 4px; /* ≥ 24px target */
	color: inherit;
	text-decoration: none;
}

.brina-pdp__context a:hover { color: var(--brina-pdp-navy); text-decoration: underline; }

.brina-pdp__context a:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ---- Rating summary (centre column) ---------------------------------- */

.brina-pdp-stars--md { width: 88px; height: 17px; }
.brina-pdp-stars--lg { width: 124px; height: 24px; }

/* ---- About the brand ------------------------------------------------- */

.brina-pdp-info__block--brand {
	padding: 18px 20px;
	border-radius: 14px;
	background: var(--brina-pdp-stage);
}

.brina-pdp-brand__text {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.65;
	color: #374151;
}

.brina-pdp-brand__link { margin: 10px 0 0; }

.brina-pdp-brand__link a {
	display: inline-block;
	padding-block: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--brina-pdp-brand);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---- Gallery: clean in-place zoom, thumbnails -------------------------- */

.brina-pdp .woocommerce-product-gallery__image { overflow: hidden; }

.brina-pdp .woocommerce-product-gallery__image img:not(#brina-pdp) {
	transform-origin: 50% 50%;
	transition: transform .18s ease-out;
	will-change: auto;
}

.brina-pdp .woocommerce-product-gallery__image.is-zoomable a { cursor: zoom-in; }

.brina-pdp .woocommerce-product-gallery__image.is-zoomed img:not(#brina-pdp) {
	transition-duration: .08s;
}

@media (prefers-reduced-motion: reduce) {
	.brina-pdp .woocommerce-product-gallery__image img:not(#brina-pdp) { transition: none; }
}

.brina-pdp ol.flex-control-thumbs img:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	opacity: 1;
}

/* ---- 360° viewer (only rendered for products with a real sequence) ---- */

.brina-spin-open {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 9;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	padding: 0 14px;
	border: 0;
	border-radius: 12px;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 1px 3px rgba(16, 28, 61, .16);
	color: var(--brina-pdp-brand, #101C3D);
	font: 600 13.5px/1 inherit;
	cursor: pointer;
}

.brina-spin-open[hidden] { display: none; }

.brina-pdp__gallery:has(ol.flex-control-thumbs) .brina-spin-open { left: 10px; }

@media (min-width: 1024px) {
	.brina-pdp__gallery:has(ol.flex-control-thumbs) .brina-spin-open { left: 96px; }
}

.brina-spin {
	width: min(900px, calc(100vw - 32px));
	max-height: calc(100dvh - 32px);
	padding: 20px;
	border: 0;
	border-radius: 16px;
	box-shadow: 0 24px 60px rgba(16, 28, 61, .3);
}

.brina-spin::backdrop { background: rgba(16, 28, 61, .55); }

.brina-spin__stage {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	max-height: calc(100dvh - 220px);
	margin: 0 auto;
	border-radius: 12px;
	background: #F6F7FB;
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
}

.brina-spin__stage.is-dragging { cursor: grabbing; }

.brina-spin__stage img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	pointer-events: none;
	-webkit-user-drag: none;
}

.brina-spin__stage:focus-visible { outline: 2px solid #5B4CF0; outline-offset: 2px; }

.brina-spin__help,
.brina-spin__status { margin: 8px 0 0; font-size: 13px; color: #4B5563; text-align: center; }

.brina-spin__controls { display: grid; gap: 8px; margin-top: 10px; }

.brina-spin__range { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 10px; font-size: 13px; font-weight: 600; }

.brina-spin__range input { width: 100%; min-height: 32px; accent-color: #101C3D; }

.brina-spin__close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 12px;
	background: #FFFFFF;
	color: #111827;
	cursor: pointer;
}

.brina-spin__close:focus-visible,
.brina-spin-open:focus-visible { outline: 2px solid #5B4CF0; outline-offset: 2px; }

/* ---- Ratings & reviews ------------------------------------------------- */

.brina-reviews__summary {
	display: grid;
	align-content: start;
	gap: 10px;
	background: #FFFFFF;
}

.brina-reviews__score { margin: 0; }

.brina-reviews__count { margin: 0; flex-basis: auto; }

.brina-reviews__bar { grid-template-columns: 34px minmax(0, 1fr) 28px; }

.brina-reviews__bar-label { white-space: nowrap; color: var(--brina-pdp-muted); }

.brina-reviews__bar-n { text-align: right; }

.brina-reviews__summary.is-empty { background: var(--brina-pdp-stage); border-color: transparent; }

.brina-reviews__empty-title {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	color: var(--brina-pdp-ink);
}

.brina-reviews__note {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--brina-pdp-muted);
}

.brina-reviews__write {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	justify-self: start;
	min-height: 44px;
	padding: 0 20px;
	border: 1px solid var(--brina-pdp-brand);
	border-radius: 12px;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--brina-pdp-brand);
	text-decoration: none;
}

.brina-reviews__write:hover { background: var(--brina-pdp-stage); }

.brina-reviews__write:focus-visible { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

/* WooCommerce's own "no reviews" line is covered by the summary card. */
.brina-reviews__native .woocommerce-noreviews { display: none; }

.brina-reviews__native .woocommerce-Reviews-title { font-size: 16px; }

.brina-review__rating {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 4px;
	font-size: 13px;
	font-weight: 600;
	color: var(--brina-pdp-ink);
}

.brina-reviews__native .commentlist .meta {
	margin: 0 0 6px;
	font-size: 13.5px;
	color: var(--brina-pdp-muted);
}

.brina-reviews__native .commentlist .description p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #1F2937;
	overflow-wrap: anywhere;
}

/* Interactive 1–5 star input (radios; works without JavaScript). */
.brina-stars-input {
	margin: 0 0 14px;
	padding: 0;
	border: 0;
}

.brina-stars-input__legend {
	margin: 0 0 6px;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
}

.brina-stars-input__group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px;
}

.brina-stars-input__radio {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.brina-stars-input__star {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	cursor: pointer;
}

.brina-stars-input__star svg {
	fill: #FFFFFF;
	stroke: #9CA3AF;
	stroke-width: 1.6;
	stroke-linejoin: round;
	transition: fill .1s ease, stroke .1s ease;
}

.brina-stars-input__radio:focus-visible + .brina-stars-input__star {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 1px;
}

/* Hover preview (pointer devices) and selected state: stars 1..n filled. */
@media (hover: hover) {
	.brina-stars-input__group:has(.brina-stars-input__star:nth-of-type(1):hover) .brina-stars-input__star:nth-of-type(-n+1) svg,
	.brina-stars-input__group:has(.brina-stars-input__star:nth-of-type(2):hover) .brina-stars-input__star:nth-of-type(-n+2) svg,
	.brina-stars-input__group:has(.brina-stars-input__star:nth-of-type(3):hover) .brina-stars-input__star:nth-of-type(-n+3) svg,
	.brina-stars-input__group:has(.brina-stars-input__star:nth-of-type(4):hover) .brina-stars-input__star:nth-of-type(-n+4) svg,
	.brina-stars-input__group:has(.brina-stars-input__star:nth-of-type(5):hover) .brina-stars-input__star:nth-of-type(-n+5) svg {
		fill: #FCD34D;
		stroke: #D97706;
	}
}

.brina-stars-input__group:has(#brina-rating-1:checked) .brina-stars-input__star:nth-of-type(-n+1) svg,
.brina-stars-input__group:has(#brina-rating-2:checked) .brina-stars-input__star:nth-of-type(-n+2) svg,
.brina-stars-input__group:has(#brina-rating-3:checked) .brina-stars-input__star:nth-of-type(-n+3) svg,
.brina-stars-input__group:has(#brina-rating-4:checked) .brina-stars-input__star:nth-of-type(-n+4) svg,
.brina-stars-input__group:has(#brina-rating-5:checked) .brina-stars-input__star:nth-of-type(-n+5) svg {
	fill: #F59E0B;
	stroke: #B45309;
}

/* Selected-state text (visual; screen readers get the checked radio). */
.brina-stars-input__value {
	margin-left: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--brina-pdp-ink);
}

.brina-stars-input__group:has(#brina-rating-1:checked) .brina-stars-input__value::after { content: "1 of 5 · Very poor"; }
.brina-stars-input__group:has(#brina-rating-2:checked) .brina-stars-input__value::after { content: "2 of 5 · Not that bad"; }
.brina-stars-input__group:has(#brina-rating-3:checked) .brina-stars-input__value::after { content: "3 of 5 · Average"; }
.brina-stars-input__group:has(#brina-rating-4:checked) .brina-stars-input__value::after { content: "4 of 5 · Good"; }
.brina-stars-input__group:has(#brina-rating-5:checked) .brina-stars-input__value::after { content: "5 of 5 · Perfect"; }

.brina-pdp .screen-reader-text,
.brina-pdp-below .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	.brina-stars-input__star svg { transition: none; }
}

/* Review list: compact cards, no inner divider, local initial avatar. */
.brina-reviews__native .commentlist li { margin: 0; }

.brina-reviews__native .commentlist li .comment_container { align-items: flex-start; padding: 16px 18px; }

.brina-reviews__native .commentlist .description {
	margin: 0;
	padding: 0;
	border: 0;
}

.brina-review__avatar {
	display: inline-flex;
	flex: 0 0 36px;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #E8EBF3;
	color: var(--brina-pdp-brand);
	font-size: 15px;
	font-weight: 700;
}

/* =====================================================================
   Phase 4 owner review — product header rhythm, rating row, decision
   area, verified-purchase reviews, review photos, Helpful
   ===================================================================== */

/* ---- Header rhythm: title → rating → short description ----------------- */

.brina-pdp .brina-pdp__summary h1:not(#brina-pdp) { margin-bottom: 2px; }

/* Title weight: 600 (a real Semibold face in SF Pro / Segoe UI; where the
   system font has no 600 the browser uses its real Bold face — never a
   synthesized weight). Size, line-height and width are unchanged. */
.brina-pdp .brina-pdp__summary h1:not(#brina-pdp) { font-weight: 600; }

.brina-pdp__rating:not(#brina-pdp) { margin: 0; }

.brina-pdp__about .brxe-product-short-description:not(#brina-pdp) { margin-top: 0; margin-bottom: 0; }

@media (min-width: 1200px) {
	/* The rating and the short description read as one group. */
	.brina-pdp__about:not(#brina-pdp) { margin-top: -7px; }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
	.brina-pdp__about:not(#brina-pdp) { margin-top: 0; }
}

/* ---- Rating row -------------------------------------------------------- */

.brina-rating-row {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 7px;
	min-height: 24px; /* ≥ 24px target (WCAG 2.5.8) */
	padding: 0;
	border: 0;
	background: none;
	color: var(--brina-pdp-ink);
	font: inherit;
	font-size: 13px;
	line-height: 1.4;
	text-decoration: none !important;
	cursor: pointer;
}

.brina-rating-row--static { cursor: default; color: var(--brina-pdp-muted); }

.brina-rating-row__avg { font-weight: 600; }

/* Owner polish: the top-row stars are ~18% smaller than the shared 88×17
   star (review summary and cards keep theirs). */
.brina-rating-row .brina-pdp-stars--md { width: 72px; height: 14px; }

.brina-rating-row__count { color: var(--brina-pdp-muted); }

.brina-rating-row__cta {
	font-weight: 500;
	color: var(--brina-pdp-brand);
	text-decoration: underline;
	text-decoration-color: rgba(16, 28, 61, .35);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.brina-rating-row:hover .brina-rating-row__cta,
.brina-rating-row:focus-visible .brina-rating-row__cta { text-decoration-color: currentColor; }

.brina-rating-row:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 2px;
	border-radius: 6px;
}

/* Verified-purchase explanation (native popover, anchored under the row). */
.brina-rating-note {
	position: fixed;
	inset: auto 0 16px 0;
	width: min(320px, calc(100vw - 32px));
	margin: 0 auto;
	padding: 12px 40px 12px 14px;
	color: var(--brina-pdp-ink);
	background: #FFFFFF;
	border: 1px solid #E3E7EF;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(16, 28, 61, .18);
	box-sizing: border-box;
	font-size: 13px;
	line-height: 1.45;
}

@supports (anchor-name: --a) {
	.brina-rating-note {
		inset: auto;
		margin: 6px 0 0;
		position-area: block-end span-inline-end;
		position-try-fallbacks: flip-block;
	}
}

@supports not selector(:popover-open) {
	.brina-rating-note { display: none; }
}

.brina-rating-note__title { margin: 0 0 4px; font-weight: 700; }

.brina-rating-note__text { margin: 0; color: var(--brina-pdp-muted); }

.brina-rating-note__links { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 8px 0 0; }

.brina-rating-note__link {
	display: inline-block;
	padding-block: 3px;
	font-weight: 600;
	color: var(--brina-pdp-brand);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.brina-rating-note__close {
	position: absolute;
	top: 6px;
	right: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--brina-pdp-muted);
	cursor: pointer;
}

.brina-rating-note__close:focus-visible,
.brina-rating-note__link:focus-visible { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

/* ---- Buying-decision area ---------------------------------------------- */

.brina-pdp-decision {
	display: grid;
	gap: 16px;
	margin: 14px 0 0;
}

.brina-pdp-decision__block { min-width: 0; }

.brina-pdp-decision .brina-pdp-decision__title:not(#brina-pdp) {
	margin: 0 0 6px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--brina-pdp-ink);
}

.brina-pdp-decision__notes,
.brina-pdp-decision__bullets {
	margin: 0;
	padding: 0 0 0 18px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--brina-pdp-ink);
	overflow-wrap: anywhere;
}

.brina-pdp-decision__notes { padding-left: 0; list-style: none; }

.brina-pdp-decision__notes li + li,
.brina-pdp-decision__bullets li + li { margin-top: 3px; }

.brina-pdp-decision__bullets li { list-style: disc; }

.brina-pdp-decision__bullets li::marker { color: var(--brina-pdp-muted); }

.brina-pdp-decision__label { font-weight: 600; }

/* Variation options (drive WooCommerce's own variation form). */
.brina-pdp-decision__variations { display: grid; gap: 14px; }

.brina-pdp-decision__variations[hidden] { display: none; }

.brina-var { margin: 0; padding: 0; border: 0; min-width: 0; }

.brina-var__legend {
	margin: 0 0 8px;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--brina-pdp-ink);
}

.brina-var__current { margin-left: 6px; font-weight: 400; color: var(--brina-pdp-muted); }

.brina-var__options { display: flex; flex-wrap: wrap; gap: 8px; }

.brina-var__option { position: relative; display: inline-flex; }

.brina-var__radio {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.brina-var__option span {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 16px;
	border: 1px solid #CDD3E0;
	border-radius: 10px;
	background: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	color: var(--brina-pdp-ink);
}

.brina-var__radio:checked + span {
	border-color: var(--brina-pdp-brand);
	box-shadow: inset 0 0 0 1px var(--brina-pdp-brand);
	font-weight: 700;
}

.brina-var__radio:focus-visible + span { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

.brina-var__radio:disabled { cursor: not-allowed; }

.brina-var__radio:disabled + span {
	color: #9CA3AF;
	background: #F6F7FB;
	border-style: dashed;
	text-decoration: line-through;
}

.brina-var__reset {
	justify-self: start;
	min-height: 32px;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--brina-pdp-brand);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.brina-var__reset[hidden] { display: none; }

.brina-var__status:empty { display: none; }

.brina-var__status { margin: 0; font-size: 13.5px; color: var(--brina-pdp-muted); }

/* WooCommerce's selects stay the source of truth, hidden once the options above are active. */
.brina-pdp form.variations_form.brina-has-options table.variations { display: none; }

/* ---- Reviews: verified purchase, photos, Helpful -------------------------- */

.brina-reviews__native .woocommerce-verification-required { display: none; } /* stated in the summary card */

.brina-review__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
}

.brina-review__verified {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12.5px;
	font-weight: 700;
	color: #166534;
}

.brina-review__photos {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.brina-review__photo {
	display: block;
	width: 76px;
	height: 76px;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 10px;
	background: #F6F7FB;
	cursor: zoom-in;
}

.brina-review__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }

.brina-review__photo:focus-visible { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

.brina-photo-viewer {
	width: min(960px, calc(100vw - 32px));
	max-height: calc(100dvh - 32px);
	padding: 16px;
	border: 0;
	border-radius: 16px;
	background: #FFFFFF;
}

.brina-photo-viewer::backdrop { background: rgba(16, 28, 61, .6); }

.brina-photo-viewer img {
	display: block;
	max-width: 100%;
	max-height: calc(100dvh - 120px);
	margin: 0 auto;
	object-fit: contain;
}

.brina-photo-viewer__caption { margin: 8px 44px 0 0; font-size: 13px; color: #4B5563; }

.brina-photo-viewer__close {
	position: absolute;
	top: 8px;
	right: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 12px;
	background: rgba(255, 255, 255, .92);
	color: #111827;
	cursor: pointer;
}

.brina-photo-viewer__close:focus-visible { outline: 2px solid #5B4CF0; outline-offset: 2px; }

.brina-helpful {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	margin: 12px 0 0;
	font-size: 13px;
	color: var(--brina-pdp-muted);
}

.brina-helpful__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid #CDD3E0;
	border-radius: 999px;
	background: #FFFFFF;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--brina-pdp-ink);
	cursor: pointer;
}

.brina-helpful__btn:hover:not(:disabled) { border-color: var(--brina-pdp-brand); }

.brina-helpful__btn[aria-pressed="true"] { border-color: #166534; color: #166534; cursor: default; }

.brina-helpful__btn:focus-visible { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

.brina-helpful__count[hidden],
.brina-helpful__msg:empty { display: none; }

/* ---- Review composer: photo picker -------------------------------------- */

.brina-reviews__native #review_form .comment-form-rating legend,
.brina-reviews__native #review_form .comment-form-comment label,
.brina-review-photos__label {
	display: block;
	margin: 0 0 6px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--brina-pdp-ink);
}

.brina-review-photos__label span { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--brina-pdp-muted); }

.brina-review-photos { margin: 0 0 16px; }

.brina-review-photos__pick {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 16px;
	border: 1px dashed #9CA3AF;
	border-radius: 10px;
	background: #FFFFFF;
	font-size: 14px;
	font-weight: 600;
	color: var(--brina-pdp-brand);
	cursor: pointer;
}

.brina-review-photos__input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.brina-review-photos__pick:focus-within { outline: 2px solid var(--brina-pdp-focus); outline-offset: 2px; }

.brina-review-photos__help { margin: 6px 0 0; font-size: 12.5px; color: var(--brina-pdp-muted); }

.brina-review-photos__preview {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.brina-review-photos__preview:empty { display: none; }

.brina-review-photos__preview img {
	display: block;
	width: 64px;
	height: 64px;
	object-fit: cover;
	border: 1px solid var(--brina-pdp-line);
	border-radius: 8px;
}

.brina-review-photos__error { margin: 6px 0 0; font-size: 13px; font-weight: 600; color: #B42318; }

.brina-review-photos__error:empty { display: none; }

/* ---- Variable products: same Buy Box geometry as simple products --------
   WooCommerce wraps a variable product's quantity + buttons in
   .woocommerce-variation-add-to-cart (not direct children of form.cart), so
   the form's 10px rhythm did not reach them: the quantity control and both
   buttons touched. The wrapper gets the same column + gap. WooCommerce's
   own per-variation price / availability lines are not repeated inside the
   form: the Buy Box price and stock above show the selected variation
   (a variation description, when one exists, still shows). */
.brina-pdp__buybox .cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Bricks gives .single_variation a 30px bottom margin; with its price and
   availability not repeated it would leave an empty band. */
.brina-pdp__buybox .cart .single_variation:not(#brina-pdp) {
	margin: 0;
}

.brina-pdp__buybox .cart .single_variation .woocommerce-variation-price,
.brina-pdp__buybox .cart .single_variation .woocommerce-variation-availability {
	display: none;
}

.brina-pdp__buybox .cart .single_variation .woocommerce-variation-description:not(:empty) {
	margin: 0 0 2px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--brina-pdp-muted);
}

.brina-pdp__buybox .brina-pdp__stock[hidden] { display: none; }

/* ======================================================================
   Lower content refinement (2026-09-30): description density + compact
   "You may also like" block in the About-this-item side column. Scoped to
   .brina-pdp-info; nothing above it (gallery, header, Buy Box) is touched.
   ====================================================================== */

/* "About this item": one step smaller (was clamp(20px, 2.2vw, 24px)). */
.brina-pdp-info > .brina-pdp-section__title:not(#brina-pdp) {
	font-size: clamp(19px, 1.9vw, 21px);
}

/* "Description": slightly smaller (was 17px); still above the body. */
.brina-pdp-info__main > #description > .brina-pdp-info__title:not(#brina-pdp) {
	margin-bottom: 10px;
	font-size: 16px;
}

/* Description body: denser, still comfortable (was 1.7 / 1em gaps). */
.brina-pdp-info__main > #description .brina-pdp-prose:not(#brina-pdp) {
	line-height: 1.6;
}

.brina-pdp-info__main > #description .brina-pdp-prose:not(#brina-pdp) > * + * {
	margin-top: .7em;
}

.brina-pdp-info__main > #description .brina-pdp-prose:not(#brina-pdp) > :first-child {
	margin-top: 0;
}

/* Informational subheadings inside the description (e.g. "Fragrance
   Notes"): bold body size under the 16px Description heading, tighter gaps. */
.brina-pdp-info__main > #description .brina-pdp-prose:not(#brina-pdp) :is(h1, h2, h3, h4) {
	margin: 1.05em 0 .3em;
	font-size: 15px;
	line-height: 1.4;
}

.brina-pdp-info__main > #description .brina-pdp-prose:not(#brina-pdp) :is(h1, h2, h3, h4) + * {
	margin-top: 0;
}

/* ---- Compact "You may also like" (side column) ----------------------- */

.brina-pdp-info__side .brina-pdp-info__block--discover {
	padding-bottom: 12px;
}

.brina-pdp-mini {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.brina-pdp-mini__item {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid var(--brina-pdp-line);
}

.brina-pdp-info__block--discover[hidden],
.brina-pdp-mini__item[hidden] {
	display: none;
}

.brina-pdp-mini__item:first-child {
	border-top: 0;
	padding-top: 0;
}

.brina-pdp-mini__link {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: 12px;
	min-width: 0;
	border-radius: 10px;
	color: var(--brina-pdp-ink);
	text-decoration: none;
}

.brina-pdp-mini__media {
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: 10px;
	background: var(--brina-pdp-stage, #F6F7FB);
}

.brina-pdp-mini__img {
	display: block;
	width: 100%;
	height: 100%;
	padding: 6px;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.brina-pdp-mini__body {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.brina-pdp-mini__title {
	display: -webkit-box;
	overflow: hidden;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.35;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.brina-pdp-mini__price {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--brina-pdp-ink);
}

.brina-pdp-mini__price del {
	margin-right: 4px;
	font-size: .86em;
	font-weight: 500;
	color: var(--brina-pdp-muted);
}

.brina-pdp-mini__price ins {
	text-decoration: none;
	color: #C92F55;
}

.brina-pdp-mini__link:hover .brina-pdp-mini__title {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.brina-pdp-mini__link:focus-visible {
	outline: 2px solid var(--brina-pdp-focus);
	outline-offset: 3px;
}

/* The shared wishlist toggle, in the row instead of over a card image. */
.brina-pdp-mini__item .brina-wishlist:not(#brina-pdp) {
	position: static;
	flex: 0 0 auto;
	margin: 0;
}

/* Below 700px the side column stacks under the description; the full
   discovery rails further down already serve small screens. */
@media (max-width: 699.98px) {
	.brina-pdp-info__side .brina-pdp-info__block--discover {
		display: none;
	}
}

/* ======================================================================
   Compact recommendation rails (2026-09-30): ~8 cards per view on wide
   desktops. Product page only — every selector is nested under
   .brina-pdp-rail (rendered solely by [brina_pdp_recommendations]); the
   shared .brina-card component and every other page are untouched.
   Card content, order, links, prices (single-price rule) and the YITH
   wishlist toggle are unchanged; only size, spacing and type scale.
   ====================================================================== */

/* Cards per view (was 6 on every desktop width, 4 below 1200px). */
@media (min-width: 1360px) {
	.brina-pdp-rail .brina-pdp-rail__track:not(#brina-pdp) { --rail-per-view: 8; --rail-gap: 14px; }
}

@media (min-width: 1200px) and (max-width: 1359.98px) {
	.brina-pdp-rail .brina-pdp-rail__track:not(#brina-pdp) { --rail-per-view: 7; --rail-gap: 14px; }
}

@media (min-width: 1024px) and (max-width: 1199.98px) {
	.brina-pdp-rail .brina-pdp-rail__track:not(#brina-pdp) { --rail-per-view: 5; --rail-gap: 14px; }
}

/* Compact card composition where cards are ~150–165px wide. The square
   image (aspect-ratio 1/1, same object-fit) scales with the card. */
@media (min-width: 1200px) {
	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__body {
		gap: 3px;
		padding: 7px 8px 9px;
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__brand {
		font-size: 10.5px;
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__title {
		font-size: 12.5px;
		line-height: 1.3;
		min-height: calc(2em * 1.3);
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__price {
		column-gap: 5px;
		font-size: 13px;
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__price del {
		margin-right: 2px;
		font-size: .88em;
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-card__discount {
		font-size: 10.5px;
	}

	.brina-pdp-rail .brina-card--standard:not(#brina-pdp) .brina-wishlist {
		--brina-heart-size: 18px;
		--brina-heart-hit: 36px;
		top: 2px;
		right: 2px;
	}
}

/* =====================================================================
   PHONE PDP (<= 767.98px; 2026-10-05, owner)
   ---------------------------------------------------------------------
   Same template (1362) and sections as tablet/desktop, re-ordered and
   lightened for phone:
     identity (brand · rating · title · returns cue)
     gallery (full width, white, dots, wishlist + share on the image)
     buy box (price · options · stock · shipping · seller · trust) — open,
       separated by hairlines instead of one big card
     Add to cart fixed to the bottom (the real WooCommerce button)
     about (details · highlights) · info (description · specs …)
     reviews · recommendations (More from the seller first)
   Pieces added: returns cue (inc/brina-pdp-phone.php), dots/share
   (assets/js/brina-pdp-phone.js). Tablet/desktop: nothing below applies
   except hiding the returns cue.
   ===================================================================== */
.brina-pdp-m-returns,
.brina-pdp-m-tools,
.brina-pdp-m-dots,
.brina-pdp-m-options:empty {
	display: none;
}

@media (max-width: 767.98px) {

	/* ---- Document: no sideways drift (the gallery swipes inside itself) ---- */
	html:has(body.single-product),
	body.single-product {
		max-width: 100%;
		overflow-x: hidden;
		overflow-x: clip;
		overscroll-behavior-x: none;
	}

	/* ---- Order: identity · gallery · buy box · about · info ---- */
	.brina-pdp__main:not(#brina-pdp) {
		grid-template-areas:
			"summary"
			"gallery"
			"buy"
			"about"
			"info";
		row-gap: 18px;
	}

	.brina-pdp:not(#brina-pdp) {
		padding-top: 12px;
	}

	/* ---- 1. Identity: brand · rating · title · returns ---- */
	.brina-pdp .brina-pdp__summary:not(#brina-pdp) {
		display: flex;
		flex-direction: column;
		gap: 4px;
	}

	.brina-pdp__summary > .brina-pdp__id-brand { order: 1; }
	.brina-pdp__summary > .brina-pdp__id-rating { order: 2; }
	.brina-pdp__summary > .brina-pdp__id-title { order: 3; }
	.brina-pdp__summary > .brina-pdp-m-returns { order: 4; }
	.brina-pdp__summary > .brina-pdp__id-wish { order: 5; }

	.brina-pdp__summary .brina-pdp__context {
		font-size: 12px;
	}

	.brina-pdp__summary .brina-pdp__brand,
	.brina-pdp__summary .brina-pdp__brand a {
		margin: 0;
		font-size: 13px;
		letter-spacing: .04em;
	}

	.brina-pdp .brina-pdp__summary h1:not(#brina-pdp) {
		margin: 2px 0 0;
		font-size: 20px;
		line-height: 1.3;
		overflow-wrap: anywhere;
	}

	.brina-pdp-m-returns {
		display: block;
		margin: 4px 0 0;
		font-size: 13px;
		line-height: 1.3;
	}

	.brina-pdp-m-returns__link,
	.brina-pdp-m-returns > svg {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		color: #166534;
		text-decoration: none;
	}

	.brina-pdp-m-returns__label {
		font-weight: 600;
	}

	.brina-pdp-m-returns__days {
		color: #5F6B7C;
	}

	.brina-pdp-m-returns__days::before {
		content: "·";
		margin: 0 6px 0 0;
		color: #9AA3B2;
	}

	/* ---- 2. Gallery: full width, white stage, dots, tools on the image ---- */
	.brina-pdp__gallery:not(#brina-pdp) {
		--brina-pdp-stage: #FFFFFF;
		width: calc(100% + 32px);
		max-width: none;
		margin-inline: -16px;
	}

	.brina-pdp .woocommerce-product-gallery:not(#brina-pdp) {
		gap: 0;
	}

	.brina-pdp .woocommerce-product-gallery > .flex-viewport,
	.brina-pdp .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
		background: #FFFFFF;
		border-radius: 0;
	}

	.brina-pdp .woocommerce-product-gallery .flex-control-thumbs {
		display: none !important; /* replaced by the dots on phone */
	}

	.brina-pdp .woocommerce-product-gallery__trigger {
		display: none !important; /* the image itself opens WooCommerce's lightbox */
	}

	.brina-pdp-m-dots {
		display: flex;
		justify-content: center;
		gap: 6px;
		padding: 10px 0 0;
	}

	.brina-pdp-m-dot {
		width: 7px;
		height: 7px;
		margin: 0;
		padding: 0;
		background: #C9CFDA;
		border: 0;
		border-radius: 99px;
		cursor: pointer;
		transition: width .18s ease, background-color .18s ease;
	}

	.brina-pdp-m-dot.is-active {
		width: 18px;
		background: #5B4CF0;
	}

	.brina-pdp-m-dot:focus-visible {
		outline: 2px solid #5B4CF0;
		outline-offset: 2px;
	}

	.brina-pdp-m-tools {
		position: absolute;
		top: 10px;
		right: 12px;
		z-index: 3;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		gap: 8px;
	}

	.brina-pdp-m-tools .brina-pdp__wish,
	.brina-pdp-m-share {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		margin: 0;
		padding: 0;
		color: #172033;
		background: rgba(255, 255, 255, .92);
		border: 1px solid #E3E7EF;
		border-radius: 50%;
		box-shadow: 0 1px 3px rgba(16, 28, 61, .08);
		cursor: pointer;
	}

	.brina-pdp-m-note {
		display: none;
		padding: 4px 8px;
		font-size: 12px;
		font-weight: 600;
		color: #FFFFFF;
		white-space: nowrap;
		background: #172033;
		border-radius: 6px;
	}

	.brina-pdp-m-tools.is-noted .brina-pdp-m-note {
		display: block;
	}

	/* ---- 3. Buy box: open sections, hairline separators ---- */
	.brina-pdp .brina-pdp__buybox:not(#brina-pdp) {
		gap: 0;
		padding: 0;
		background: none;
		border: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.brina-pdp .brina-pdp__buybox > * {
		align-self: stretch;
		width: 100%;
		margin: 0;
		padding: 14px 0;
		border-top: 1px solid #EEF1F5;
	}

	.brina-pdp .brina-pdp__buybox > :first-child {
		padding-top: 0;
		border-top: 0;
	}

	/* Price: current price prominent, old price muted + struck, savings line. */
	.brina-pdp .brina-pdp__price ins {
		font-size: 28px;
		font-weight: 800;
		color: #172033;
		text-decoration: none;
	}

	.brina-pdp .brina-pdp__price del {
		font-size: 15px;
		font-weight: 500;
		color: #6B7688;
	}

	.brina-pdp .brina-pdp__price {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 4px 10px;
	}

	.brina-pdp .brina-pdp__price ins { order: 1; }
	.brina-pdp .brina-pdp__price del { order: 2; }

	.brina-pdp .brina-pdp__price > .woocommerce-Price-amount {
		font-size: 28px;
		font-weight: 800;
		color: #172033;
	}

	/* Options (moved here on phone by brina-pdp-phone.js): own section. */
	.brina-pdp .brina-pdp__buybox > .brina-pdp-m-options .brina-pdp-decision__variations {
		margin: 0;
	}

	/* Stock + options/quantity: one block; Buy Now stays in the flow. */
	.brina-pdp .brina-pdp__buybox > .brxe-shortcode:has(.brina-pdp__stock) {
		padding-bottom: 0;
	}

	.brina-pdp .brina-pdp__buybox > .brxe-product-add-to-cart {
		border-top: 0;
	}

	/* The policy rows' own top line would double the section hairline. */
	.brina-pdp .brina-pdp__buybox .brina-pdp__pinfo {
		padding-top: 0;
		border-top: 0;
	}

	/* ---- Sticky Add to cart: the real WooCommerce button, fixed ---- */
	.brina-pdp form.cart::after {
		content: "";
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 899;
		height: calc(68px + env(safe-area-inset-bottom, 0px));
		background: #FFFFFF;
		border-top: 1px solid #E3E7EF;
		box-shadow: 0 -6px 18px rgba(16, 28, 61, .06);
		pointer-events: none;
	}

	.brina-pdp__buybox .cart .single_add_to_cart_button:not(.brina-buy-now):not(#brina-pdp) {
		position: fixed;
		right: 16px;
		bottom: calc(10px + env(safe-area-inset-bottom, 0px));
		left: 16px;
		z-index: 900;
		width: auto;
		min-width: 0;
		min-height: 48px;
		height: 48px;
		margin: 0;
		font-size: 16px;
		font-weight: 700;
		line-height: 1.2;
		color: #FFFFFF;
		background: #5B4CF0;
		border: 0;
		border-radius: 12px;
	}

	.brina-pdp__buybox .cart .single_add_to_cart_button:not(.brina-buy-now):not(#brina-pdp):hover,
	.brina-pdp__buybox .cart .single_add_to_cart_button:not(.brina-buy-now):not(#brina-pdp):focus-visible {
		color: #FFFFFF;
		background: #4A3BD6;
	}

	.brina-pdp__buybox .cart .single_add_to_cart_button.disabled:not(.brina-buy-now):not(#brina-pdp) {
		opacity: .55; /* variation not chosen yet: WooCommerce still blocks it */
	}

	body.single-product:has(.brina-pdp form.cart .single_add_to_cart_button:not(.brina-buy-now)) {
		padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
	}

	/* ---- Lower sections: open, not boxed ---- */
	.brina-pdp__info-area .brina-pdp-info__block,
	.brina-pdp__info-area .brina-pdp-section {
		box-shadow: none;
	}

	.brina-pdp__info-area .brina-pdp-info__block:not(.brina-pdp-info__block--brand) {
		padding: 16px 0;
		background: none;
		border: 0;
		border-top: 1px solid #EEF1F5;
		border-radius: 0;
	}

	/* ---- Recommendations: More from the seller first ---- */
	.brina-pdp-discovery > [data-rail="seller"] {
		order: -1;
	}
}