/* Vitamex V4 — PDP template styles (v1.1.0).
 *
 * Replaces the v1.0.x draft, which styled WooCommerce's default markup.
 * This file styles the gated V4 single-product template
 * (templates/single-product.php) only. Every rule is scoped under .vx4 and
 * every class is pdp- prefixed, so nothing here can leak into the theme's
 * pages, and on live (non-gated) product pages, where no .vx4 wrapper
 * exists, the file has no visual effect. Palette variables (--deep, --cta,
 * --sun, --line, ...) come from assets/css/vx4.css, which the gated PDP
 * enqueues first. Selectors are written complete on single lines — the
 * dangling ".vx4 /* name" fragment pattern from vx4.css is NOT used here
 * (it caused the v1.0.1/v1.0.3 selector bugs). All grid tracks are
 * minmax(0,...) and grid children carry min-width:0, per the v1.0.3
 * 390px-overflow lessons. */

/* Breadcrumb */
.vx4 .pdp-crumb{font-size:13.5px;color:var(--mut);padding:20px 0 4px}
.vx4 .pdp-crumb a:hover{color:var(--emerald-d)}
.vx4 .pdp-crumb b{color:var(--deep)}

/* Layout */
.vx4 .pdp{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:46px;padding:16px 0 54px;align-items:start}
.vx4 .pdp>*{min-width:0}

