/* ============ Single product layout ============ */
.cb-pdp { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cb-space-xl); padding-bottom: var(--cb-space-xl); }
@media (min-width: 1024px) { .cb-pdp { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }

/* ---- Gallery (custom — see dandelion_product_gallery() in inc/template-tags.php) ----
   One image visible at a time in a fixed 3:4 frame, filled edge-to-edge
   (object-fit:cover — top-aligned so a full-length photo doesn't get cropped
   at the head); swiped via touch or paged with the arrow buttons
   (assets/js/product.js) — always a single row, on mobile and desktop
   alike, regardless of photo count. */
.cb-pdp-gallery { position: relative; border-radius: var(--cb-radius); overflow: hidden; }
.cb-pdp-gallery__track { display: flex; aspect-ratio: 3/4; background: var(--cb-color-surface-alt); transition: transform var(--cb-transition); touch-action: pan-y; }
.cb-pdp-gallery__slide { flex: none; width: 100%; height: 100%; }
.cb-pdp-gallery__slide img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.cb-pdp-gallery__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	display: flex; align-items: center; justify-content: center;
	width: 2.5rem; height: 2.5rem; border-radius: 50%;
	background: var(--cb-color-background); color: var(--cb-color-text);
	box-shadow: var(--cb-shadow-card); transition: background var(--cb-transition-fast);
}
.cb-pdp-gallery__arrow:hover { background: var(--cb-color-surface); }
.cb-pdp-gallery__arrow--prev { left: var(--cb-space-sm); }
.cb-pdp-gallery__arrow--next { right: var(--cb-space-sm); }

/* ---- Summary panel ---- */
.cb-pdp__summary { display: flex; flex-direction: column; gap: var(--cb-space-md); }
@media (min-width: 1024px) { .cb-pdp__summary { position: sticky; top: 6rem; align-self: start; } }
.cb-pdp__summary .cb-display-lg { max-width: 20ch; }
.dandelion-badges { display: flex; gap: 0.4rem; }
.dandelion-badge { display: inline-block; padding: 0.25rem 0.75rem; border-radius: var(--cb-radius-full); font-size: var(--cb-text-label-caps); letter-spacing: var(--cb-tracking-label-caps); font-weight: 600; text-transform: uppercase; background: var(--cb-color-primary); color: var(--cb-color-text); }
.dandelion-badge--sale { background: var(--cb-color-dusty-rose); color: var(--cb-white); }

.woocommerce-product-rating { display: flex; align-items: center; gap: 0.5rem; }
.woocommerce-product-rating .star-rating { font-size: 14px; }
.woocommerce-product-rating .woocommerce-review-link { font-size: var(--cb-text-body-sm); color: var(--cb-color-text-muted); }

.cb-pdp__summary .price { font-family: var(--cb-font-heading); font-size: var(--cb-text-headline-md); }
.cb-pdp__summary .woocommerce-product-details__short-description { color: var(--cb-color-text-muted); }
.cb-pdp__summary .woocommerce-product-details__short-description p:first-child { margin-top: 0; }

/* Native variation form. Direct-child selectors only — the Size Guide
   chart is nested inside the "Size" row's <th> (JS moves it there), and
   it has its own real <table> that must NOT inherit this stacked layout. */
.variations { width: 100%; border-collapse: collapse; margin: 0; }
.variations > tbody, .variations > tbody > tr, .variations > tbody > tr > th, .variations > tbody > tr > td { display: block; width: 100%; border: 0; padding: 0; text-align: left; font-weight: normal; }
.variations > tbody > tr + tr { margin-top: var(--cb-space-md); }
.variations label { font-size: var(--cb-text-label-md); text-transform: uppercase; letter-spacing: var(--cb-tracking-label-md); color: var(--cb-color-text-muted); display: block; margin-bottom: 0.4rem; }
.variations select.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.reset_variations { display: inline-block; margin-top: var(--cb-space-sm); font-size: var(--cb-text-body-sm); color: var(--cb-color-dusty-rose); text-decoration: underline; }

/* Size Guide row, moved by JS to sit directly under the "Size" label,
   left-aligned, before the size swatches — reads as part of the size
   heading rather than a separate block near the Add to Cart button. */
.dandelion-size-row-anchor { margin-bottom: 0.6rem; }

