/* ============================================================
   VAPELITE — Premium single-product (PDP) styling
   Scoped to body.single-product only. Loaded by vapelite-pdp.php.
   Tokens match the live site design system (wp-design/home.html).
   ============================================================ */
:root{
  --vl-bg:#030506; --vl-surface:#101f26; --vl-surface-2:#16262e;
  --vl-line:#335767; --vl-line-soft:#21333b;
  --vl-accent:#fa6d99; --vl-accent-2:#ff87ad; --vl-accent-ink:#1a060e;
  --vl-heading:#d8f1fb; --vl-text:#bcd3dc; --vl-muted:#8aa6b1;
  --vl-ice:#49c2f0; --vl-radius:18px; --vl-radius-sm:12px;
}

/* ---------- page canvas ---------- */
body.single-product{background:var(--vl-bg)!important;color:var(--vl-text)}
body.single-product #content .ast-container{max-width:1240px!important}

/* ---------- breadcrumb ---------- */
body.single-product .woocommerce-breadcrumb{font-size:.82rem!important;color:var(--vl-muted)!important;margin:1.1rem 0 1.6rem!important}
body.single-product .woocommerce-breadcrumb a{color:var(--vl-muted)!important}
body.single-product .woocommerce-breadcrumb a:hover{color:var(--vl-ice)!important}

/* ---------- 2-column product grid ---------- */
body.single-product #content div.product{display:grid!important;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(1.6rem,4vw,3.4rem);align-items:start}
body.single-product #content div.product>.woocommerce-product-gallery{grid-column:1;align-self:start;margin:0!important;width:100%!important;float:none!important}
body.single-product #content div.product>.summary.entry-summary{grid-column:2;margin:0!important;width:100%!important;float:none!important}
body.single-product #content div.product>.woocommerce-tabs,
body.single-product #content div.product>.related.products,
body.single-product #content div.product>.up-sells,
body.single-product #content div.product>.ast-single-product-recently-viewed{grid-column:1 / -1}
@media(max-width:920px){
  /* no grid on mobile: block flow stacks gallery -> summary -> tabs -> related and is
     immune to implicit-column bugs from unknown injected children */
  body.single-product #content div.product{display:block!important}
  body.single-product #content div.product>.woocommerce-product-gallery{margin-bottom:1.4rem!important}
}

