/* Wepic — single product page. */

.product-top { padding-block: 20px 48px; }
.product-layout { display: grid; gap: 28px; }
@media (min-width: 1024px) {
	.product-layout { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 56px; align-items: start; }
	.product-layout .summary { position: sticky; top: calc(var(--header-h) + 20px); }
}

/* Gallery */
.gallery { min-width: 0; }
.gallery__main { position: relative; }
/* position: relative keeps absolutely positioned children (screen-reader labels of later slides) inside the scroller;
   otherwise they escape it and widen the page on phones. */
.gallery__track, .gallery__thumbs { position: relative; }
.gallery__track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--radius-lg); background: var(--sand); }
.gallery__track::-webkit-scrollbar { display: none; }
.gallery__slide { scroll-snap-align: start; scroll-snap-stop: always; aspect-ratio: 1; }
.gallery__slide a { display: block; height: 100%; cursor: zoom-in; }
.gallery__slide img { width: 100%; height: 100%; object-fit: contain; }
.gallery__nav { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; margin-top: -22px; border: 0; border-radius: 50%; background: rgb(255 255 255 / 0.92); color: var(--ink); box-shadow: var(--shadow); cursor: pointer; }
.gallery__nav--prev { left: 12px; }
.gallery__nav--next { right: 12px; }
.gallery__nav:disabled { opacity: 0; pointer-events: none; }
.gallery__thumbs { display: flex; gap: 10px; margin-top: 12px !important; overflow-x: auto; scrollbar-width: none; }
.gallery__thumb { display: block; flex: none; width: 76px; height: 76px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: var(--radius); background: var(--sand); cursor: pointer; }
.gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.gallery__thumb[aria-current="true"] { border-color: var(--ink); }
@media (max-width: 1023px) {
	.gallery { margin-inline: calc(-1 * var(--gutter)); }
	.gallery__track { border-radius: 0; }
	.gallery__thumbs { padding-inline: var(--gutter); }
	.gallery__thumb { width: 60px; height: 60px; }
}
/* Full-screen photo. Edges pinned with inset (not vh units, which iOS Safari measures without its floating toolbar)
   and an opaque background on both the dialog and its backdrop, so the page never shows through. */