.dandelion-swatches { display: flex; flex-wrap: wrap; gap: 0.6rem; }
/* Radio box: shows the option name (colour, size, pattern, ...). */
.dandelion-swatch {
	min-width: 2.75rem; min-height: 2.5rem; padding: 0.4rem 0.9rem; border-radius: var(--cb-radius);
	border: 1px solid var(--cb-color-border); background: var(--cb-color-surface);
	font-size: var(--cb-text-label-md); text-transform: uppercase; letter-spacing: var(--cb-tracking-label-md);
	line-height: 1.2; text-align: center;
	transition: transform var(--cb-transition-fast), border-color var(--cb-transition-fast), background var(--cb-transition-fast), color var(--cb-transition-fast);
}
.dandelion-swatch.is-active { background: var(--cb-color-text); color: var(--cb-white); border-color: var(--cb-color-text); }
.dandelion-swatch:hover { transform: translateY(-1px); }
.dandelion-swatch[hidden] { display: none; }

.single_add_to_cart_button.button { width: auto; }
.woocommerce-variation-add-to-cart { display: flex; align-items: center; gap: var(--cb-space-md); flex-wrap: wrap; margin-top: var(--cb-space-sm); }
.woocommerce-variation-price { margin-bottom: var(--cb-space-sm); }
.woocommerce-variation-availability { font-size: var(--cb-text-body-sm); color: var(--cb-color-text-muted); }
form.cart { display: flex; align-items: center; gap: var(--cb-space-md); flex-wrap: wrap; margin-top: var(--cb-space-sm); }
.woocommerce-variation-add-to-cart .quantity,
form.cart .quantity { margin: 0; }

/* Quick specs / accordions */
.dandelion-product-details { border-top: 1px solid var(--cb-color-border); padding-top: var(--cb-space-md); }
.dandelion-product-details dl { display: grid; grid-template-columns: auto 1fr; gap: 0.5rem 1rem; margin: 0; }
.dandelion-product-details dt { font-size: var(--cb-text-label-md); text-transform: uppercase; letter-spacing: var(--cb-tracking-label-md); color: var(--cb-color-text-muted); }
.dandelion-product-details dd { margin: 0; }

.dandelion-accordion { border-top: 1px solid var(--cb-color-border); padding: var(--cb-space-sm) 0; }
.dandelion-accordion summary { cursor: pointer; font-size: var(--cb-text-label-md); text-transform: uppercase; letter-spacing: var(--cb-tracking-label-md); display: flex; align-items: center; justify-content: space-between; }
.dandelion-accordion__content { padding-top: var(--cb-space-sm); color: var(--cb-color-text-muted); }

/* Size row: Size Guide accordion trigger, moved by JS to sit right under
   the "Size" label. The model-wearing tooltip is moved (by JS) inside the
   <summary> itself, right after the "Size Guide" text, so it reads on the
   same line instead of being pushed to the row's far edge. */
.cb-pdp__size-row .dandelion-accordion { border-top: 0; padding: 0; }
.cb-pdp__size-row .dandelion-accordion summary { display: inline-flex; width: auto; font-weight: 600; color: var(--cb-color-text); justify-content: flex-start; align-items: center; gap: 0.4rem; }
.cb-pdp__size-row .dandelion-accordion summary .dandelion-tooltip { margin-left: 0.15rem; }
.cb-pdp__size-row .dandelion-accordion summary::before { content: ""; width: 14px; height: 14px; flex-shrink: 0; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='3' y='8' width='18' height='8' rx='1'/%3E%3Cpath d='M7 8v3M11 8v4M15 8v3'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='3' y='8' width='18' height='8' rx='1'/%3E%3Cpath d='M7 8v3M11 8v4M15 8v3'/%3E%3C/svg%3E") center / contain no-repeat; }
.cb-pdp__size-row .dandelion-accordion__content table { width: 100%; border-collapse: collapse; margin-top: var(--cb-space-sm); }
.cb-pdp__size-row .dandelion-accordion__content th,
.cb-pdp__size-row .dandelion-accordion__content td { text-align: left; padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--cb-color-border); font-size: var(--cb-text-body-sm); }
.cb-pdp__size-row .dandelion-accordion__content th { text-transform: uppercase; letter-spacing: 0.04em; color: var(--cb-color-text-muted); font-weight: 600; }