/* ---------- gallery: spotlight frame ---------- */
html body.single-product #content div.product .woocommerce-product-gallery{border:1px solid var(--vl-line-soft)!important;border-radius:var(--vl-radius);overflow:hidden;
  background:radial-gradient(60% 50% at 50% 40%,rgba(73,194,240,.14),transparent 70%),
    radial-gradient(70% 60% at 50% 92%,rgba(244,138,166,.12),transparent 72%),
    linear-gradient(180deg,#0c161c,#060a0d)!important}
html body.single-product #content div.product .woocommerce-product-gallery .woocommerce-product-gallery__image,
html body.single-product #content div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
html body.single-product #content div.product .woocommerce-product-gallery .flex-viewport,
html body.single-product #content div.product .woocommerce-product-gallery a,
html body.single-product #content div.product .woocommerce-product-gallery img,
html body.single-product #content div.product .woocommerce-product-gallery img.wp-post-image{background:transparent!important;background-color:transparent!important}
body.single-product .woocommerce-product-gallery img{margin-inline:auto;filter:drop-shadow(0 22px 30px rgba(0,0,0,.55))}
body.single-product .woocommerce-product-gallery__trigger{top:.9rem!important;right:.9rem!important;background:rgba(3,5,6,.7)!important;border:1px solid var(--vl-line-soft)!important;border-radius:999px!important}
body.single-product .flex-control-thumbs{display:flex;gap:.6rem;padding:1rem;margin:0!important}
body.single-product .flex-control-thumbs li{width:72px!important;border:1px solid var(--vl-line-soft);border-radius:10px;overflow:hidden;float:none!important}
body.single-product .flex-control-thumbs img{opacity:.7;transition:.18s}
body.single-product .flex-control-thumbs img.flex-active,
body.single-product .flex-control-thumbs img:hover{opacity:1;border-color:var(--vl-accent)}

/* ---------- summary / buy box ---------- */
body.single-product .summary .product_title{color:var(--vl-heading)!important;font-weight:700!important;
  font-size:clamp(1.7rem,3vw,2.4rem)!important;line-height:1.12!important;letter-spacing:-.01em;margin-bottom:.5rem!important}
body.single-product .summary .price{margin:.4rem 0 1rem!important}
body.single-product .summary .price .woocommerce-Price-amount{color:var(--vl-heading)!important;font-size:2rem!important;font-weight:800!important}
body.single-product .summary .woocommerce-product-details__short-description{color:var(--vl-text);font-size:1rem;line-height:1.62;margin-bottom:1.2rem}
body.single-product .summary .woocommerce-product-details__short-description p{color:inherit}

/* stock */
body.single-product .summary .stock.in-stock{color:#5fd07a!important;font-weight:600;font-size:.9rem}
body.single-product .summary .stock.out-of-stock{color:#e08585!important;font-weight:600}

/* qty + add to cart (stepper chrome stays with the vl-qty plugin; colours only).
   Flex row applies to SIMPLE product forms only; variation forms keep block flow
   with their own styled variations table + flexed add-to-cart row. */
body.single-product form.cart:not(.variations_form){display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;margin:1.1rem 0 1rem!important}
body.single-product form.cart.variations_form{margin:1.1rem 0 1rem!important}
body.single-product form.cart.variations_form table.variations{width:100%;border-collapse:collapse;margin-bottom:1rem}
body.single-product form.cart.variations_form table.variations td,
body.single-product form.cart.variations_form table.variations th{padding:.5rem .2rem;border:none}
body.single-product form.cart.variations_form table.variations label{color:var(--vl-muted);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
body.single-product form.cart.variations_form table.variations select{background:var(--vl-surface);color:var(--vl-heading);border:1px solid var(--vl-line);border-radius:10px;padding:.55rem .8rem;width:100%}
body.single-product form.cart.variations_form .woocommerce-variation-add-to-cart{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
body.single-product form.cart .quantity .qty{color:var(--vl-heading)!important;font-weight:600}
body.single-product form.cart .quantity .vl-qty-step{color:var(--vl-heading)!important}
body.single-product form.cart .single_add_to_cart_button{flex:1;min-width:220px;
  background:var(--vl-accent)!important;color:var(--vl-accent-ink)!important;border:none!important;border-radius:999px!important;
  font-weight:700!important;font-size:1rem!important;padding:.9rem 1.6rem!important;letter-spacing:.01em;
  box-shadow:0 0 28px rgba(244,138,166,.25);transition:.2s!important}
body.single-product form.cart .single_add_to_cart_button:hover{background:var(--vl-accent-2)!important;box-shadow:0 0 40px rgba(244,138,166,.4);transform:translateY(-1px)}

/* zoom clone guard: keep any stray zoom image caged in its frame */
body.single-product .woocommerce-product-gallery__image{position:relative;overflow:hidden}
body.single-product .woocommerce-product-gallery .zoomImg{position:absolute!important;top:0;left:0}

/* meta row */
body.single-product .summary .product_meta{border-top:1px solid var(--vl-line-soft);padding-top:1rem;margin-top:1.2rem;
  font-size:.82rem;color:var(--vl-muted);display:grid;gap:.35rem}
body.single-product .summary .product_meta a{color:var(--vl-text)}
body.single-product .summary .product_meta a:hover{color:var(--vl-accent)}
body.single-product .summary .product_meta .sku_wrapper,
body.single-product .summary .product_meta .posted_in,
body.single-product .summary .product_meta .tagged_as{display:block}

/* ---------- reassurance rows (injected by loader) ---------- */
.vl-reassure{display:grid;gap:.6rem;border-top:1px solid var(--vl-line-soft);padding-top:1.2rem;margin-top:.4rem}
.vl-reassure__row{display:flex;align-items:center;gap:.7rem;font-size:.92rem;color:var(--vl-text)}
.vl-reassure__row svg{flex:none;color:var(--vl-ice)}
/* VPPR prescribed presentation: only the required warning inside the bordered area,
   black on white, centered; attribution on its own smaller line. Supplemental copy
   lives OUTSIDE the bordered area (.vl-supplement). */
/* VPPR geometry, deterministic:
   17(2) border = 3% of the rectangle's shortest side. Height is FIXED per breakpoint
   (flex-centered), so the border is exact: 5.5em height -> .165em border (= 3.00%);
   mobile 7em -> .21em. Width always exceeds height, so height is the shortest side.
   21(3)(b): only "WARNING:" bold.
   23(2): attribution GLYPH (cap) height = warning x-height. Hanken Grotesk metrics:
   x-height .516em, cap-height .719em -> attribution font-size = .516/.719 = .72em,
   giving cap-height = .719 x .72em = .518em = the warning font's x-height. */
.vl-warning{display:flex;flex-direction:column;justify-content:center;height:5.5em;
  box-sizing:border-box;margin-top:1.2rem;padding:0 1.2rem;text-align:center;
  border:none;box-shadow:inset 0 0 0 .165em #000; /* box-shadow renders subpixel: exactly 3% of the 5.5em shortest side (borders get device-pixel-snapped) */
  background:#fff;border-radius:0;color:#000;font-size:.95rem;overflow:hidden}
.vl-warning__text{display:block;font-weight:400;font-size:.95rem;line-height:1.4}
.vl-warning__text b{font-weight:800}
/* .63em from RENDERED canvas metrics: warning x-height 7.00px @15.2px (.46 ratio);
   attr cap ratio .731 -> 7.00/.731 = 9.58px = .63em -> cap-height = warning x-height */
.vl-warning__attr{display:block;font-weight:400;font-size:.63em;margin-top:.3rem;letter-spacing:.02em}
@media(max-width:560px){.vl-warning{height:7em;box-shadow:inset 0 0 0 .21em #000}}
.vl-supplement{font-size:.8rem;color:var(--vl-muted);margin-top:.55rem;line-height:1.5}

/* ---------- description / tabs as panel ---------- */
body.single-product .woocommerce-tabs{margin-top:clamp(2rem,5vw,3.4rem)!important}
/* tab nav: hidden only when a single tab exists; styled pills when multiple tabs */
body.single-product .woocommerce-tabs ul.tabs:has(> li:only-child){display:none!important}
body.single-product .woocommerce-tabs ul.tabs{display:flex;gap:.5rem;list-style:none;margin:0 0 1rem!important;padding:0!important;border:none!important;background:transparent!important}
body.single-product .woocommerce-tabs ul.tabs li{background:var(--vl-surface)!important;border:1px solid var(--vl-line-soft)!important;border-radius:999px!important;margin:0!important;padding:0!important;list-style:none!important}
body.single-product .woocommerce-tabs ul.tabs li a{color:var(--vl-text)!important;font-weight:600;font-size:.9rem;padding:.55rem 1.1rem!important;display:inline-block}
body.single-product .woocommerce-tabs ul.tabs li.active{border-color:var(--vl-accent)!important;background:color-mix(in srgb,var(--vl-accent) 12%,var(--vl-surface))!important}
body.single-product .woocommerce-tabs ul.tabs li.active a{color:var(--vl-heading)!important}
body.single-product .woocommerce-tabs ul.tabs li::before,
body.single-product .woocommerce-tabs ul.tabs li::after{display:none!important}
body.single-product .woocommerce-tabs .panel{border:1px solid var(--vl-line-soft)!important;border-radius:var(--vl-radius)!important;
  background:var(--vl-surface)!important;padding:clamp(1.4rem,3vw,2.2rem)!important;margin:0!important}
body.single-product .woocommerce-tabs .panel h2,
body.single-product .woocommerce-tabs .panel h3{color:var(--vl-heading)!important;font-weight:700;margin:1.3rem 0 .5rem}
body.single-product .woocommerce-tabs .panel h2:first-child,
body.single-product .woocommerce-tabs .panel h3:first-child{margin-top:0}
body.single-product .woocommerce-tabs .panel p,
body.single-product .woocommerce-tabs .panel li{color:var(--vl-text)!important;line-height:1.65}
body.single-product .woocommerce-tabs .panel ul{padding-left:1.1rem;display:grid;gap:.3rem}

/* ---------- related products: card grid ---------- */
body.single-product .related.products,
body.single-product .up-sells{margin-top:clamp(2.2rem,5vw,3.6rem)}
body.single-product .related.products>h2,
body.single-product .up-sells>h2{color:var(--vl-heading)!important;font-size:1.45rem!important;font-weight:700!important;margin-bottom:1.1rem!important}
body.single-product .related ul.products,
body.single-product .up-sells ul.products{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:1.1rem!important;margin:0!important;padding:0!important;list-style:none!important}
@media(max-width:920px){body.single-product .related ul.products,body.single-product .up-sells ul.products{grid-template-columns:repeat(2,1fr)!important}}
body.single-product .related ul.products li.product,
body.single-product .up-sells ul.products li.product{width:100%!important;margin:0!important;padding:0!important;float:none!important;list-style:none!important;
  background:var(--vl-surface);border:1px solid var(--vl-line-soft);border-radius:var(--vl-radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .2s,border-color .2s}
body.single-product .related ul.products li.product:hover,
body.single-product .up-sells ul.products li.product:hover{transform:translateY(-4px);border-color:var(--vl-accent)}
html body.single-product #content .related ul.products li.product img,
html body.single-product #content .up-sells ul.products li.product img{width:100%!important;aspect-ratio:1/1;object-fit:contain;padding:1rem;margin:0!important;
  background:radial-gradient(60% 50% at 50% 45%,rgba(73,194,240,.1),transparent 70%),linear-gradient(180deg,#0c161c,#060a0d)!important}
body.single-product .related ul.products li.product .woocommerce-loop-product__title,
body.single-product .up-sells ul.products li.product .woocommerce-loop-product__title{color:var(--vl-heading)!important;font-size:.95rem!important;font-weight:600!important;
  padding:.85rem .95rem .2rem!important;line-height:1.3!important}
body.single-product .related ul.products li.product .price,
body.single-product .up-sells ul.products li.product .price{color:var(--vl-heading)!important;font-weight:700!important;font-size:1.05rem!important;padding:0 .95rem!important;margin:.2rem 0 .6rem!important}
body.single-product .related ul.products li.product .button,
body.single-product .up-sells ul.products li.product .button{margin:.2rem .95rem .95rem!important;background:var(--vl-accent)!important;color:var(--vl-accent-ink)!important;
  border-radius:999px!important;font-weight:700!important;font-size:.82rem!important;padding:.55rem 1rem!important;text-align:center;border:none!important}
body.single-product .related ul.products li.product .button:hover{background:var(--vl-accent-2)!important}
/* kill Astra modern-shop floating icon + category label noise in loops */
body.single-product .related .ast-on-card-button,
body.single-product .up-sells .ast-on-card-button,
body.single-product .related .ast-shop-product-out-of-stock,
body.single-product .related ul.products li.product .ast-woo-product-category,
body.single-product .up-sells ul.products li.product .ast-woo-product-category{display:none!important}

/* Astra single-product category line: hidden defensively (also removed via filter) */
body.single-product .single-product-category{display:none!important}

.vl-pdp-eyebrow{font-size:.75rem!important;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fa6d99!important;margin:0 0 .35rem!important}
.vl-pdp-pricenote{font-size:.82rem;color:#8aa6b1;margin:-.5rem 0 1.1rem!important}

/* ---------- PDP details: 2-col specs + description ---------- */
body.single-product .vl-pdp-details{display:grid!important;grid-template-columns:minmax(0,.94fr) minmax(360px,1.06fr)!important;gap:54px!important;margin-top:clamp(1.4rem,3.5vw,2.4rem)}
@media(max-width:900px){body.single-product .vl-pdp-details{grid-template-columns:1fr!important}}
body.single-product .vl-pdp-panel{background:var(--vl-surface)!important;border:1px solid var(--vl-line-soft)!important;border-radius:var(--vl-radius)!important;padding:clamp(1.4rem,3vw,2rem)!important}
body.single-product .vl-det-eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.74rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--vl-ice)!important;margin-bottom:.35rem}
body.single-product .vl-det-eyebrow::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--vl-ice))}
body.single-product .vl-specs{width:100%!important;border-collapse:collapse!important;margin-top:.9rem}
body.single-product .vl-specs td{padding:.7rem .2rem!important;border-bottom:1px solid var(--vl-line-soft)!important;font-size:.92rem!important}
body.single-product .vl-specs tr:last-child td{border-bottom:0!important}
body.single-product .vl-specs td:first-child{color:var(--vl-muted)!important;width:42%}
body.single-product .vl-specs td:last-child{color:var(--vl-heading)!important;font-weight:500}
body.single-product .vl-specs td.vl-spec-1{color:var(--vl-text)!important;width:auto;font-weight:400}
body.single-product .vl-pdp-desc .vl-pdp-h{color:var(--vl-heading)!important;font-size:1.12rem!important;margin:1rem 0 .45rem!important;font-weight:700}
body.single-product .vl-pdp-desc .vl-pdp-h:first-of-type{margin-top:.5rem!important}
body.single-product .vl-pdp-desc p{color:var(--vl-text)!important;line-height:1.6!important;margin-bottom:.6rem!important}

/* strip tab-panel box (the 2-col vl-pdp panels are the boxes now) */
body.single-product .woocommerce-Tabs-panel,body.single-product .woocommerce-tabs .panel,body.single-product .woocommerce-tabs,body.single-product #content div.product .woocommerce-tabs{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin-top:0!important}

body.single-product .vl-instock{display:flex;align-items:center;gap:.45rem;color:#5fd07a!important;font-size:.85rem!important;font-weight:600!important;margin:.1rem 0 .2rem!important}
body.single-product .vl-instock::before{content:"";width:7px;height:7px;border-radius:50%;background:#5fd07a;box-shadow:0 0 8px #5fd07a}

/* specs table clean (no box/vertical borders, hairline rows) */
body.single-product .vl-specs,body.single-product .vl-specs tbody,body.single-product .vl-specs tr,body.single-product .vl-specs th{border:0!important;background:transparent!important;box-shadow:none!important}
body.single-product .vl-specs{border-collapse:collapse!important;width:100%!important;margin-top:.6rem}
body.single-product .vl-specs td{border:0!important;border-bottom:1px solid var(--vl-line-soft)!important;background:transparent!important;padding:.85rem .15rem!important;font-size:.92rem!important;vertical-align:middle}
body.single-product .vl-specs tr:last-child td{border-bottom:0!important}
body.single-product .vl-specs td:first-child{color:var(--vl-muted)!important;width:40%;font-weight:400!important}
body.single-product .vl-specs td:last-child{color:var(--vl-heading)!important;font-weight:600!important}

body.single-product .vl-pdp-warn{display:flex;gap:.6rem;align-items:flex-start;margin-top:1.3rem;padding:.85rem 1rem;border:1px solid rgba(255,210,80,.35);border-radius:12px;background:rgba(255,210,80,.06)}
body.single-product .vl-pdp-warn span{font-size:.82rem;line-height:1.5;color:#e7d6a6}
body.single-product .vl-pdp-warn b{color:#f4c04f}

body.single-product .price .vl-pdp-pricenote,body.single-product .vl-pdp-pricenote{display:inline-block!important;margin:0 0 0 .55rem!important;font-size:.8rem!important;font-weight:400!important;color:var(--vl-muted)!important;vertical-align:baseline!important} /* pricenote inline */

/* cart-samesize: qty box + add-to-cart equal height */
body.single-product form.cart{display:flex!important;align-items:center!important;gap:.7rem!important;flex-wrap:wrap}
body.single-product form.cart>.quantity{flex:0 0 auto!important;height:52px!important;margin:0!important;display:flex!important;align-items:stretch!important}
body.single-product form.cart>.quantity>.qty{height:52px!important;box-sizing:border-box!important;margin:0!important;padding-top:0!important;padding-bottom:0!important}
body.single-product form.cart>.single_add_to_cart_button{flex:1 1 auto!important;height:52px!important;min-height:52px!important;padding-top:0!important;padding-bottom:0!important;line-height:1.15!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important}

/* details-panel-fullwidth: no theme inset so .vl-pdp-details matches div.product width */
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel,body.single-product .woocommerce-tabs .entry-content{max-width:none!important;width:auto!important;margin-left:0!important;margin-right:0!important}

/* cart-level-fix: qty input height beats the Customizer min-height:46px so it matches the 52px button */
body.single-product #primary div.product form.cart{display:flex!important;align-items:center!important;gap:.7rem!important}
body.single-product #primary div.product form.cart .quantity{height:52px!important;display:flex!important;align-items:stretch!important;margin:0!important}
body.single-product #primary div.product form.cart .quantity .qty{height:52px!important;min-height:52px!important;box-sizing:border-box!important;padding-top:0!important;padding-bottom:0!important}
body.single-product #primary div.product form.cart .single_add_to_cart_button{height:52px!important;min-height:52px!important;box-sizing:border-box!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}