.lightbox { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; overflow: hidden; background: #000; color: #fff; color-scheme: dark; }
.lightbox[open] { display: grid; place-items: center; }
.lightbox::backdrop { background: #000; }
.lightbox__img { width: 100%; height: 100%; object-fit: contain; }
.lightbox__close { position: absolute; top: max(12px, env(safe-area-inset-top)); right: 12px; z-index: 1; background: rgb(255 255 255 / 0.92) !important; color: var(--ink) !important; box-shadow: var(--shadow); }
html.has-lightbox { overflow: hidden; }

/* Summary */
.summary .product_title { margin: 0 0 10px; font-size: clamp(2rem, 1.5rem + 1.8vw, 2.9rem); }
.summary .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: .9rem; }
.summary .woocommerce-review-link { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.summary > .price { margin: 0 0 18px; font-size: 1.6rem; font-weight: 800; color: var(--ink); }
.summary > .price del { color: var(--muted); font-weight: 500; font-size: .7em; margin-right: 8px; }
.summary > .price ins { text-decoration: none; }
.summary > .price .price-from { font-size: .55em; }
.summary .woocommerce-product-details__short-description { margin-bottom: 24px; color: var(--text); font-size: 1.02rem; line-height: 1.7; }
.summary .woocommerce-product-details__short-description li + li { margin-top: 4px; }
.summary .woocommerce-product-details__short-description ul { padding-left: 1.2em; }
.summary .woocommerce-product-details__short-description p:empty,
.summary .woocommerce-product-details__short-description p:has(> br:only-child) { display: none; }
/* Many short descriptions contain pasted headings (h1–h6): show them as a readable lead line, not page headings. */
.summary .woocommerce-product-details__short-description :is(h1, h2, h3, h4, h5, h6) {
	margin: 0 0 .5em; font-family: var(--font); font-size: 1.08rem; font-weight: 700; letter-spacing: 0; line-height: 1.4; color: var(--ink);
}
/* Small pasted icons (width/height attributes ≤ 24px) stay inline with the text. */
:is(.woocommerce-product-details__short-description, .product-details__description) img:is([width="12"], [width="14"], [width="16"], [width="17"], [width="18"], [width="20"], [width="24"]) {
	display: inline-block; width: auto; height: 1em; margin: 0 .25em; vertical-align: -0.1em;
}

/* Variations & swatches */
.summary table.variations { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.summary table.variations tr { display: block; margin-bottom: 18px; }
.summary table.variations th, .summary table.variations td { display: block; padding: 0; text-align: left; }
.summary table.variations th label { display: block; margin-bottom: 10px; color: var(--ink); font-weight: 700; font-size: .95rem; }
.summary table.variations select { width: 100%; min-height: 48px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.js .summary table.variations td:has(.swatches) select { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.summary .reset_variations { display: inline-block; margin-top: 10px; font-size: .85rem; color: var(--muted); text-decoration: underline; }
.swatches { display: none; flex-wrap: wrap; gap: 8px; }
.js .swatches { display: flex; }
.swatch-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 6px 16px; border: 1.5px solid var(--line); border-radius: var(--radius); background: var(--white); color: var(--ink); font-weight: 600; font-size: .92rem; cursor: pointer; transition: border-color .15s, background-color .15s; }
.swatch-btn:hover { border-color: var(--ink); }
.swatch-btn[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--white); }
.swatch-btn--visual { padding: 4px 14px 4px 4px; }
.swatch-btn--visual[aria-pressed="true"] { background: var(--white); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); }
.swatch-btn img { width: 36px; height: 36px; border-radius: 6px; object-fit: cover; }
.swatch-btn__color { width: 28px; height: 28px; border-radius: 50%; background: var(--c); border: 1px solid rgb(0 0 0 / 0.15); }
.swatch-btn:disabled { opacity: .35; cursor: not-allowed; text-decoration: line-through; }
.summary .woocommerce-variation-price { display: none; } /* the main price above updates instead */
.summary .woocommerce-variation-availability { font-size: .88rem; color: var(--muted); }

/* Add to cart */
.summary form.cart { margin-bottom: 12px; }
.summary .woocommerce-variation-add-to-cart, .summary form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.summary .quantity { display: flex; }
.summary .quantity .qty { width: 72px; min-height: 52px; border: 1px solid var(--line); border-radius: var(--radius); text-align: center; font-weight: 700; }
.summary .single_add_to_cart_button {
	flex: 1; min-height: 52px; padding: 0 24px; border: 0; border-radius: var(--radius);
	background: var(--charcoal); color: var(--white); font-weight: 800; font-size: 1rem; cursor: pointer; transition: background-color .2s;
}
.summary .single_add_to_cart_button:hover { background: var(--accent-text); }
.summary .single_add_to_cart_button.disabled { opacity: .55; cursor: not-allowed; }
.summary .single_add_to_cart_button.loading { opacity: .7; cursor: progress; }
.btn--whatsapp { width: 100%; min-height: 52px; background: var(--white); color: #128c4b; box-shadow: inset 0 0 0 1.5px #1fae54; }
.btn--whatsapp:hover { background: #1fae54; color: var(--white); }
.order-note { margin: 12px 0 22px; font-size: .85rem; color: var(--muted); }
.cart-error { margin: 0 0 12px; padding: 12px 14px; border-radius: var(--radius); background: #fdecea; color: #8a1c13; font-size: .9rem; }
.cart-error ul { margin: 0; padding-left: 1.1em; }

/* Reassurance */
.product-extras { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 18px 0 !important; border-block: 1px solid var(--line); }
.product-extras li { display: grid; justify-items: center; gap: 8px; text-align: center; font-size: .85rem; font-weight: 600; color: var(--ink); line-height: 1.3; }
.product-extras img { width: 60px; height: 60px; object-fit: contain; }
.product-promises { display: grid; gap: 10px; margin-top: 20px !important; font-size: .98rem; }
.product-promises li { display: flex; align-items: center; gap: 10px; }
.product-promises .icon { color: var(--accent); }

/* Details */
.product-details { padding-block: var(--section-space); border-top: 1px solid var(--line); }
.product-details__grid { display: grid; gap: 40px; }
@media (min-width: 1024px) { .product-details__grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 64px; } }
.product-details h2 { font-size: clamp(1.8rem, 1.4rem + 1.2vw, 2.4rem); }
.product-details__description { max-width: 72ch; color: var(--text); font-size: 1.05rem; line-height: 1.8; }
.product-details__description img { border-radius: var(--radius); margin-block: 16px; }
/* Headings written inside product descriptions (often h5/h6): readable subheadings, never tiny. */
.product-details__description :is(h1, h2, h3, h4, h5, h6) {
	margin: 1.4em 0 .5em; font-family: var(--font); font-size: 1.15rem; font-weight: 700; letter-spacing: 0; line-height: 1.4; color: var(--ink);
}
.product-details__description > h2:first-child { font-family: var(--font-display); font-size: clamp(1.8rem, 1.4rem + 1.2vw, 2.4rem); font-weight: 600; margin-top: 0; }
.product-details__description h2:first-child + :is(h1, h2, h3, h4, h5, h6) { margin-top: .4em; }
.product-details__description ul { padding-left: 1.2em; }
.product-details__description li + li { margin-top: 4px; }
.product-details__block { padding: 24px; border-radius: var(--radius-lg); background: var(--sand); }
.product-details__block + .product-details__block { margin-top: 20px; }
.product-details__block h2 { font-size: 1.6rem; }
.product-details__block p { margin: 0; font-size: .98rem; line-height: 1.7; }
.woocommerce-product-attributes { width: 100%; border-collapse: collapse; font-size: .98rem; }
.woocommerce-product-attributes th, .woocommerce-product-attributes td { padding: 10px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.woocommerce-product-attributes th { width: 40%; color: var(--ink); font-weight: 700; }
.woocommerce-product-attributes td p { margin: 0; }

/* Reviews */
.product-reviews__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.product-reviews__head .section-title { margin: 0; }
.review-summary { display: flex; align-items: center; gap: 14px; margin: 0; color: var(--muted); font-size: .9rem; }
.review-summary > span:last-child { display: grid; gap: 4px; }
.review-summary__score { font-size: 2.6rem; font-weight: 800; line-height: 1; color: var(--ink); letter-spacing: -0.03em; }

/* Mobile sticky add-to-cart */
.sticky-atc { position: fixed; inset: auto 0 0; z-index: 44; display: flex; align-items: center; gap: 12px; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: var(--white); box-shadow: 0 -6px 24px rgb(0 0 0 / 0.12); transform: translateY(110%); transition: transform .25s; }
.sticky-atc[hidden] { display: none; }
.sticky-atc.is-visible { transform: none; }
/* The bar is exactly the screen width and its text area shrinks from zero, so a long product name ends in "…".
   Otherwise phones widen the whole page to fit the name (sideways scrolling on product pages). */
.sticky-atc { width: 100vw; max-width: 100vw; }
.sticky-atc__info { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; flex: 1 1 0; overflow: hidden; }
.sticky-atc__name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .82rem; color: var(--muted); }
.sticky-atc__price { font-weight: 800; color: var(--ink); }
.sticky-atc__price del { display: none; }
.sticky-atc__price ins { text-decoration: none; }
.sticky-atc .btn { min-height: 46px; padding-inline: 18px; }
@media (min-width: 1024px) { .sticky-atc { display: none !important; } }
.has-sticky-atc .whatsapp-float { bottom: 84px; }

/* Cart drawer */
.cart-drawer { position: fixed; inset: 0; z-index: 70; }
.cart-drawer[hidden] { display: none; }
.cart-drawer__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 0.45); animation: fade-in .2s; }
.cart-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(420px, 100%); background: var(--white); box-shadow: -10px 0 40px rgb(0 0 0 / 0.2); animation: slide-in .25s ease-out; }
@keyframes fade-in { from { opacity: 0; } }
@keyframes slide-in { from { transform: translateX(100%); } }
.cart-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 14px 20px; border-bottom: 1px solid var(--line); }
.cart-drawer__head .icon-btn { color: var(--ink); }
.cart-drawer__title { display: flex; align-items: center; gap: 10px; margin: 0; font-weight: 800; color: var(--ink); }
.cart-drawer__title .icon { color: #1fae54; }
.cart-drawer__items { flex: 1; overflow-y: auto; padding: 8px 20px !important; }
.cart-drawer__items li { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: .88rem; }
.cart-drawer__items img { width: 64px; height: 64px; border-radius: 8px; object-fit: cover; background: var(--sand); }
.cart-drawer__items strong { display: block; color: var(--ink); line-height: 1.3; }
.cart-drawer__items small { color: var(--muted); }
.cart-drawer__foot { display: grid; gap: 10px; padding: 16px 20px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
.cart-drawer__total { display: flex; justify-content: space-between; margin: 0; font-size: 1.05rem; color: var(--ink); }
.cart-drawer__note { margin: 0; font-size: .82rem; color: var(--muted); }
.cart-drawer__continue { padding: 6px; border: 0; background: none; color: var(--muted); text-decoration: underline; cursor: pointer; }