.dandelion-tooltip { position: relative; display: inline-flex; }
.dandelion-tooltip__trigger {
	display: inline-flex; align-items: center; justify-content: center;
	width: 1.25rem; height: 1.25rem; border-radius: 50%; color: var(--cb-color-text-muted);
	border: 1px solid var(--cb-color-border);
}
.dandelion-tooltip__trigger:hover { color: var(--cb-color-text); border-color: var(--cb-color-text); }
.dandelion-tooltip__bubble {
	position: absolute; bottom: calc(100% + 0.5rem); left: 50%; transform: translateX(-50%);
	background: var(--cb-color-text); color: var(--cb-white); font-size: var(--cb-text-body-sm);
	padding: 0.4rem 0.75rem; border-radius: var(--cb-radius); white-space: nowrap;
	max-width: min(16rem, calc(100vw - 2rem));
	opacity: 0; visibility: hidden; transition: opacity var(--cb-transition-fast);
	pointer-events: none; z-index: 5;
}
.dandelion-tooltip__bubble::after {
	content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
	border: 5px solid transparent; border-top-color: var(--cb-color-text);
}
.dandelion-tooltip__trigger:hover + .dandelion-tooltip__bubble,
.dandelion-tooltip__trigger:focus + .dandelion-tooltip__bubble { opacity: 1; visibility: visible; }

/* ---- Native product tabs (Description / Shipping / Returns) ---- */
.woocommerce-tabs { margin-top: var(--cb-space-xl); padding-top: var(--cb-space-xl); border-top: 1px solid var(--cb-color-border); }
.woocommerce-tabs ul.tabs { display: flex; gap: var(--cb-space-lg); list-style: none; margin: 0 0 var(--cb-space-lg); padding: 0; border-bottom: 1px solid var(--cb-color-border); }
.woocommerce-tabs ul.tabs li { margin: 0; }
.woocommerce-tabs ul.tabs li a { display: inline-block; padding-bottom: var(--cb-space-sm); font-size: var(--cb-text-label-md); text-transform: uppercase; letter-spacing: var(--cb-tracking-label-md); color: var(--cb-color-text-muted); }
.woocommerce-tabs ul.tabs li.active a { color: var(--cb-color-text); border-bottom: 2px solid var(--cb-color-dusty-rose); }
.woocommerce-tabs .panel { max-width: 44rem; color: var(--cb-color-text-muted); }
.woocommerce-tabs .panel h2 { font-size: var(--cb-text-headline-sm); color: var(--cb-color-text); margin-bottom: var(--cb-space-sm); }

/* ---- Related / recently viewed ---- */
.cb-pdp-related { margin-top: var(--cb-space-xl); }

/* ---- jquery.zoom helper element (normally hidden by WooCommerce's own
   core CSS, which this theme intentionally dequeues) ---- */
.zoomImg { position: absolute !important; left: 0; top: 0; width: auto; max-width: none !important; opacity: 0; z-index: -1; }
.zoomImg.zoomImgActive { opacity: 1; z-index: 1; }
.zoomWindow { z-index: 999; }


/* "Pay in 3 installments with [Mintpay] [Koko]" under the buy buttons. */

/* A size-chart link injected by a code snippet pointing at an image on the old
   site — the theme's own Size Guide (under the Size options) replaces it. */
#dandelion-size-chart, .size-chart-active { display: none !important; }

/* ============ Purchase row: stock note, quantity stepper, buttons ============ */
/* One height for the stepper and every button in the row, on every product. */
.cb-pdp__summary { --cb-buy-height: 3.5rem; }

/* "3 in stock" — a quiet line with a small pink dot (red when sold out). */
.woocommerce-variation { margin-top: var(--cb-space-md); }
.woocommerce-variation-availability p.stock,
.cb-pdp__summary p.stock {
	display: flex; align-items: center; gap: 0.5rem; margin: 0 0 var(--cb-space-sm);
	font-size: var(--cb-text-body-md); letter-spacing: 0.02em; color: var(--cb-color-text-muted);
}
.cb-pdp__summary p.stock::before { content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; flex-shrink: 0; background: var(--cb-color-dusty-rose); }
.cb-pdp__summary p.stock.out-of-stock { color: var(--cb-color-error); }
.cb-pdp__summary p.stock.out-of-stock::before { background: var(--cb-color-error); }