/* Gallery */
.vx4 .pdp-gal{position:sticky;top:150px;min-width:0}
.vx4 .pdp-gal-main{position:relative;border-radius:26px;overflow:hidden;background:#F2F8F4;box-shadow:var(--sh)}
.vx4 .pdp-gal-main img{width:100%;aspect-ratio:1/1.02;object-fit:cover}
.vx4 .pdp-gbadge{position:absolute;top:14px;left:14px;background:var(--cta);color:#fff;font-family:var(--ui);font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:7px 12px;border-radius:999px}
.vx4 .pdp-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.vx4 .pdp-thumb{border:2.5px solid var(--line);border-radius:14px;overflow:hidden;padding:0;width:84px;height:84px;background:#fff;flex:none}
.vx4 .pdp-thumb.sel{border-color:var(--emerald)}
.vx4 .pdp-thumb img{width:100%;height:100%;object-fit:cover}

/* Buy box */
.vx4 .pdp-buy h1{font-size:clamp(32px,3.6vw,46px);font-weight:900;margin:8px 0 6px;overflow-wrap:break-word}
.vx4 .pdp-rating{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14.5px}
.vx4 .pdp-rating .stars{color:var(--g-imm);letter-spacing:2px;font-size:17px}
.vx4 .pdp-rating a{color:var(--emerald-d);font-weight:700;text-decoration:underline}
.vx4 .pdp-quote{background:var(--warm);border-left:4px solid var(--sun);border-radius:0 13px 13px 0;padding:11px 15px;font-size:14.5px;margin-top:14px}
.vx4 .pdp-quote b{color:var(--deep)}
.vx4 .pdp-price{display:flex;align-items:baseline;gap:12px;margin-top:18px;flex-wrap:wrap}
.vx4 .pdp-price .now{font-family:var(--ui);font-weight:900;font-size:38px;color:var(--deep)}
.vx4 .pdp-price .was{font-family:var(--ui);font-weight:700;font-size:19px;color:var(--mut);text-decoration:line-through}
.vx4 .pdp-price .per{font-size:15px;color:var(--mut);font-weight:600}
.vx4 .pdp-stock{font-size:14px;color:var(--emerald-d);font-weight:700;margin-top:4px}
.vx4 .pdp-stock .dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--emerald);margin-right:7px}
.vx4 .pdp-bullets{list-style:none;margin:18px 0 4px;display:grid;gap:9px}
.vx4 .pdp-bullets li{display:flex;gap:11px;font-size:16px;align-items:flex-start}
.vx4 .pdp-bullets .ck{flex:none;width:24px;height:24px;border-radius:50%;background:var(--emerald-t);color:var(--emerald-d);display:grid;place-items:center;font-weight:900;font-size:13px;margin-top:1px}
.vx4 .pdp-packlbl{font-family:var(--ui);font-weight:800;font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--deep);margin:20px 0 10px}
.vx4 .pdp-packs{display:flex;gap:10px;flex-wrap:wrap}
.vx4 .pdp-pack{flex:1 1 108px;min-width:0;border:2.5px solid var(--line);background:#fff;border-radius:15px;padding:12px 10px;text-align:center;transition:border-color .15s,background .15s;min-height:76px;font-family:inherit}
.vx4 .pdp-pack b{font-family:var(--ui);font-size:14.5px;color:var(--deep);display:block}
.vx4 .pdp-pack span{font-size:12.5px;color:var(--mut);display:block}
.vx4 .pdp-pack .bv{font-family:var(--ui);font-size:10px;font-weight:800;letter-spacing:.07em;color:var(--cta);text-transform:uppercase;margin-top:3px}
.vx4 .pdp-pack.sel{border-color:var(--emerald);background:var(--emerald-t)}
.vx4 .pdp-pack:disabled{opacity:.55;cursor:not-allowed}
.vx4 .pdp-qtyatc{display:flex;gap:12px;margin-top:22px}
.vx4 .pdp-qty{display:inline-flex;align-items:center;border:2.5px solid var(--line);border-radius:999px;flex:none}
.vx4 .pdp-qty button{width:48px;height:54px;border:none;background:none;font-size:20px;font-weight:900;color:var(--deep)}
.vx4 .pdp-qty span{min-width:26px;text-align:center;font-family:var(--ui);font-weight:800;font-size:16.5px}
.vx4 .pdp-atc{flex:1;min-width:0;font-size:17px;min-height:58px}
.vx4 .pdp-tier{margin-top:18px}
.vx4 .pdp-tier .tiered-pricing-table{border:1px solid var(--line);border-radius:14px;background:var(--warm);padding:10px 14px}
.vx4 .pdp-tier-tbl{width:100%;border-collapse:separate;border-spacing:0;border:1.5px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;font-size:14.5px}
.vx4 .pdp-tier-tbl th{font-family:var(--ui);font-weight:800;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--deep);background:var(--warm);text-align:left;padding:10px 14px}
.vx4 .pdp-tier-tbl td{padding:9px 14px;color:var(--ink);border-top:1px solid var(--line)}
.vx4 .pdp-tier-tbl td:first-child{font-family:var(--ui);font-weight:800;color:var(--deep)}
.vx4 .pdp-tier-note{font-size:14px;color:var(--mut);margin-top:8px}
.vx4 .pdp-stackhint{background:var(--emerald-t);border:1.5px solid var(--emerald);border-radius:14px;padding:12px 16px;font-size:14.5px;margin-top:14px;color:var(--ink)}
.vx4 .pdp-delivery{background:var(--sun-t);border:1.5px solid var(--sun);border-radius:14px;padding:12px 16px;font-size:14.5px;margin-top:16px}
.vx4 .pdp-delivery b{color:var(--deep)}
.vx4 .pdp-shipnote{font-size:14px;color:var(--mut);margin-top:10px}
.vx4 .pdp-shipnote b{color:var(--deep)}
.vx4 .pdp-under{margin-top:14px;display:grid;gap:6px;font-size:14px;color:var(--mut)}
.vx4 .pdp-under b{color:var(--deep)}
.vx4 .pdp-under a{color:var(--emerald-d);font-weight:700;text-decoration:underline}
.vx4 .pdp-under .rowline{display:flex;gap:9px;align-items:flex-start}
.vx4 .pdp-buy .payrow{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.vx4 .pdp-buy .paychip{border:1.5px solid var(--line);border-radius:8px;padding:5px 11px;font-family:var(--ui);font-size:12px;font-weight:700;color:var(--deep);background:#fff}

/* WooCommerce fallback form (multi-attribute variable, grouped, external) */
.vx4 .pdp-wcform{margin-top:20px}
.vx4 .pdp-wcform table.variations{width:100%;border-collapse:collapse}
.vx4 .pdp-wcform table.variations td{padding:6px 0;vertical-align:middle}
.vx4 .pdp-wcform table.variations td select{min-height:48px;border:2px solid var(--line);border-radius:12px;padding:0 12px;width:100%;font-size:15px;background:#fff}
.vx4 .pdp-wcform .quantity{display:inline-flex;align-items:center;border:2.5px solid var(--line);border-radius:999px;padding:4px 10px;margin-right:10px}
.vx4 .pdp-wcform .quantity input{width:44px;border:none;text-align:center;font-family:var(--ui);font-weight:800;font-size:16px;background:none;min-height:44px}
.vx4 .pdp-wcform .single_add_to_cart_button{background:var(--cta);color:#fff;border:none;border-radius:999px;min-height:54px;padding:0 30px;font-family:var(--ui);font-weight:800;font-size:16.5px;box-shadow:0 12px 26px rgba(255,106,0,.35)}
.vx4 .pdp-wcform .single_add_to_cart_button:hover{background:var(--cta-h)}
.vx4 .pdp-wcform .woocommerce-variation-price{font-family:var(--ui);font-weight:900;font-size:24px;color:var(--deep);margin:10px 0}

/* Description + facts */
.vx4 .pdp-facts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px}
.vx4 .pdp-facts>*{min-width:0}
.vx4 .pdp-desc{font-size:15.5px}
.vx4 .pdp-desc p{margin-bottom:12px}
.vx4 .pdp-desc ul,.vx4 .pdp-desc ol{margin:0 0 12px 20px}
.vx4 .pdp-desc img,.vx4 .pdp-desc iframe,.vx4 .pdp-desc embed{max-width:100%}
.vx4 .pdp-dtable{width:100%;border-collapse:collapse;font-size:15px}
.vx4 .pdp-dtable td{padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:break-word}
.vx4 .pdp-dtable td:first-child{font-family:var(--ui);font-weight:700;color:var(--deep);width:34%}

/* Complete your stack */
.vx4 .pdp-stack-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px;align-items:stretch}
.vx4 .pdp-stack-grid>*{min-width:0}
.vx4 .pdp-stackpanel{background:var(--deep);color:#fff;border-radius:var(--rad);padding:26px;display:flex;flex-direction:column;gap:9px}
.vx4 .pdp-stackpanel .kicker{color:var(--sun)}
.vx4 .pdp-stackpanel h3{color:#fff;font-size:23px}
.vx4 .pdp-stackpanel p{font-size:14.5px;opacity:.92}
.vx4 .pdp-stackpanel .was{text-decoration:line-through;opacity:.75;font-size:15.5px}
.vx4 .pdp-stackpanel .nowp{font-family:var(--ui);font-weight:900;font-size:26px}
.vx4 .pdp-stackpanel .btn{margin-top:auto;min-height:52px}

/* FAQ */
.vx4 .pdp-faq-item{border-bottom:1px solid var(--line)}
.vx4 .pdp-faq-q{width:100%;background:none;border:none;text-align:left;font-family:var(--ui);font-weight:700;font-size:17px;color:var(--deep);padding:19px 6px;display:flex;justify-content:space-between;gap:16px;min-height:56px;align-items:center}
.vx4 .pdp-faq-q span{color:var(--cta);font-size:21px;font-weight:900;flex:none}
.vx4 .pdp-faq-a{display:none;padding:0 6px 19px;font-size:15.5px;color:var(--ink);max-width:56em}
.vx4 .pdp-faq-item.open .pdp-faq-a{display:block}

/* Reviews band */
.vx4 .pdp-revband{background:var(--emerald-t);border-radius:26px;padding:34px;display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:32px;align-items:center}
.vx4 .pdp-revband .big{font-family:var(--ui);font-weight:900;font-size:58px;color:var(--deep);line-height:1;text-align:center}
.vx4 .pdp-revband .big .stars{display:block;font-size:21px;color:var(--g-imm);letter-spacing:3px;margin-top:7px}
.vx4 .pdp-revhead{font-family:var(--ui);font-weight:800;color:var(--deep);font-size:16.5px}
.vx4 .pdp-revband blockquote{font-size:18.5px;line-height:1.55;margin-top:8px}
.vx4 .pdp-revband cite{font-style:normal;font-family:var(--ui);font-weight:700;font-size:14px;color:var(--deep);display:block;margin-top:9px}

/* Sticky mobile add-to-basket */
.vx4 .pdp-sticky{position:fixed;left:0;right:0;bottom:0;z-index:1400;background:#fff;border-top:1px solid var(--line);box-shadow:0 -10px 30px rgba(6,63,42,.14);padding:10px 14px calc(10px + env(safe-area-inset-bottom));display:none;align-items:center;gap:12px;transform:translateY(110%);transition:transform .35s}
.vx4 .pdp-sticky.show{transform:none}
.vx4 .pdp-sticky img{width:42px;height:50px;object-fit:cover;border-radius:9px;flex:none}
.vx4 .pdp-sticky .st{min-width:0}
.vx4 .pdp-sticky .st b{font-family:var(--ui);font-size:14px;color:var(--deep);display:block;line-height:1.25;overflow-wrap:break-word}
.vx4 .pdp-sticky .st span{font-size:12.5px;color:var(--mut)}
.vx4 .pdp-sticky .btn{margin-left:auto;min-height:52px;padding:12px 20px;font-size:15px;flex:none}
.vx4 .pdp-endspace{display:none}

/* Responsive */
@media (max-width:1020px){
  .vx4 .pdp{grid-template-columns:minmax(0,1fr);gap:30px}
  .vx4 .pdp-gal{position:static}
  .vx4 .pdp-facts{grid-template-columns:minmax(0,1fr)}
  .vx4 .pdp-stack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .vx4 .pdp-stack-grid{grid-template-columns:minmax(0,1fr)}
  .vx4 .pdp-revband{grid-template-columns:minmax(0,1fr);text-align:center;padding:28px 22px}
  .vx4 .pdp-sticky{display:flex}
  .vx4 .pdp-endspace{display:block;height:84px}
  .vx4 .pdp-price .now{font-size:33px}
  .vx4 .pdp-qty button{width:42px}
}