/* The row: [ − 1 + ] [ Add to cart ] ( [ Buy now ] wraps beneath on narrow screens ). */
.woocommerce-variation-add-to-cart,
form.cart:not(.variations_form) { display: flex; align-items: stretch; flex-wrap: wrap; gap: 0.75rem; margin-top: var(--cb-space-sm); }
.woocommerce-variation-add-to-cart .button,
form.cart:not(.variations_form) .button {
	flex: 1 1 9rem; min-height: var(--cb-buy-height); width: auto;
	display: inline-flex; align-items: center; justify-content: center; text-align: center;
}

/* Quantity stepper */
form.cart .quantity.cb-qty {
	display: inline-flex; align-items: stretch; flex: 0 0 auto; margin: 0; height: var(--cb-buy-height);
	background: var(--cb-color-surface); border: 1px solid var(--cb-color-border); border-radius: var(--cb-radius);
	overflow: hidden; transition: border-color var(--cb-transition-fast);
}
form.cart .quantity.cb-qty:focus-within { border-color: var(--cb-color-dusty-rose); }
form.cart .quantity.cb-qty button {
	width: 2.25rem; height: auto; display: flex; align-items: center; justify-content: center;
	background: transparent; color: var(--cb-color-text-muted); cursor: pointer;
	transition: background var(--cb-transition-fast), color var(--cb-transition-fast);
}
form.cart .quantity.cb-qty button:hover { background: var(--cb-color-surface-alt); color: var(--cb-color-text); }
form.cart .quantity.cb-qty input.qty {
	width: 2.25rem; height: auto; padding: 0; text-align: center; border: 0; border-radius: 0; background: transparent;
	font-family: var(--cb-font-body); font-size: var(--cb-text-body-lg); font-weight: 500; color: var(--cb-color-text);
	-moz-appearance: textfield; appearance: textfield; box-shadow: none; outline: none;
}
form.cart .quantity.cb-qty input.qty::-webkit-inner-spin-button,
form.cart .quantity.cb-qty input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* Until options are chosen, the stepper and button wait together, looking alike. */
.woocommerce-variation-add-to-cart-disabled .quantity.cb-qty { opacity: 0.5; pointer-events: none; }
.single_add_to_cart_button.disabled, .single_add_to_cart_button:disabled { opacity: 0.5; cursor: not-allowed; }

/* Size chart table (XS–5XL): tidy, centred numbers, bold size column, soft banding. */
.dandelion-accordion__content table.dandelion-size-chart { width: 100%; border-collapse: collapse; margin-top: var(--cb-space-sm); font-variant-numeric: tabular-nums; }
.dandelion-size-chart thead th { background: var(--cb-color-surface-alt); color: var(--cb-color-text); font-size: var(--cb-text-label-caps); letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; text-align: center; padding: 0.55rem 0.35rem; }
.dandelion-size-chart tbody th { text-align: center; font-weight: 600; color: var(--cb-color-text); background: color-mix(in srgb, var(--cb-color-primary) 22%, transparent); }
.dandelion-size-chart td { text-align: center; color: var(--cb-color-text-muted); }
.dandelion-size-chart th, .dandelion-size-chart td { padding: 0.5rem 0.35rem; border-bottom: 1px solid var(--cb-color-border); font-size: var(--cb-text-body-md); }
.dandelion-size-note { margin: var(--cb-space-sm) 0 0; font-size: var(--cb-text-body-sm); color: var(--cb-color-text-muted); line-height: 1.5; }


/* "or 3 X Rs. … with Mintpay / Koko" — matches the PayZy line above it. */
.cb-bnpl-lines { margin-top: 0.1rem; }
.cb-bnpl-line { display: flex; align-items: center; flex-wrap: wrap; gap: 0.3rem; font-size: 18px; line-height: 22px; color: #8e8e8e; font-weight: normal; margin-top: 0.35rem; }
.cb-bnpl-line b { font-weight: 700; }
.cb-bnpl-line__logo { height: 18px; width: auto; display: inline-block; vertical-align: middle; }
.cb-bnpl-line__logos { display: inline-flex; align-items: center; gap: 0.5rem; }