/* ═══════════════════════════════════════════════════════════
   ZERONIQ Shop System — WooCommerce Base Restyle
   Source: ZERONIQ Design Bundle (tokens.css, styles.css, shop-product.jsx)

   Uses ONLY ZERONIQ core tokens. Dashboard --zvs-* overrides
   cascade on top via zeroniq-woo.php.

   Covers:
   1. Shop archive / product loop
   2. Single product page
   3. Cart page
   4. Checkout page
   5. My Account page
   6. Global WC elements
   7. Mini-Cart drawer
   8. Toast notification
   9. Responsive
   ═══════════════════════════════════════════════════════════ */


/* ─── RESET ──────────────────────────────────────────────── */
.zvs-active .woocommerce,
.zvs-active .woocommerce-page { font-family: var(--f-body); font-size: var(--t-body, 15px); color: var(--fg); }
.zvs-active .woocommerce *:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }

/* ─── CONTAINER OVERRIDE ─────────────────────────────────
   ZERONIQ Theme wraps WC content in:
   1. An unnamed div with inline style max-width:760px (blog post width)
   2. .zv-post-content inside that
   3. Sometimes a sidebar grid on .woocommerce
   We bust all of these for the shop.
   ─────────────────────────────────────────────────────────── */

/* Kill the 760px inline-style wrapper — this is the main bottleneck */
.zvs-active .zv-post-content { max-width: 1320px !important; width: 100% !important; margin: 0 auto; padding: 0 28px !important; }
.zvs-active .zv-post-content > div { max-width: 100% !important; width: 100% !important; }
/* Target the parent of .zv-post-content — the unnamed div with inline max-width:760px */
body.zvs-active div[style*="max-width:760px"],
body.zvs-active div[style*="max-width: 760px"] {
  max-width: 1320px !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
}

/* Expand theme containers */
.zvs-active .zv-container { max-width: 1320px !important; width: 100% !important; padding: 0 28px; }
.zvs-active .woocommerce.columns-4,
.zvs-active .woocommerce.columns-3,
.zvs-active .woocommerce.columns-2,
.zvs-active .woocommerce {
  display: block !important;
  grid-template-columns: none !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* Kill theme sidebar on WC pages */
.zvs-active .woocommerce > aside,
.zvs-active .woocommerce > .widget-area,
.zvs-active .woocommerce > [class*="sidebar"] { display: none !important; }

/* Single product wrapper */
.zvs-active .single-product { max-width: 100% !important; width: 100% !important; }

/* Reset WC default floats — we use CSS grid */
.zvs-active div.product .woocommerce-product-gallery { float: none !important; width: 100% !important; }
.zvs-active div.product .summary.entry-summary { float: none !important; width: 100% !important; }
/* Override WC's .woocommerce div.product div.images { width: 48% } with higher specificity */
body .woocommerce.zvs-active div.product div.images,
body .woocommerce .zvs-active div.product div.images { width: 100% !important; float: none !important; }
body .woocommerce.zvs-active div.product div.summary,
body .woocommerce .zvs-active div.product div.summary { width: 100% !important; float: none !important; }

/* ─── HIDE THEME CRUFT ON WC PAGES ───────────────────────
   The theme injects blog-style elements (author box, share, meta)
   that don't belong on product pages.
   ─────────────────────────────────────────────────────────── */
.zvs-active .zv-author-box { display: none !important; }
.zvs-active .zv-share-buttons,
.zvs-active .zv-post-share,
.zvs-active [class*="zv-share"] { display: none !important; }
/* Hide the blog meta line (date, author, read time) on product pages */
body.single-product.zvs-active .zv-post-meta,
body.single-product.zvs-active .zv-page-header .zv-post-meta { display: none !important; }
/* Restyle the page header for product pages — remove blog styling, keep title */
body.single-product.zvs-active .zv-page-header {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body.single-product.zvs-active .zv-page-header .zv-container {
  max-width: 1320px !important;
  padding: 0 28px !important;
}
/* Style the product title in the page header like the design */
body.single-product.zvs-active .zv-page-header h1 {
  font-family: var(--f-display) !important;
  font-weight: 700 !important;
  font-size: clamp(34px, 4vw, 46px) !important;
  letter-spacing: -.035em !important;
  line-height: 1.02 !important;
  color: var(--fg) !important;
  margin: 0 !important;
  padding: 20px 0 24px !important;
}
/* Keep breadcrumb but style it as eyebrow */
body.single-product.zvs-active .zv-breadcrumbs {
  font-family: var(--f-mono) !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--fg-mute) !important;
}
body.single-product.zvs-active .zv-breadcrumbs a { color: var(--fg-mute) !important; text-decoration: none !important; }
body.single-product.zvs-active .zv-breadcrumbs a:hover { color: var(--fg) !important; }


/* ═══ 1 · SHOP ARCHIVE / PRODUCT LOOP ═══════════════════ */

.zvs-active ul.products {
  display: grid !important;
  grid-template-columns: repeat(var(--zvs-cols, 4), 1fr);
  gap: var(--s-4, 16px);
  list-style: none; padding: 0;
  justify-content: start !important;
  justify-items: stretch !important;
}
.zvs-active ul.products li.product { margin: 0 !important; width: 100% !important; float: none !important; }

.zvs-card {
  background: var(--bg-2);
  border: 1px solid var(--line-color);
  border-radius: var(--r-card);
  overflow: hidden;
  transition: transform var(--dur-base, .25s) var(--ease-out), box-shadow var(--dur-base, .25s), border-color var(--dur-base, .25s);
}
.zvs-card:hover { transform: translateY(-3px); box-shadow: var(--sh-card, 0 20px 50px -20px rgba(0,0,0,.25)); border-color: var(--line-color-2); }

.zvs-img-wrap { overflow: hidden; background: var(--bg-3); position: relative; }
.zvs-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow, .5s) var(--ease-out); }
.zvs-card:hover .zvs-img-wrap img { transform: scale(1.04); }

.zvs-badge {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  display: inline-block; width: fit-content;
  padding: 5px 11px; border-radius: var(--r-chip);
  font-family: var(--f-mono); font-size: 10.5px; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  background: var(--lime); color: var(--lime-ink);
}
.zvs-active .onsale { display: none !important; }

.zvs-loop-cat {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute);
  padding: 16px 16px 0;
}
.zvs-active ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--f-display); font-size: 16px; font-weight: 600;
  letter-spacing: -.015em; line-height: 1.25;
  padding: 8px 16px 0; margin: 0; color: var(--fg);
}
.zvs-active ul.products li.product .price {
  padding: 8px 16px 0; font-family: var(--f-display); font-size: 16px; font-weight: 600;
  color: var(--zvs-price, var(--lime)) !important;
}
.zvs-active ul.products li.product .price del { font-size: 13px; font-weight: 400; color: var(--fg-mute) !important; opacity: .6; text-decoration: line-through; }
.zvs-active ul.products li.product .price del .woocommerce-Price-amount { color: var(--fg-mute) !important; }
.zvs-active ul.products li.product .price ins { text-decoration: none; color: var(--zvs-price, var(--lime)) !important; }

/* Star rating — base reset */
.zvs-active ul.products li.product .star-rating,
.zvs-active .woocommerce .products .star-rating,
.zvs-active .star-rating {
  color: var(--zvs-star, var(--lime)) !important;
  float: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  width: 5.4em !important;
  overflow: hidden !important;
  clear: both !important;
}
/* Stars inside loop card — margin-left aligns with card text, padding-left breaks font star rendering */
.zvs-active ul.products li.product a .star-rating,
.zvs-active ul.products li.product .woocommerce-loop-product__link .star-rating {
  margin-top: 8px !important;
  margin-left: 16px !important;
  padding-left: 0 !important;
}
/* Stars outside link wrapper (e.g. directly in .zvs-card-info) */
.zvs-active .zvs-card-info .star-rating { margin-top: 6px !important; }
.zvs-active .star-rating span,
.zvs-active ul.products .star-rating span { float: left !important; }
.zvs-active .star-rating span::before { color: var(--zvs-star, var(--lime)) !important; }

.zvs-active ul.products li.product .button,
.zvs-active ul.products li.product .add_to_cart_button {
  display: block; width: calc(100% - 32px); margin: 12px 16px 16px;
  padding: 12px 0; border-radius: var(--r-btn);
  background: transparent; border: 1px solid var(--line-color-2); color: var(--fg);
  font-family: var(--f-body); font-size: 14px; font-weight: 500;
  text-align: center; text-decoration: none; cursor: pointer;
  transition: all .15s var(--ease-out);
}
.zvs-active ul.products li.product .button:hover,
.zvs-active ul.products li.product .add_to_cart_button:hover {
  background: var(--lime); color: var(--lime-ink); border-color: transparent;
  transform: translateY(-1px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6);
}


/* ═══ 2 · SINGLE PRODUCT ════════════════════════════════ */

.zvs-active div.product {
  display: grid; grid-template-columns: 1.25fr 1fr;
  gap: 56px; align-items: start;
  max-width: 1320px; margin: 0 auto; padding: 24px 28px 64px;
}
/* Images column: align top edge with summary headline */
.zvs-active div.product div.images { align-self: start; }
.zvs-active div.product div.summary { align-self: start; }

/* Gallery */
.zvs-active div.product div.images {
  display: grid; gap: 12px;
}
.zvs-active div.product div.images .woocommerce-product-gallery__wrapper { border-radius: var(--r-card); background: var(--bg-3); }
/* overflow:hidden intentionally NOT set on __wrapper — FlexSlider needs it unconstrained.
   Clipping + border-radius live on .flex-viewport instead (see below). */
.zvs-active div.product div.images img { border-radius: 0; }
.zvs-active div.product div.images .flex-viewport { border-radius: var(--r-card); overflow: hidden; }
/* Thumb grid — applied WITHOUT .zvs-active to avoid JS-dependent layout shift */
div.product div.images .flex-control-thumbs {
  display: grid !important; grid-template-columns: repeat(5, 1fr) !important; gap: 10px !important;
  padding: 0 !important; margin: 0 !important; list-style: none !important;
}
div.product div.images .flex-control-thumbs li {
  aspect-ratio: 1/1 !important; border-radius: var(--r-sm, 8px) !important; overflow: hidden !important;
  opacity: .5 !important; border: 1px solid var(--line-color, rgba(255,255,255,.08)) !important;
  cursor: pointer !important; transition: opacity .15s, border-color .15s !important;
  margin: 0 !important; padding: 0 !important; width: 100% !important; float: none !important;
}
div.product div.images .flex-control-thumbs li img {
  width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important;
}
div.product div.images .flex-control-thumbs li:has(img.flex-active),
div.product div.images .flex-control-thumbs li:hover { opacity: 1 !important; border-color: var(--lime, #0848FF) !important; border-width: 1.5px !important; }
/* zvs-active variants kept for specificity on older WC */
.zvs-active div.product div.images .flex-control-thumbs { display: grid !important; }
.zvs-active div.product div.images .flex-control-thumbs li { float: none !important; }
/* Hide WC default nav arrows */
.zvs-active div.product div.images .flex-direction-nav { display: none !important; }
/* Gallery main image indicator — subtle lime glow on viewport */
.zvs-active div.product div.images .flex-viewport { border-radius: var(--r-card) !important; overflow: hidden !important; }

/* Title */
.zvs-active div.product .product_title {
  font-family: var(--f-display); font-weight: 700;
  font-size: clamp(34px, 4vw, 46px); letter-spacing: -.035em; line-height: 1.02;
}
/* *text* in product title — grey, weight 400 */
.zvs-active div.product .product_title .zvs-title-muted {
  color: var(--fg-mute) !important;
  font-weight: 400 !important;
}

/* Short description */
.zvs-active div.product .woocommerce-product-details__short-description {
  font-size: 16px; line-height: 1.6; color: var(--fg-mute); max-width: 520px;
  margin-top: 0 !important; margin-bottom: 16px !important;
}
/* Hide WC native rating row on single product — replaced by zvs-rating-row */
.zvs-active div.product .woocommerce-product-rating { display: none !important; }

/* Price */
.zvs-active div.product p.price,
body.zvs-active div.product p.price {
  display: flex !important; align-items: baseline !important; gap: 14px !important;
  padding: 16px 0 !important; border-top: 1px solid var(--line-color) !important; border-bottom: 1px solid var(--line-color) !important;
  font-family: var(--f-display) !important; margin: 0 0 16px !important;
}
/* Single price for variable products (hide range, show selected) */
.zvs-active .zvs-single-price p.price {
  display: flex !important; align-items: baseline !important; gap: 14px !important;
  padding: 20px 0 !important; border-top: 1px solid var(--line-color) !important; border-bottom: 1px solid var(--line-color) !important;
  font-family: var(--f-display) !important; margin: 0 0 20px !important;
}
.zvs-active .zvs-single-price .woocommerce-Price-amount { font-size: 44px !important; font-weight: 700 !important; letter-spacing: -.035em !important; line-height: 1 !important; }
.zvs-active div.product p.price .woocommerce-Price-amount,
body.zvs-active div.product p.price .woocommerce-Price-amount { font-size: 44px !important; font-weight: 700 !important; letter-spacing: -.035em !important; line-height: 1 !important; }
.zvs-active div.product p.price del { font-size: 18px !important; font-weight: 400 !important; color: var(--fg-mute-2) !important; }
.zvs-active div.product p.price del .woocommerce-Price-amount { font-size: 18px !important; font-weight: 400 !important; }
.zvs-active div.product p.price ins { text-decoration: none !important; }

/* Quantity + ATC row */
/* form.cart: block for variable products (table.variations + single_variation_wrap stack vertically) */
.zvs-active div.product form.cart {
  display: block !important;
  margin: 20px 0 !important;
}
/* The actual qty+button row — variable product */
.zvs-active div.product .woocommerce-variation-add-to-cart {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 16px !important;
  align-items: center !important;
  margin-top: 20px !important;
}
/* Simple product: qty + button are direct children of form.cart */
.zvs-active div.product form.cart > .quantity {
  display: inline-flex !important;
  vertical-align: middle !important;
}
.zvs-active div.product form.cart > .quantity + button.single_add_to_cart_button {
  margin-left: 16px !important;
}
/* Single variation wrap: no extra spacing */
.zvs-active div.product .single_variation_wrap { margin: 0 !important; }
/* Hide WC default variation reset + price inside single_variation_wrap */
.zvs-active div.product form.cart .reset_variations { display: none !important; }
.zvs-active .quantity {
  display: inline-flex !important; align-items: center !important;
  border: 1px solid var(--line-color-2) !important; border-radius: var(--r-btn) !important; overflow: hidden !important;
  flex-shrink: 0 !important;
}
.zvs-active .quantity .qty {
  width: 36px !important; text-align: center !important; font-family: var(--f-display) !important; font-weight: 600 !important; font-size: 16px !important;
  color: var(--fg) !important; background: transparent !important; border: none !important; outline: none !important; padding: 0 !important;
  -moz-appearance: textfield !important;
}
.zvs-active .quantity .qty::-webkit-outer-spin-button,
.zvs-active .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none !important; }
/* Qty stepper buttons (−/+) */
.zvs-active .zvs-qty-btn {
  width: 44px !important; height: 50px !important; font-size: 18px !important;
  color: var(--fg-mute) !important; background: transparent !important; border: none !important;
  cursor: pointer !important; transition: background .15s, color .15s !important;
  display: grid !important; place-items: center !important; flex-shrink: 0 !important;
  font-family: var(--f-body) !important;
  -webkit-appearance: none !important; appearance: none !important;
  border-radius: 0 !important;
}
.zvs-active .zvs-qty-btn:hover { background: var(--bg-2) !important; color: var(--fg) !important; }
.zvs-active .quantity .qty {
  height: 50px !important; line-height: 50px !important;
}

/* ATC button */
.zvs-active div.product .single_add_to_cart_button,
body.zvs-active div.product .single_add_to_cart_button {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important;
  padding: 0 28px !important; height: 50px !important; border-radius: var(--r-btn) !important;
  background: var(--lime) !important; color: var(--lime-ink) !important; border: none !important;
  font-family: var(--f-body) !important; font-size: 16px !important; font-weight: 500 !important; cursor: pointer !important;
  flex: 1 !important;
  -webkit-appearance: none !important; appearance: none !important;
  transition: transform .15s var(--ease-out), box-shadow .25s !important;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6) !important;
}
.zvs-active div.product .single_add_to_cart_button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 30%, transparent) inset, 0 10px 30px -10px rgb(8 72 255 / .8) !important;
}

/* Variations */
.zvs-active .variations td { padding: 8px 0; }
.zvs-active .variations .label label {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute);
}
.zvs-active .variations select {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-btn);
  color: var(--fg); padding: 14px 16px; font-family: var(--f-body); font-size: 14px;
  transition: border-color .15s;
}
.zvs-active .variations select:focus { border-color: var(--lime); outline: none; }

/* Tabs */
.zvs-active div.product .woocommerce-tabs { grid-column: 1 / -1; margin-top: 32px !important; }
.zvs-active div.product .woocommerce-tabs ul.tabs,
body.zvs-active div.product .woocommerce-tabs ul.tabs {
  display: flex !important; gap: 4px !important; border-bottom: 1px solid var(--line-color) !important;
  padding: 0 !important; margin: 0 0 40px !important; list-style: none !important; overflow-x: auto !important;
  background: transparent !important;
}
.zvs-active div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar { display: none; }
.zvs-active div.product .woocommerce-tabs ul.tabs li,
body.zvs-active div.product .woocommerce-tabs ul.tabs li {
  background: transparent !important; border: none !important; border-radius: 0 !important; margin: 0 !important; padding: 0 !important;
}
.zvs-active div.product .woocommerce-tabs ul.tabs li::before,
.zvs-active div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.zvs-active div.product .woocommerce-tabs ul.tabs li a,
body.zvs-active div.product .woocommerce-tabs ul.tabs li a {
  display: block !important; padding: 14px 18px !important; font-family: var(--f-body) !important; font-size: 14px !important; font-weight: 500 !important;
  color: var(--fg-mute) !important; border-bottom: 2px solid transparent !important; margin-bottom: -1px !important;
  text-decoration: none !important; white-space: nowrap !important; transition: color .15s !important;
  background: transparent !important;
}
.zvs-active div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--fg) !important; }
.zvs-active div.product .woocommerce-tabs ul.tabs li.active a,
body.zvs-active div.product .woocommerce-tabs ul.tabs li.active a {
  font-weight: 600 !important; color: var(--fg) !important; border-bottom-color: var(--lime) !important;
}
.zvs-active div.product .woocommerce-tabs .panel { border: none; padding: 0; font-size: 15px; line-height: 1.55; color: var(--fg-mute); }
.zvs-active div.product .woocommerce-tabs .panel h2 {
  font-family: var(--f-display); font-weight: 700; font-size: 28px;
  letter-spacing: -.03em; color: var(--fg); margin-bottom: 24px;
}

/* Reviews */
.zvs-active #reviews { display: grid !important; grid-template-columns: 280px 1fr !important; gap: 56px !important; }
.zvs-active #reviews .woocommerce-Reviews-title { grid-column: 1 / -1 !important; font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 28px !important; letter-spacing: -.03em !important; }
.zvs-active #comments .commentlist { list-style: none; padding: 0; }
.zvs-active #comments .commentlist li {
  display: grid; grid-template-columns: 44px 1fr; gap: 18px;
  padding: 20px 0; border-top: 1px solid var(--line-color);
}
.zvs-active #comments .commentlist li:last-child { border-bottom: 1px solid var(--line-color); }
.zvs-active #comments .commentlist li img.avatar { width: 44px; height: 44px; border-radius: 999px; background: var(--bg-3); }
.zvs-active #comments .commentlist .meta strong { font-family: var(--f-display); font-weight: 600; font-size: 15px; }
.zvs-active #comments .commentlist .meta time,
.zvs-active #comments .commentlist .meta .woocommerce-review__dash { font-family: var(--f-mono); font-size: 11px; color: var(--fg-mute); }
.zvs-active #comments .commentlist .star-rating { margin: 0 !important; padding: 0 !important; font-size: 11px !important; display: inline-block !important; }
.zvs-active #comments .commentlist .description p { font-size: 15px; line-height: 1.55; color: var(--fg-mute); }

/* Review form */
.zvs-active #review_form label {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute);
  display: block; margin-bottom: 8px;
}
.zvs-active #review_form input[type="text"],
.zvs-active #review_form input[type="email"],
.zvs-active #review_form textarea {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-sm);
  color: var(--fg); padding: 14px 16px; font-family: var(--f-body); font-size: 14px; width: 100%;
  transition: border-color .15s;
}
.zvs-active #review_form input:focus,
.zvs-active #review_form textarea:focus { border-color: var(--lime); outline: none; }

/* Meta */
.zvs-active .product_meta {
  display: flex; gap: 12px; flex-wrap: wrap;
  font-family: var(--f-mono); font-size: 12px; letter-spacing: .02em; color: var(--fg-mute);
  margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--line-color);
}
.zvs-active .product_meta a { color: var(--fg-mute); text-decoration: none; }
.zvs-active .product_meta a:hover { color: var(--lime); }

/* Related */
.zvs-active .related.products,
.zvs-active .upsells.products,
.zvs-active section.related,
.zvs-active section.upsells {
  grid-column: 1 / -1 !important; border-top: 1px solid var(--line-color) !important;
  padding-top: 64px !important; margin-top: 32px !important;
}
.zvs-active .related.products > h2,
.zvs-active .upsells.products > h2,
.zvs-active section.related > h2,
.zvs-active section.upsells > h2 {
  font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 32px !important;
  letter-spacing: -.03em !important; margin-bottom: 28px !important; color: var(--fg) !important;
}
/* Fix WC ghost slot: woocommerce-layout.css sets clear:both on li.first
   In a CSS Grid context this creates a phantom empty column before the first item.
   Force clear:none + explicit grid-column-start:1 */
.zvs-active ul.products li.product { clear: none !important; }
.zvs-active ul.products li.first { clear: none !important; grid-column-start: 1 !important; }

/* Ensure related grid has 4 columns — left-aligned */
.zvs-active .related.products ul.products,
.zvs-active .upsells.products ul.products,
.zvs-active section.related ul.products,
.zvs-active section.upsells ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  justify-content: start !important;
  justify-items: stretch !important;
}


/* ═══ 3 · CART PAGE ═════════════════════════════════════ */

.zvs-cart-style-modern .woocommerce-cart-form { max-width: 1320px; margin: 0 auto; }
.zvs-cart-style-modern table.cart {
  border-collapse: separate; border-spacing: 0;
  border: 1px solid var(--line-color); border-radius: var(--r-card); overflow: hidden; width: 100%;
}
.zvs-cart-style-modern table.cart th {
  background: var(--bg-2); font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute); padding: 14px 22px; border: none; text-align: left;
}
.zvs-cart-style-modern table.cart td { background: var(--bg); border-bottom: 1px solid var(--line-color); padding: 16px 22px; vertical-align: middle; }
.zvs-cart-style-modern table.cart td.product-name a { font-family: var(--f-display); font-weight: 600; font-size: 15px; color: var(--fg); text-decoration: none; }
.zvs-cart-style-modern table.cart td.product-name a:hover { color: var(--lime); }
.zvs-cart-style-modern table.cart td.product-price,
.zvs-cart-style-modern table.cart td.product-subtotal { font-family: var(--f-display); font-weight: 600; font-size: 15px; }
.zvs-cart-style-modern table.cart td.product-thumbnail img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--r-sm); }
.zvs-cart-style-modern table.cart td.product-remove a { color: var(--fg-mute-2); font-size: 18px; text-decoration: none; transition: color .15s; }
.zvs-cart-style-modern table.cart td.product-remove a:hover { color: var(--fg); }

.zvs-cart-style-modern .cart_totals {
  background: var(--bg-2); border-radius: var(--r-card); border: 1px solid var(--line-color); padding: 28px;
}
.zvs-cart-style-modern .cart_totals h2 { font-family: var(--f-display); font-weight: 700; font-size: 18px; letter-spacing: -.02em; margin-bottom: 20px; }
.zvs-cart-style-modern .cart_totals table { border: none; }
.zvs-cart-style-modern .cart_totals table th {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500; letter-spacing: .14em;
  text-transform: uppercase; color: var(--fg-mute); padding: 14px 0; border: none;
}
.zvs-cart-style-modern .cart_totals table td { font-family: var(--f-display); font-weight: 600; padding: 14px 0; border: none; }
.zvs-cart-style-modern .cart_totals .order-total td { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }

.zvs-cart-style-modern .wc-proceed-to-checkout .checkout-button {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 15px 20px; border-radius: var(--r-btn);
  background: var(--lime); color: var(--lime-ink);
  font-family: var(--f-body); font-size: 15px; font-weight: 500;
  text-decoration: none; border: none;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6);
  transition: transform .15s var(--ease-out), box-shadow .25s;
}
.zvs-cart-style-modern .wc-proceed-to-checkout .checkout-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 30%, transparent) inset, 0 10px 30px -10px rgb(8 72 255 / .8);
}

.zvs-cart-style-modern .coupon .input-text {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-btn);
  color: var(--fg); padding: 12px 16px; font-family: var(--f-mono); font-size: 13px;
}
.zvs-cart-style-modern .coupon .input-text:focus { border-color: var(--lime); outline: none; }
.zvs-cart-style-modern .coupon .button {
  border-radius: var(--r-btn); padding: 12px 20px; font-size: 14px; font-weight: 500;
  background: transparent; border: 1px solid var(--line-color-2); color: var(--fg);
  cursor: pointer; transition: all .15s;
}
.zvs-cart-style-modern .coupon .button:hover { background: var(--bg-2); }


/* ═══ 4 · CHECKOUT ══════════════════════════════════════ */

.zvs-checkout-style-modern .woocommerce-checkout { max-width: 1320px; margin: 0 auto; }
.zvs-checkout-style-modern .woocommerce-checkout h3 { font-family: var(--f-display); font-weight: 700; font-size: 20px; letter-spacing: -.015em; margin-bottom: 24px; }

.zvs-checkout-style-modern .form-row label {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute); margin-bottom: 8px;
}
.zvs-checkout-style-modern .form-row input.input-text,
.zvs-checkout-style-modern .form-row textarea,
.zvs-checkout-style-modern .form-row select,
.zvs-checkout-style-modern .select2-container .select2-selection {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-sm);
  color: var(--fg); padding: 14px 16px; font-family: var(--f-body); font-size: 14px; transition: border-color .15s;
}
.zvs-checkout-style-modern .form-row input.input-text:focus,
.zvs-checkout-style-modern .form-row textarea:focus { border-color: var(--lime); outline: none; }

.zvs-checkout-style-modern .woocommerce-checkout-review-order-table {
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card); overflow: hidden;
}
.zvs-checkout-style-modern .woocommerce-checkout-review-order-table th {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500; letter-spacing: .14em;
  text-transform: uppercase; color: var(--fg-mute); padding: 14px 22px; background: var(--bg-3); border: none;
}
.zvs-checkout-style-modern .woocommerce-checkout-review-order-table td { padding: 14px 22px; border: none; border-bottom: 1px solid var(--line-color); }
.zvs-checkout-style-modern .woocommerce-checkout-review-order-table .product-name { font-family: var(--f-display); font-weight: 600; font-size: 15px; }
.zvs-checkout-style-modern .woocommerce-checkout-review-order-table .order-total td { font-family: var(--f-display); font-size: 24px; font-weight: 700; letter-spacing: -.02em; }

.zvs-checkout-style-modern #place_order {
  display: flex; align-items: center; justify-content: center;
  width: 100%; padding: 16px; border-radius: var(--r-btn);
  background: var(--lime); color: var(--lime-ink); font-family: var(--f-body); font-size: 16px; font-weight: 500;
  border: none; cursor: pointer;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6);
  transition: transform .15s var(--ease-out), box-shadow .25s;
}
.zvs-checkout-style-modern #place_order:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 30%, transparent) inset, 0 10px 30px -10px rgb(8 72 255 / .8);
}

.zvs-checkout-style-modern .woocommerce-checkout-payment {
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card); padding: 24px;
}
.zvs-checkout-style-modern .wc_payment_methods { border: none; padding: 0; }
.zvs-checkout-style-modern .wc_payment_methods li { border-bottom: 1px solid var(--line-color); padding: 14px 0; }
.zvs-checkout-style-modern .wc_payment_methods li:last-child { border: none; }
.zvs-checkout-style-modern .wc_payment_methods li label {
  font-family: var(--f-body); font-weight: 500; font-size: 14px;
  text-transform: none; letter-spacing: normal;
}


/* ═══ 4b · CHECKOUT (WC BLOCKS) ════════════════════════ */

/* ── Layout ── */
.zvs-checkout-style-modern .wc-block-checkout { max-width: 1320px; margin: 0 auto; }
.zvs-checkout-style-modern .wc-block-checkout__main { padding-right: 48px; }
.zvs-checkout-style-modern .wc-block-checkout__sidebar {
    position: sticky !important; top: 100px !important; align-self: start !important;
    background: var(--bg-2) !important;
    border: 1px solid var(--line-color) !important;
    border-radius: var(--r-card) !important;
    overflow: hidden !important;
    padding: 0 !important;
}

/* ── Step headings ── */
.zvs-checkout-style-modern .wc-block-components-checkout-step__title {
    font-family: var(--f-display) !important;
    font-size: 17px !important; font-weight: 700 !important;
    letter-spacing: -.02em !important; color: var(--fg) !important;
    margin-bottom: 20px !important;
}
.zvs-checkout-style-modern .wc-block-components-checkout-step {
    padding: 16px 0 !important; margin-bottom: 0 !important;
    border-bottom: 1px solid var(--line-color) !important;
}
.zvs-checkout-style-modern .wc-block-components-checkout-step:last-child { border-bottom: none !important; }
/* WC adds extra padding on the checkout blocks themselves */
.zvs-checkout-style-modern .wc-block-checkout__contact-fields,
.zvs-checkout-style-modern .wc-block-checkout__billing-fields,
.zvs-checkout-style-modern .wc-block-checkout__shipping-fields,
.zvs-checkout-style-modern .wc-block-checkout__payment-method,
.zvs-checkout-style-modern .wc-block-checkout__order-notes {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    margin-bottom: 0 !important;
}

/* ── Text inputs — WC handles ALL layout/positioning, we ONLY style visuals ── */
.zvs-checkout-style-modern .wc-block-components-text-input input {
    background: var(--bg-3, #22252E) !important;
    border: 1px solid var(--line-color-2, rgba(255,255,255,.12)) !important;
    border-radius: var(--r-btn, 10px) !important;
    color: var(--fg, #F7F5F0) !important;
    font-family: var(--f-display) !important;
    box-shadow: none !important; outline: none !important;
    /* NO height, padding, font-size — WC controls these for floating label to work */
    transition: border-color .15s !important;
}
.zvs-checkout-style-modern .wc-block-components-text-input input:focus {
    border-color: var(--lime) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lime, #0848FF) 10%, transparent) !important;
}
/* Label — ONLY color, NO position/size/transform (WC floating label system handles all) */
.zvs-checkout-style-modern .wc-block-components-text-input label {
    color: var(--fg-mute) !important;
    /* absolutely nothing else — WC's JS adds/removes is-active and animates */
}
.zvs-checkout-style-modern .wc-block-components-text-input.has-error input {
    border-color: var(--danger, #ef4444) !important;
}

/* ── Country/State dropdowns (wc-blocks-components-select) ── */
.zvs-checkout-style-modern .wc-blocks-components-select__container {
    background: var(--bg-3, #22252E) !important;
    border: 1px solid var(--line-color-2, rgba(255,255,255,.12)) !important;
    border-radius: var(--r-btn, 10px) !important;
    transition: border-color .15s !important;
}
.zvs-checkout-style-modern .wc-blocks-components-select__container:focus-within {
    border-color: var(--lime) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lime, #0848FF) 10%, transparent) !important;
}
.zvs-checkout-style-modern .wc-blocks-components-select__label {
    font-family: var(--f-mono) !important;
    font-weight: 600 !important; letter-spacing: .06em !important;
    text-transform: uppercase !important; color: var(--fg-mute) !important;
}
.zvs-checkout-style-modern .wc-blocks-components-select__select {
    background: transparent !important; border: none !important; outline: none !important;
    color: var(--fg, #F7F5F0) !important; font-family: var(--f-display) !important;
}
.zvs-checkout-style-modern .wc-blocks-components-select__select option {
    background: var(--bg-3, #22252E) !important; color: var(--fg) !important;
}

/* ── Combobox (State) ── */
.zvs-checkout-style-modern .wc-block-components-combobox {
    background: var(--bg-3) !important;
    border: 1px solid var(--line-color-2) !important;
    border-radius: var(--r-btn) !important;
    transition: border-color .15s !important;
}
.zvs-checkout-style-modern .wc-block-components-combobox:focus-within {
    border-color: var(--lime) !important;
}
.zvs-checkout-style-modern .wc-block-components-combobox input {
    background: transparent !important; border: none !important; outline: none !important;
    color: var(--fg) !important; font-family: var(--f-display) !important;
}
.zvs-checkout-style-modern .wc-block-components-combobox label {
    font-family: var(--f-mono) !important; font-weight: 600 !important;
    letter-spacing: .06em !important; text-transform: uppercase !important;
    color: var(--fg-mute) !important;
}

/* ── Textarea ── */
.zvs-checkout-style-modern .wc-block-components-textarea textarea {
    background: var(--bg-3) !important;
    border: 1px solid var(--line-color-2) !important;
    border-radius: var(--r-btn) !important;
    color: var(--fg) !important; font-family: var(--f-display) !important;
    outline: none !important; resize: vertical !important;
    transition: border-color .15s !important;
}
.zvs-checkout-style-modern .wc-block-components-textarea textarea:focus { border-color: var(--lime) !important; }

/* ── Checkbox ── */
.zvs-checkout-style-modern .wc-block-components-checkbox__label {
    font-family: var(--f-display) !important; font-size: 14px !important; color: var(--fg-mute) !important;
}

/* ── Validation errors ── */
.zvs-checkout-style-modern .wc-block-components-validation-error p {
    color: var(--danger, #fca5a5) !important; font-size: 11px !important;
    font-family: var(--f-mono) !important; margin-top: 4px !important;
}

/* ── Payment notice ── */
.zvs-checkout-style-modern .wc-block-components-notice-banner {
    background: var(--bg-3) !important;
    border: 1px solid var(--line-color) !important;
    border-radius: var(--r-btn) !important;
    color: var(--fg-mute) !important;
    font-family: var(--f-display) !important; font-size: 14px !important;
}
.zvs-checkout-style-modern .wc-block-components-notice-banner.is-error {
    background: color-mix(in srgb, var(--danger, #EF4444) 8%, transparent) !important;
    border-color: color-mix(in srgb, var(--danger, #EF4444) 25%, transparent) !important; color: var(--danger, #fca5a5) !important;
}

/* ── Terms ── */
.zvs-checkout-style-modern .wc-block-checkout__terms {
    font-family: var(--f-display) !important; font-size: 13px !important; color: var(--fg-mute) !important;
}
.zvs-checkout-style-modern .wc-block-checkout__terms a { color: var(--lime) !important; text-decoration: none !important; }

/* ── Place order button ── */
.zvs-checkout-style-modern .wc-block-components-checkout-place-order-button,
.zvs-checkout-style-modern .wc-block-checkout__place-order .wc-block-components-button {
    width: 100% !important; background: var(--lime) !important;
    color: var(--lime-ink, #FFFFFF) !important; border: none !important;
    border-radius: var(--r-btn) !important;
    font-family: var(--f-display) !important; font-size: 16px !important; font-weight: 700 !important;
    padding: 16px 24px !important; cursor: pointer !important;
    transition: filter .15s, transform .15s !important;
    box-shadow: 0 4px 24px -8px color-mix(in srgb, var(--lime, #0848FF) 35%, transparent) !important;
}
.zvs-checkout-style-modern .wc-block-components-checkout-place-order-button:hover {
    filter: brightness(1.08) !important; transform: translateY(-1px) !important;
}

/* ── Back to cart / actions row ── */
.zvs-checkout-style-modern .wc-block-checkout__actions_row {
    display: flex !important; align-items: center !important; gap: 16px !important;
    margin-top: 24px !important;
}
.zvs-checkout-style-modern .wc-block-checkout__return-to-cart-link {
    color: var(--fg-mute) !important; font-family: var(--f-display) !important;
    font-size: 13px !important; text-decoration: none !important; transition: color .15s !important;
    flex-shrink: 0 !important;
}
.zvs-checkout-style-modern .wc-block-checkout__return-to-cart-link:hover { color: var(--fg) !important; }

/* ── Sidebar: align top with left column ── */
.zvs-checkout-style-modern .wc-block-checkout > div {
    align-items: start !important;
}

/* ── Order summary card wrapper ──
   WC ships this block with its own default border (paper/0.2) and a 5px
   radius, which clashed with the theme cards and left the top edge looking
   broken on the mobile collapsed "Bestellübersicht" panel. Restyle to the
   theme card tokens and clip inner content so all four border edges render
   cleanly. */
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-block {
    border: 1px solid var(--line-color) !important;
    border-radius: var(--r-card) !important;
    overflow: hidden !important;
}
/* Mobile collapsed "Bestellübersicht" header + content: WC renders these
   flush to the card edge (no inset), so the label and the divider line ran
   into the rounded border. Inset everything and give the toggle row real
   breathing room. */
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary-block .wc-block-components-panel__button,
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary__title,
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary__title-button {
    padding: 18px 22px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary-block .wc-block-components-panel__content,
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary__content {
    padding: 0 22px 8px !important;
}
/* Divider under the collapsed header: inset from the rounded edges */
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary-block .wc-block-components-panel__button {
    border-bottom: 1px solid var(--line-color) !important;
}

/* ── Order summary header ── */
.zvs-checkout-style-modern .wc-block-components-order-summary .wc-block-components-panel__button {
    padding: 20px 24px !important; width: 100% !important;
    background: transparent !important; border: none !important;
    border-bottom: 1px solid var(--line-color) !important;
    font-family: var(--f-display) !important; font-size: 15px !important; font-weight: 700 !important;
    color: var(--fg) !important; cursor: pointer !important;
    display: flex !important; justify-content: space-between !important; align-items: center !important;
}

/* ── Order summary items ── */
.zvs-checkout-style-modern .wc-block-components-order-summary__content { padding: 0 24px !important; }
.zvs-checkout-style-modern .wc-block-components-order-summary-item {
    display: grid !important;
    grid-template-columns: 52px 1fr auto !important;
    gap: 12px !important;
    align-items: start !important;
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--line-color) !important;
}
.zvs-checkout-style-modern .wc-block-components-order-summary-item:last-child { border-bottom: none !important; }

/* Image — fixed size, no WC padding-bottom hack */
.zvs-checkout-style-modern .wc-block-components-order-summary-item__image {
    grid-column: 1 !important; grid-row: 1 !important;
    width: 52px !important; height: 52px !important; padding: 0 !important;
    border-radius: var(--r-sm, 8px) !important; overflow: hidden !important;
    background: var(--bg-3) !important; flex-shrink: 0 !important;
    align-self: start !important;
}
.zvs-checkout-style-modern .wc-block-components-order-summary-item__image img {
    width: 52px !important; height: 52px !important;
    object-fit: cover !important; display: block !important;
    border-radius: var(--r-sm, 8px) !important;
}
/* Item description column */
.zvs-checkout-style-modern .wc-block-components-order-summary-item__description {
    grid-column: 2 !important; align-self: start !important;
}
.zvs-checkout-style-modern .wc-block-components-order-summary-item__name {
    font-family: var(--f-display) !important; font-size: 13px !important;
    font-weight: 600 !important; color: var(--fg) !important;
    line-height: 1.3 !important; margin-bottom: 3px !important;
}
.zvs-checkout-style-modern .wc-block-components-order-summary-item__subtitle,
.zvs-checkout-style-modern .wc-block-components-order-summary-item__individual-price {
    font-family: var(--f-mono) !important; font-size: 10px !important;
    color: var(--fg-mute) !important; letter-spacing: .04em !important;
    text-transform: uppercase !important;
}
/* Price column */
.zvs-checkout-style-modern .wc-block-components-order-summary-item__total-price {
    grid-column: 3 !important; align-self: start !important;
    font-family: var(--f-display) !important; font-size: 13px !important;
    font-weight: 700 !important; color: var(--fg) !important; white-space: nowrap !important;
}
/* Quantity badge */
.zvs-checkout-style-modern .wc-block-components-order-summary-item__quantity {
    background: var(--bg-3) !important;
    border: 1px solid var(--line-color-2) !important;
    border-radius: 999px !important; color: var(--fg-mute) !important;
    font-family: var(--f-mono) !important; font-size: 10px !important; font-weight: 700 !important;
}

/* ── Totals ── */
.zvs-checkout-style-modern .wc-block-components-totals-wrapper { padding: 0 24px 20px !important; }
.zvs-checkout-style-modern .wc-block-components-totals-item {
    font-family: var(--f-display) !important; font-size: 14px !important;
    padding: 8px 0 !important; border-bottom: none !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-item__label { color: var(--fg-mute) !important; }
.zvs-checkout-style-modern .wc-block-components-totals-item__value { color: var(--fg) !important; font-weight: 600 !important; }
.zvs-checkout-style-modern .wc-block-components-totals-discount .wc-block-components-totals-item__value { color: var(--success, #4ade80) !important; }
.zvs-checkout-style-modern .wc-block-components-totals-footer-item {
    border-top: 1px solid var(--line-color) !important;
    padding: 16px 0 4px !important; margin-top: 4px !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-family: var(--f-display) !important; font-size: 15px !important;
    font-weight: 700 !important; color: var(--fg) !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-family: var(--f-display) !important; font-size: 22px !important;
    font-weight: 800 !important; letter-spacing: -.03em !important; color: var(--lime) !important;
}

/* ── Coupon ── */
.zvs-checkout-style-modern .wc-block-components-totals-coupon {
    border-top: 1px solid var(--line-color) !important; padding-top: 12px !important;
    padding-bottom: 0 !important; margin-bottom: 0 !important;
}
/* WC wraps the coupon in this block with a large default padding-bottom (20px)
   that, stacked with the coupon's own spacing, left a ~33px hole before the
   Zwischensumme row. Tighten it to a normal gap. */
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-coupon {
    padding-bottom: 8px !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-coupon__button {
    font-family: var(--f-display) !important; font-size: 13px !important;
    color: var(--fg-mute) !important; background: transparent !important;
    border: none !important; padding: 8px 0 !important; cursor: pointer !important;
    transition: color .15s !important; width: 100% !important; text-align: left !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-coupon__button:hover { color: var(--fg) !important; }
.zvs-checkout-style-modern .wc-block-components-totals-coupon__form { display: flex !important; gap: 8px !important; margin-top: 8px !important; }
.zvs-checkout-style-modern .wc-block-components-totals-coupon__form input {
    flex: 1 !important; background: var(--bg-3) !important;
    border: 1px solid var(--line-color-2) !important; border-radius: var(--r-btn) !important;
    color: var(--fg) !important; font-family: var(--f-mono) !important;
    font-size: 12px !important; letter-spacing: .04em !important;
    height: 42px !important; padding: 0 12px !important; outline: none !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-coupon__form input:focus { border-color: var(--lime) !important; }
.zvs-checkout-style-modern .wc-block-components-totals-coupon__form .wc-block-components-button {
    background: var(--bg-3) !important; border: 1px solid var(--line-color-2) !important;
    border-radius: var(--r-btn) !important; color: var(--fg) !important;
    font-family: var(--f-display) !important; font-size: 13px !important; font-weight: 600 !important;
    height: 42px !important; padding: 0 16px !important; cursor: pointer !important;
    transition: background .15s, border-color .15s !important; width: auto !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-coupon__form .wc-block-components-button:hover {
    background: var(--lime) !important; color: var(--lime-ink) !important; border-color: transparent !important;
}

/* ═══ 5 · MY ACCOUNT ═══════════════════════════════════ */

.zvs-account-style-modern .woocommerce-MyAccount-navigation {
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card); padding: 16px;
}
.zvs-account-style-modern .woocommerce-MyAccount-navigation ul {
  list-style: none; padding: 6px !important; margin: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.zvs-account-style-modern .woocommerce-MyAccount-navigation ul li a {
  display: block; padding: 10px 14px; border-radius: var(--r-btn);
  color: var(--fg-mute); font-family: var(--f-body); font-size: 14px; font-weight: 500;
  text-decoration: none; transition: all .15s;
}
.zvs-account-style-modern .woocommerce-MyAccount-navigation ul li a:hover { background: var(--bg-3); color: var(--fg); }
.zvs-account-style-modern .woocommerce-MyAccount-navigation ul li.is-active a { background: var(--zvs-btn-bg, var(--lime)); color: var(--zvs-btn-color, var(--lime-ink)); }
/* Logout — red tint */
.zvs-account-style-modern .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 6px; }
.zvs-account-style-modern .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--danger, #ff6b6b) !important;
  border: 1px solid color-mix(in srgb, var(--danger, #EF4444) 25%, transparent) !important;
  background: color-mix(in srgb, var(--danger, #EF4444) 7%, transparent) !important;
}
.zvs-account-style-modern .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
  background: color-mix(in srgb, var(--danger, #EF4444) 18%, transparent) !important;
  border-color: color-mix(in srgb, var(--danger, #EF4444) 50%, transparent) !important;
  color: var(--paper, #fff) !important;
}

.zvs-account-style-modern .woocommerce-MyAccount-content { font-size: 15px; line-height: 1.55; }
/* Clamp h2/h3 to sensible sizes — theme's global h2 is too large */
.zvs-account-style-modern .woocommerce-MyAccount-content h2 {
  font-family: var(--f-display); font-weight: 700; letter-spacing: -.02em;
  font-size: 22px !important;
}
.zvs-account-style-modern .woocommerce-MyAccount-content h3 {
  font-family: var(--f-display); font-weight: 700; letter-spacing: -.02em;
  font-size: 17px !important;
}
/* Address block heading */
.zvs-account-style-modern .woocommerce-Address-title h2,
.zvs-account-style-modern .woocommerce-column__title {
  font-family: var(--f-display) !important; font-weight: 700 !important;
  font-size: 17px !important; letter-spacing: -.01em !important;
}

.zvs-account-style-modern .woocommerce-orders-table {
  border: 1px solid var(--line-color); border-radius: var(--r-card); overflow: hidden;
  border-collapse: separate; border-spacing: 0; width: 100%;
}
.zvs-account-style-modern .woocommerce-orders-table th {
  background: var(--bg-2); font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute); padding: 14px 22px; border: none;
}
.zvs-account-style-modern .woocommerce-orders-table td { padding: 14px 22px; border-bottom: 1px solid var(--line-color); }
.zvs-account-style-modern .woocommerce-orders-table .button {
  padding: 8px 16px; border-radius: var(--r-btn); background: transparent;
  border: 1px solid var(--line-color-2); color: var(--fg); font-size: 13px; font-weight: 500;
  text-decoration: none; transition: all .15s;
}
.zvs-account-style-modern .woocommerce-orders-table .button:hover { background: var(--lime); color: var(--lime-ink); border-color: transparent; }

.zvs-account-style-modern .woocommerce-Addresses .woocommerce-Address {
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card); padding: 24px 28px;
}
.zvs-account-style-modern .woocommerce-Addresses .woocommerce-Address address {
  font-style: normal !important; color: var(--fg-mute) !important;
  font-size: 14px !important; line-height: 1.6 !important; margin-top: 8px !important;
}
.zvs-account-style-modern .woocommerce-Addresses .woocommerce-Address header h3 { font-family: var(--f-display); font-weight: 700; font-size: 16px; margin-bottom: 12px; }

/* ── Kontodetails / Edit Account Form ──────────────────── */
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row label,
.zvs-active .woocommerce-EditAccountForm .form-row label {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); display: block; margin-bottom: 8px;
}
/* Inputs — normal subtle border, NOT lime */
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row input,
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row input[type="text"],
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row input[type="email"],
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row input[type="password"] {
  background: var(--bg-3) !important; border: 1px solid var(--line-color-2) !important;
  border-radius: var(--r-sm) !important; color: var(--fg) !important;
  padding: 11px 14px !important; font-family: var(--f-body) !important; font-size: 14px !important;
  width: 100% !important; transition: border-color .15s !important; display: block !important;
}
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row input:focus {
  border-color: var(--zvs-accent, var(--lime)) !important; outline: none !important;
}
.zvs-account-style-modern .woocommerce-EditAccountForm .form-row { margin-bottom: 16px !important; }
/* Fieldset (Passwort ändern) — lime border, clean legend */
.zvs-account-style-modern .woocommerce-EditAccountForm fieldset {
  border: 1px solid var(--zvs-accent, var(--lime)) !important;
  border-radius: var(--r-card) !important; padding: 20px 20px 8px !important;
  margin: 24px 0 16px !important;
}
.zvs-account-style-modern .woocommerce-EditAccountForm fieldset legend {
  font-family: var(--f-display) !important; font-weight: 700 !important;
  font-size: 14px !important; color: var(--fg) !important;
  padding: 0 8px !important; letter-spacing: -.01em !important;
}
/* Display name hint — smaller, muted */
.zvs-account-style-modern .woocommerce-EditAccountForm em,
.zvs-account-style-modern .woocommerce-EditAccountForm .description,
.zvs-active .woocommerce-EditAccountForm em {
  font-size: 12px !important; font-style: normal !important;
  color: var(--fg-mute) !important; opacity: .65 !important; line-height: 1.5 !important;
  display: block !important; margin-top: 5px !important;
}
/* Password eye toggle — light grey via filter on SVG ::before */
.zvs-active .show-password-input::before {
  filter: brightness(0) invert(1) opacity(0.35) !important;
}
.zvs-active .show-password-input:hover::before {
  filter: brightness(0) invert(1) opacity(0.7) !important;
}
/* Save button — more top margin */
.zvs-account-style-modern .woocommerce-EditAccountForm [type="submit"],
.zvs-account-style-modern .woocommerce-EditAccountForm .woocommerce-Button {
  background: var(--zvs-btn-bg, var(--lime)) !important;
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border: none !important; border-radius: var(--r-btn) !important;
  padding: 12px 28px !important; font-family: var(--f-body) !important;
  font-size: 14px !important; font-weight: 500 !important; cursor: pointer !important;
  transition: transform .15s, box-shadow .2s !important;
  margin-top: 24px !important;
}
.zvs-account-style-modern .woocommerce-EditAccountForm [type="submit"]:hover,
.zvs-account-style-modern .woocommerce-EditAccountForm .woocommerce-Button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px -8px color-mix(in oklch, var(--lime) 60%, transparent) !important;
}
/* Password strength meter */
.zvs-account-style-modern .woocommerce-password-strength { font-size: 12px; margin-top: 6px; border-radius: var(--r-sm); padding: 4px 10px; }
.zvs-account-style-modern .woocommerce-password-hint { font-size: 12px; color: var(--fg-mute); margin-top: 4px; }

/* ── Address page — fix "hinzufügen" link alignment ──── */
.zvs-account-style-modern .woocommerce-Address-title {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}
.zvs-account-style-modern .woocommerce-Address-title h2 {
  margin: 0 !important;
}
.zvs-account-style-modern .woocommerce-Address-title a.edit {
  float: none !important;
  white-space: nowrap !important;
  font-size: 12px !important; color: var(--fg-mute) !important;
  text-decoration: none !important; line-height: 1.4 !important;
  padding: 5px 12px !important; border: 1px solid var(--line-color-2) !important;
  border-radius: 6px !important; transition: all .15s !important;
}
.zvs-account-style-modern .woocommerce-Address-title a.edit:hover {
  color: var(--fg) !important; border-color: var(--fg-mute) !important;
}

/* Login / Register */
.zvs-active .woocommerce-form-login,
.zvs-active .woocommerce-form-register {
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card); padding: 40px;
}
.zvs-active .woocommerce-form-login label,
.zvs-active .woocommerce-form-register label {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute);
  display: block; margin-bottom: 8px;
}
.zvs-active .woocommerce-form-login input[type="text"],
.zvs-active .woocommerce-form-login input[type="password"],
.zvs-active .woocommerce-form-login input[type="email"],
.zvs-active .woocommerce-form-register input[type="text"],
.zvs-active .woocommerce-form-register input[type="password"],
.zvs-active .woocommerce-form-register input[type="email"] {
  background: var(--bg-3); border: 1px solid var(--line-color-2); border-radius: var(--r-sm);
  color: var(--fg); padding: 14px 16px; font-family: var(--f-body); font-size: 14px; width: 100%;
  transition: border-color .15s;
}
.zvs-active .woocommerce-form-login input:focus,
.zvs-active .woocommerce-form-register input:focus { border-color: var(--lime); outline: none; }
.zvs-active .woocommerce-form-login .woocommerce-button,
.zvs-active .woocommerce-form-register .woocommerce-button {
  display: inline-flex; align-items: center; padding: 14px 22px; border-radius: var(--r-btn);
  background: var(--lime); color: var(--lime-ink); font-family: var(--f-body); font-size: 14px; font-weight: 500;
  border: none; cursor: pointer;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6);
  transition: transform .15s var(--ease-out), box-shadow .25s;
}
.zvs-active .woocommerce-form-login .woocommerce-button:hover,
.zvs-active .woocommerce-form-register .woocommerce-button:hover { transform: translateY(-1px); }


/* ═══ 6 · GLOBAL WC OVERRIDES ═══════════════════════════ */

.zvs-active .woocommerce .button,
.zvs-active .woocommerce button.button,
.zvs-active .woocommerce a.button,
.zvs-active .woocommerce input.button { font-family: var(--f-body); font-weight: 500; }

/* Notices */
.zvs-active .woocommerce-message {
  background: var(--bg-2); border: 1px solid var(--zvs-accent, var(--lime));
  border-radius: var(--r-card); color: var(--fg); padding: 14px 20px;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; gap: 16px !important;
  white-space: normal !important; outline: none !important;
  width: 100% !important; box-sizing: border-box !important;
}
/* Hide WC's default cart icon */
.zvs-active .woocommerce-message::before { display: none !important; }
/* "Warenkorb anzeigen" button */
.zvs-active .woocommerce-message .button {
  background: var(--zvs-btn-bg, var(--lime)) !important; color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border: none !important; border-radius: var(--r-btn) !important;
  padding: 8px 18px !important; font-weight: 500 !important;
  text-decoration: none !important; white-space: nowrap !important;
  flex-shrink: 0 !important; margin-left: auto !important;
}
.zvs-active .woocommerce-message .button:hover {
  filter: brightness(1.1) !important; transform: translateY(-1px) !important;
}
.zvs-active .woocommerce-error { background: var(--bg-2); border: 1px solid var(--danger, #EF4444); border-radius: var(--r-card); color: var(--fg); padding: 16px 24px; }
.zvs-active .woocommerce-info {
  background: var(--bg-2); border: 1px solid var(--line-color);
  border-radius: var(--r-card); color: var(--fg); padding: 16px 24px;
  display: flex !important; align-items: center; justify-content: space-between; gap: 16px;
}
/* Hide WC default blue info icon */
.zvs-active .woocommerce-info::before { display: none !important; }
/* "Produkte durchsuchen" / wc-forward button inside info box */
.zvs-active .woocommerce-info .button,
.zvs-active .woocommerce-info a.button,
.zvs-active .woocommerce-info .wc-forward {
  background: transparent !important; color: var(--fg) !important;
  border: 1px solid var(--line-color-2) !important; border-radius: var(--r-btn) !important;
  padding: 9px 18px !important; font-family: var(--f-body) !important;
  font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important;
  white-space: nowrap !important; flex-shrink: 0 !important; transition: all .15s !important;
}
.zvs-active .woocommerce-info .button:hover,
.zvs-active .woocommerce-info a.button:hover,
.zvs-active .woocommerce-info .wc-forward:hover {
  background: var(--zvs-btn-bg, var(--lime)) !important;
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border-color: transparent !important;
}

/* Breadcrumb */
.zvs-active .woocommerce-breadcrumb {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--fg-mute); display: flex; gap: 10px; align-items: center; padding: 18px 0;
}
.zvs-active .woocommerce-breadcrumb a { color: var(--fg-mute); text-decoration: none; }
.zvs-active .woocommerce-breadcrumb a:hover { color: var(--fg); }

/* Result count + ordering */
.zvs-active .woocommerce-result-count { font-family: var(--f-mono); font-size: 12px; letter-spacing: .02em; color: var(--fg-mute); }
.zvs-active .woocommerce-ordering select {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-btn);
  color: var(--fg); padding: 8px 14px; font-family: var(--f-body); font-size: 14px;
}

/* Pagination */
.zvs-active .woocommerce-pagination ul.page-numbers { display: flex; gap: 4px; justify-content: center; padding: 0; list-style: none; }
.zvs-active .woocommerce-pagination ul.page-numbers li a,
.zvs-active .woocommerce-pagination ul.page-numbers li span {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: var(--r-btn);
  border: 1px solid var(--line-color); background: transparent;
  color: var(--fg-mute); font-family: var(--f-mono); font-size: 13px; font-weight: 500;
  text-decoration: none; transition: all .15s;
}
.zvs-active .woocommerce-pagination ul.page-numbers li a:hover { border-color: var(--line-color-2); background: var(--bg-2); color: var(--fg); }
.zvs-active .woocommerce-pagination ul.page-numbers li span.current { background: var(--fg); color: var(--bg); border-color: var(--fg); }


/* ═══ 7 · MINI-CART DRAWER ═════════════════════════════ */

/* Cart Drawer styles moved to zvs-cart-drawer.css */


/* ═══ 8 · TOAST ════════════════════════════════════════ */

.zvs-toast {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--bg-2); border: 1px solid var(--lime); border-radius: var(--r-btn);
  padding: 12px 20px; font-family: var(--f-mono); font-size: 12px; color: var(--lime);
  display: flex; align-items: center; gap: 8px;
  opacity: 0; transition: all .3s var(--ease-out); pointer-events: none; z-index: 200; white-space: nowrap;
}
.zvs-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }


/* ═══ 9 · ADDITIONAL OVERRIDES ════════════════════════ */

/* Antialiased text everywhere */
.zvs-active { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* WC Gallery deep overrides */
.zvs-active .woocommerce-product-gallery { opacity: 1 !important; }
.zvs-active .woocommerce-product-gallery__wrapper { margin: 0; }
.zvs-active .woocommerce-product-gallery .woocommerce-product-gallery__image a { display: block; }
.zvs-active .woocommerce-product-gallery .flex-viewport { border-radius: var(--r-card); overflow: hidden; }
.zvs-active .woocommerce-product-gallery .flex-direction-nav { display: none; }

/* Quantity +/− buttons (WC default doesn't have buttons — we style the input) */
.zvs-active .quantity .minus,
.zvs-active .quantity .plus {
  width: 44px; height: 50px; font-size: 18px; color: var(--fg-mute);
  background: transparent; border: none; cursor: pointer; transition: background .15s, color .15s;
  display: inline-flex; align-items: center; justify-content: center;
}
.zvs-active .quantity .minus:hover,
.zvs-active .quantity .plus:hover { background: var(--bg-2); color: var(--fg); }

/* Select2 deep styling (checkout country/state dropdowns) */
.zvs-active .select2-container--default .select2-selection--single {
  height: 50px; border: 1px solid var(--line-color-2); border-radius: var(--r-sm);
  background: var(--bg-2);
}
.zvs-active .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 50px; padding: 0 16px; color: var(--fg); font-family: var(--f-body); font-size: 14px;
}
.zvs-active .select2-container--default .select2-selection--single .select2-selection__arrow { top: 12px; right: 12px; }
.zvs-active .select2-dropdown {
  background: var(--bg-2); border: 1px solid var(--line-color-2); border-radius: var(--r-sm); margin-top: 4px;
}
.zvs-active .select2-container--default .select2-results__option {
  padding: 10px 16px; font-family: var(--f-body); font-size: 14px; color: var(--fg-mute);
}
.zvs-active .select2-container--default .select2-results__option--highlighted {
  background: var(--bg-3); color: var(--fg);
}
.zvs-active .select2-container--default .select2-results__option--selected {
  background: var(--lime); color: var(--lime-ink);
}

/* Empty cart page */
.zvs-active .cart-empty {
  text-align: center; padding: 80px 28px; max-width: 560px; margin: 0 auto;
}
.zvs-active .cart-empty.woocommerce-info {
  font-family: var(--f-display); font-size: 22px; font-weight: 600;
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-card);
}
.zvs-active .cart-empty.woocommerce-info::before { display: none; }
.zvs-active .return-to-shop .button {
  display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px; border-radius: var(--r-btn);
  background: var(--lime); color: var(--lime-ink); font-family: var(--f-body); font-size: 15px; font-weight: 500;
  text-decoration: none; margin-top: 20px;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 25%, transparent) inset, 0 6px 22px -10px rgb(8 72 255 / .6);
  transition: transform .15s var(--ease-out), box-shadow .25s;
}
.zvs-active .return-to-shop .button:hover { transform: translateY(-1px); }

/* Thank you / order received page */
.zvs-active .woocommerce-order-received .woocommerce-thankyou-order-received {
  font-family: var(--f-display); font-weight: 700; font-size: 28px; letter-spacing: -.03em;
  text-align: center; padding: 40px 0 20px;
}
.zvs-active .woocommerce-order-received .woocommerce-order-overview {
  list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0;
  border: 1px solid var(--line-color); border-radius: var(--r-card); overflow: hidden;
}
.zvs-active .woocommerce-order-received .woocommerce-order-overview li {
  flex: 1; min-width: 140px; padding: 20px 22px;
  border-right: 1px solid var(--line-color); background: var(--bg-2);
}
.zvs-active .woocommerce-order-received .woocommerce-order-overview li:last-child { border-right: none; }
.zvs-active .woocommerce-order-received .woocommerce-order-overview li strong {
  display: block; font-family: var(--f-display); font-weight: 700; font-size: 16px; margin-top: 4px;
}
.zvs-active .woocommerce-order-received .woocommerce-order-details { margin-top: 32px; }
.zvs-active .woocommerce-order-received .woocommerce-table--order-details {
  border: 1px solid var(--line-color); border-radius: var(--r-card); overflow: hidden;
  border-collapse: separate; border-spacing: 0; width: 100%;
}
.zvs-active .woocommerce-order-received .woocommerce-table--order-details th {
  background: var(--bg-2); font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute); padding: 14px 22px; border: none;
}
.zvs-active .woocommerce-order-received .woocommerce-table--order-details td {
  padding: 14px 22px; border-bottom: 1px solid var(--line-color);
}

/* My Account: grid layout (nav sidebar + content) */
.zvs-account-style-modern .woocommerce {
  display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: flex-start;
}
@media (max-width: 768px) {
  /* ── Account ── */
  .zvs-account-style-modern .woocommerce { grid-template-columns: 1fr; }

  /* ── Single Product: stack image above summary ── */
  .zvs-active div.product {
    /* minmax(0,1fr) prevents FlexSlider's fixed-px width from blowing out the grid track */
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
    padding: 12px 0 40px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* ALL direct children full width */
  .zvs-active div.product > * {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    box-sizing: border-box !important;
  }
  /* Image column — min-width:0 prevents FlexSlider from blowing out the grid track */
  .zvs-active div.product div.images {
    order: -1 !important;
    min-width: 0 !important;
    overflow: visible !important; /* must be visible so thumbnails below viewport aren't clipped */
  }
  .zvs-active div.product div.summary {
    min-width: 0 !important;
  }
  /* Force FlexSlider container to not exceed parent.
     NOTE: gallery__wrapper must NOT be width-constrained here —
     FlexSlider sets it to e.g. 1000% (n-slides × 200%) inline,
     and overriding that with 100% collapses all slides to offsetLeft:0. */
  .zvs-active div.product div.images .flex-viewport,
  .zvs-active div.product div.images .flexslider {
    width: 100% !important;
    max-width: 100% !important;
  }
  /* Cap gallery height on mobile */
  .zvs-active div.product div.images .flex-viewport {
    max-height: 75vw !important;
    overflow: hidden !important;
  }
  .zvs-active div.product div.images .flex-viewport img,
  .zvs-active div.product div.images .woocommerce-product-gallery__wrapper img {
    max-height: 75vw !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  /* Product title size */
  .zvs-active div.product .product_title,
  .zvs-subtitle { font-size: 28px !important; }

  /* Price size */
  .zvs-active div.product p.price .woocommerce-Price-amount,
  body.zvs-active div.product p.price .woocommerce-Price-amount {
    font-size: 32px !important;
  }

  /* Thumbnail strip: 4 cols on mobile */
  div.product div.images .flex-control-thumbs {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  /* Add to cart: qty flush left, button flush right — one row on mobile */
  .zvs-active div.product form.cart {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    margin: 20px 0 !important;
    padding: 0 !important;
  }
  .zvs-active div.product form.cart > .quantity {
    flex: 0 0 auto !important;
    margin: 0 12px 0 0 !important;
  }
  .zvs-active div.product form.cart > button.single_add_to_cart_button {
    flex: 1 1 0% !important;
    margin: 0 !important;
  }
  .zvs-active div.product .woocommerce-variation-add-to-cart {
    grid-template-columns: auto 1fr !important;
    flex-direction: row !important;
  }

  /* License picker: full width */
  .zvs-license-picker { gap: 8px !important; }

  /* Trust grid: 1 col */
  .zvs-trust-grid { grid-template-columns: 1fr !important; }

  /* Addon checkboxes: stack */
  .zvs-addon-row { flex-direction: column !important; align-items: flex-start !important; }

  /* Tabs: scroll horizontally */
  .zvs-active div.product .woocommerce-tabs ul.tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    padding-bottom: 4px !important;
  }
  .zvs-active div.product .woocommerce-tabs { grid-column: 1 !important; }

  /* Specs table: full width */
  .zvs-specs-dl { grid-template-columns: 1fr !important; }
  .zvs-specs-dl dt { border-bottom: none !important; padding-bottom: 2px !important; }

  /* FAQ list */
  .zvs-faq-list { max-width: 100% !important; }

  /* Preview strip: hidden on mobile */
  .zvs-preview-strip { display: none !important; }

  /* Related products: 2 cols */
  .zvs-active .related.products ul.products,
  .zvs-active .upsells.products ul.products,
  .zvs-active section.related ul.products,
  .zvs-active section.upsells ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  .zvs-active .related.products,
  .zvs-active .upsells.products,
  .zvs-active section.related,
  .zvs-active section.upsells {
    padding-top: 40px !important;
  }
  .zvs-active .related.products > h2,
  .zvs-active section.related > h2 { font-size: 22px !important; }

  /* Cart page: hide product thumb column, stack */
  .zvs-cart-style-modern table.cart th.product-thumbnail { display: none !important; }
  .zvs-cart-style-modern table.cart td.product-thumbnail { display: none !important; }
  .zvs-cart-style-modern .zvs-cart-item-wrap { flex-direction: column !important; gap: 12px !important; }

  /* Checkout: sidebar below form on mobile */
  .zvs-checkout-style-modern .wc-block-checkout__main { padding-right: 0 !important; }
  .zvs-checkout-style-modern .wc-block-checkout__sidebar {
    position: static !important;
    border-radius: var(--r-card) !important;
    margin-top: 24px !important;
  }
}

@media (max-width: 480px) {
  /* Product: even tighter padding */
  .zvs-active div.product { padding: 12px 16px 32px !important; }

  /* Thumbnail strip: 3 cols on small mobile */
  div.product div.images .flex-control-thumbs {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  /* Related: 1 col on tiny screens */
  .zvs-active .related.products ul.products,
  .zvs-active section.related ul.products {
    grid-template-columns: 1fr !important;
  }
}

/* Form field wrappers */
.zvs-active .form-row { margin-bottom: 16px; }
.zvs-active .form-row label .required { color: var(--lime); }
.zvs-active .form-row .woocommerce-input-wrapper { display: block; }

/* Links in WC */
.zvs-active .woocommerce a { transition: color .15s; }
.zvs-active .woocommerce a:hover { color: var(--lime); }

/* Remove WC default box styling */
.zvs-active .woocommerce form .form-row-first,
.zvs-active .woocommerce form .form-row-last { width: 48%; }
.zvs-active .woocommerce form .form-row-wide { width: 100%; }

/* Chip utility (reusable) */
.zvs-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 11px; font-family: var(--f-mono); font-size: 10.5px; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  background: var(--bg-2); border: 1px solid var(--line-color); border-radius: var(--r-chip); color: var(--fg-mute);
}
.zvs-chip .zvs-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 2px rgb(8 72 255 / .2); }

/* Trust grid utility */
.zvs-trust-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.zvs-trust-item { display: flex; align-items: flex-start; gap: 10px; }
.zvs-trust-icon {
  width: 30px; height: 30px; border-radius: 8px; flex-shrink: 0;
  background: var(--bg-2); border: 1px solid var(--line-color); display: grid; place-items: center;
}
.zvs-trust-label { font-size: 13px; font-weight: 600; line-height: 1.3; }
.zvs-trust-sub { font-family: var(--f-mono); font-size: 10.5px; color: var(--fg-mute); margin-top: 2px; }

/* Loading skeleton for AJAX */
.zvs-loading { opacity: .5; pointer-events: none; }
@keyframes zvs-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
.zvs-skeleton { animation: zvs-pulse 1.5s ease-in-out infinite; background: var(--bg-3); border-radius: var(--r-sm); }


/* ═══ 10 · ZERONIQ PRODUCT FEATURES ═════════════════════ */

/* ── Rating Widget ───────────────────────────────────── */
.zvs-rating-widget {
  display: flex !important; flex-direction: column !important;
  gap: 10px !important; margin: 0 0 20px !important;
  align-items: flex-start !important;
}

/* Summary button */
.zvs-rating-summary {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 8px 14px !important;
  background: var(--bg-2) !important;
  border: 1px solid var(--line-color) !important;
  border-radius: var(--r-btn) !important;
  text-decoration: none !important;
  transition: border-color .15s, background .15s !important;
  cursor: pointer !important;
}
.zvs-rating-summary:hover {
  border-color: var(--lime) !important;
  background: color-mix(in srgb, var(--lime, #0848FF) 5%, transparent) !important;
}
.zvs-rating-summary__stars {
  display: inline-flex !important; gap: 2px !important; color: var(--lime) !important;
}
.zvs-rating-summary__num {
  font-family: var(--f-display) !important; font-weight: 700 !important;
  font-size: 15px !important; color: var(--fg) !important;
}
.zvs-rating-summary__count {
  font-family: var(--f-mono) !important; font-size: 11px !important;
  color: var(--fg-mute) !important; letter-spacing: .04em !important;
}

/* Breakdown bars */
.zvs-rating-breakdown {
  display: flex !important; flex-direction: column !important;
  gap: 5px !important; width: 100% !important; max-width: 260px !important;
}
.zvs-rating-bar-row {
  display: grid !important;
  grid-template-columns: 14px 12px 1fr 32px !important;
  align-items: center !important; gap: 6px !important;
}
.zvs-rating-bar-label {
  font-family: var(--f-mono) !important; font-size: 11px !important;
  font-weight: 600 !important; color: var(--fg-mute) !important;
  text-align: right !important;
}
.zvs-rating-bar-star { color: var(--lime) !important; flex-shrink: 0 !important; }
.zvs-rating-bar-wrap {
  height: 4px !important; background: var(--bg-3) !important;
  border-radius: 99px !important; overflow: hidden !important;
}
.zvs-rating-bar-fill {
  height: 100% !important; background: var(--lime) !important;
  border-radius: 99px !important; transition: width .4s ease !important;
  min-width: 2px !important;
}
.zvs-rating-bar-pct {
  font-family: var(--f-mono) !important; font-size: 10px !important;
  color: var(--fg-mute) !important; text-align: right !important;
}

/* Legacy — keep for backwards compat */
.zvs-rating-row {
  display: flex !important; align-items: center !important; gap: 8px !important;
  margin: 0 0 16px !important; flex-wrap: wrap !important;
}
.zvs-stars { display: inline-flex !important; gap: 2px !important; color: var(--lime) !important; }
.zvs-rating-num { font-family: var(--f-display) !important; font-weight: 600 !important; font-size: 14px !important; }
.zvs-rating-sep { color: var(--fg-mute-2) !important; font-size: 12px !important; }
.zvs-rating-count { font-family: var(--f-mono) !important; font-size: 12px !important; color: var(--fg-mute) !important; }

/* ── Eyebrow ─────────────────────────────────────────── */
.zvs-eyebrow {
  font-family: var(--f-mono) !important; font-size: 11px !important; font-weight: 500 !important;
  letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--fg-mute) !important;
  margin-bottom: 8px !important;
}

/* ── Subtitle ────────────────────────────────────────── */
.zvs-subtitle {
  font-family: var(--f-display) !important;
  font-weight: 700 !important;
  font-size: 44px !important;
  font-style: normal !important;
  color: var(--fg) !important;
  letter-spacing: -.02em !important;
  line-height: 1.1 !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
}
/* *text* segments — grey, weight 400, regular */
.zvs-subtitle .zvs-subtitle-muted {
  color: var(--fg-mute) !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

/* ── Hide WC variation dropdown when license picker is present ── */
.zvs-active div.product .variations { display: none !important; }
.zvs-active div.product .single_variation_wrap .woocommerce-variation { display: none !important; }
/* But keep the hidden inputs for WC variation system — grid layout matches our form layout */
.zvs-active div.product .single_variation_wrap .woocommerce-variation-add-to-cart { display: grid !important; }

/* ── Breadcrumb toggle (controlled by body class) ────── */
body.zvs-hide-breadcrumbs .zv-breadcrumbs,
body.zvs-hide-breadcrumbs .woocommerce-breadcrumb { display: none !important; }

/* ── Page header toggle for shop pages ───────────────── */
body.zvs-hide-page-header .zv-page-header,
body.zvs-hide-page-header .zv-page-header + * > .zv-breadcrumbs { display: none !important; }

/* ── Chip bar ────────────────────────────────────────── */
.zvs-chip-bar { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; margin: 0 0 24px !important; }
.zvs-chip {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 5px 11px !important; font-family: var(--f-mono) !important; font-size: 10.5px !important;
  font-weight: 500 !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  background: var(--bg-2) !important; border: 1px solid var(--line-color) !important;
  border-radius: var(--r-chip) !important; color: var(--fg-mute) !important;
}
.zvs-chip--stock { color: var(--lime) !important; border-color: rgb(8 72 255 / .4) !important; }
.zvs-chip--lime { background: var(--lime) !important; color: var(--lime-ink) !important; border-color: transparent !important; padding: 2px 7px !important; font-size: 9px !important; }
.zvs-dot { width: 6px !important; height: 6px !important; border-radius: 50% !important; background: var(--lime) !important; box-shadow: 0 0 0 2px rgb(8 72 255 / .2) !important; }

/* ── License Picker ──────────────────────────────────── */
.zvs-licenses { margin: 16px 0 !important; }
.zvs-licenses__head { margin-bottom: 10px !important; }
.zvs-licenses__grid { display: grid !important; gap: 8px !important; }
.zvs-license {
  display: grid !important; grid-template-columns: 20px 1fr auto !important; align-items: center !important;
  gap: 14px !important; padding: 14px 16px !important; background: transparent !important;
  border: 1px solid var(--line-color-2) !important; border-radius: var(--r-card) !important;
  text-align: left !important; transition: all .15s !important; cursor: pointer !important; width: 100% !important;
  color: var(--fg) !important; font-family: var(--f-body) !important;
}
.zvs-license:hover { border-color: var(--fg-mute-2) !important; }
.zvs-license--active { background: var(--bg-2) !important; border-color: var(--lime) !important; border-width: 1.5px !important; }
.zvs-license__radio {
  width: 18px !important; height: 18px !important; border-radius: 999px !important;
  border: 1.5px solid var(--line-color-2) !important; background: transparent !important;
  transition: all .2s !important; flex-shrink: 0 !important;
}
.zvs-license--active .zvs-license__radio { border: 5px solid var(--lime) !important; background: var(--ink, #0A0B0F) !important; }
.zvs-license__name { font-family: var(--f-display) !important; font-weight: 600 !important; font-size: 15px !important; display: flex !important; align-items: center !important; gap: 8px !important; }
.zvs-license__desc { font-family: var(--f-mono) !important; font-size: 11px !important; color: var(--fg-mute) !important; margin-top: 2px !important; }
.zvs-license__price { font-family: var(--f-display) !important; font-weight: 600 !important; font-size: 16px !important; white-space: nowrap !important; }

/* ── Add-ons ─────────────────────────────────────────── */
.zvs-addons { margin: 16px 0 !important; }
.zvs-addons__grid { display: grid !important; gap: 6px !important; }
.zvs-addon {
  display: grid !important; grid-template-columns: 20px 1fr auto !important; align-items: center !important;
  gap: 14px !important; padding: 12px 16px !important; border: 1px solid var(--line-color) !important;
  border-radius: var(--r-card) !important; background: transparent !important; cursor: pointer !important;
  width: 100% !important; text-align: left !important; transition: background .15s !important;
  color: var(--fg) !important; font-family: var(--f-body) !important;
}
.zvs-addon.zvs-addon--active { background: var(--bg-2) !important; }
.zvs-addon__check {
  width: 18px !important; height: 18px !important; border-radius: 5px !important;
  border: 1.5px solid var(--line-color-2) !important; background: transparent !important;
  transition: all .15s !important; display: grid !important; place-items: center !important; flex-shrink: 0 !important;
}
.zvs-addon.zvs-addon--active .zvs-addon__check { background: var(--lime) !important; border-color: var(--lime) !important; }
.zvs-addon__label { font-size: 14px !important; font-weight: 500 !important; }
.zvs-addon__price { font-family: var(--f-mono) !important; font-size: 12px !important; color: var(--fg-mute) !important; white-space: nowrap !important; }

/* ── Trust Grid ──────────────────────────────────────── */
.zvs-trust-grid { display: grid !important; grid-template-columns: repeat(2,1fr) !important; gap: 12px !important; margin-top: 20px !important; padding-top: 20px !important; border-top: 1px solid var(--line-color) !important; }
.zvs-trust-item { display: flex !important; align-items: flex-start !important; gap: 10px !important; }
.zvs-trust-icon { width: 30px !important; height: 30px !important; border-radius: 8px !important; flex-shrink: 0 !important; background: var(--bg-2) !important; border: 1px solid var(--line-color) !important; display: grid !important; place-items: center !important; color: var(--lime) !important; }
.zvs-trust-label { font-size: 13px !important; font-weight: 600 !important; line-height: 1.3 !important; }
.zvs-trust-sub { font-family: var(--f-mono) !important; font-size: 10.5px !important; color: var(--fg-mute) !important; margin-top: 2px !important; }

/* ── Live Preview Strip ──────────────────────────────── */
.zvs-preview-strip { border-top: 1px solid var(--line-color) !important; border-bottom: 1px solid var(--line-color) !important; background: var(--bg-2) !important; grid-column: 1 / -1 !important; margin: 32px -28px 0 !important; padding: 0 !important; }
.zvs-preview-strip__inner { max-width: 1320px !important; margin: 0 auto !important; padding: 40px 28px !important; }
.zvs-preview-strip__top { display: grid !important; grid-template-columns: auto 1fr auto !important; gap: 32px !important; align-items: center !important; margin-bottom: 28px !important; }
.zvs-preview-strip__title { font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 28px !important; letter-spacing: -.03em !important; }
.zvs-preview-browser { border: 1px solid var(--line-color-2) !important; border-radius: var(--r-card) !important; overflow: hidden !important; background: var(--bg) !important; }
.zvs-preview-browser__bar { display: flex !important; align-items: center !important; gap: 8px !important; padding: 10px 14px !important; border-bottom: 1px solid var(--line-color) !important; background: var(--bg-2) !important; }
.zvs-browser-dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; }
.zvs-preview-browser__url { font-family: var(--f-mono) !important; font-size: 12px !important; color: var(--fg-mute) !important; margin-left: 14px !important; }
.zvs-preview-browser__content { aspect-ratio: 21/9 !important; background: var(--ink) !important; }

/* ── Buttons ─────────────────────────────────────────── */
.zvs-btn { display: inline-flex !important; align-items: center !important; gap: 10px !important; padding: 13px 22px !important; font-family: var(--f-body) !important; font-weight: 500 !important; font-size: 14px !important; border-radius: var(--r-btn) !important; border: 1px solid transparent !important; cursor: pointer !important; text-decoration: none !important; transition: all .2s var(--ease-out) !important; white-space: nowrap !important; }
.zvs-btn--ghost { background: transparent !important; color: var(--fg) !important; border-color: var(--line-color-2) !important; }
.zvs-btn--ghost:hover { background: var(--bg-2) !important; }
.zvs-btn--dark { background: var(--ink) !important; color: var(--paper) !important; }
.zvs-btn--dark:hover { transform: translateY(-1px) !important; }
.zvs-mono { font-family: var(--f-mono) !important; font-size: 12px !important; letter-spacing: .02em !important; }

/* ── Tab: Overview ───────────────────────────────────── */
.zvs-tab-overview { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 56px !important; }
.zvs-tab-overview__text h3 { font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 36px !important; letter-spacing: -.03em !important; line-height: 1.05 !important; margin-bottom: 20px !important; }
.zvs-tab-overview__text p { font-size: 16px !important; line-height: 1.6 !important; color: var(--fg-mute) !important; }
.zvs-stat-row { display: grid !important; grid-template-columns: 120px 1fr !important; align-items: baseline !important; gap: 24px !important; padding: 20px 0 !important; border-bottom: 1px solid var(--line-color) !important; }
.zvs-stat-row:first-child { border-top: 1px solid var(--line-color) !important; }
.zvs-stat-n { font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 56px !important; letter-spacing: -.04em !important; line-height: 1 !important; }
.zvs-stat-label { font-size: 15px !important; color: var(--fg-mute) !important; }

/* ── Tab: Specs ──────────────────────────────────────── */
.zvs-specs-dl { display: grid !important; grid-template-columns: 200px 1fr !important; max-width: 920px !important; }
.zvs-specs-dt { font-family: var(--f-mono) !important; font-size: 12px !important; color: var(--fg-mute) !important; padding: 14px 0 !important; border-top: 1px solid var(--line-color) !important; }
.zvs-specs-dd { font-size: 14px !important; padding: 14px 0 !important; border-top: 1px solid var(--line-color) !important; margin: 0 !important; }

/* ── Tab: Changelog ──────────────────────────────────── */
.zvs-changelog-row { display: grid !important; grid-template-columns: 160px 1fr !important; gap: 32px !important; padding: 24px 0 !important; border-top: 1px solid var(--line-color) !important; }
.zvs-changelog-row:last-child { border-bottom: 1px solid var(--line-color) !important; }
.zvs-changelog-v { font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 22px !important; letter-spacing: -.02em !important; }
.zvs-changelog-date { font-family: var(--f-mono) !important; font-size: 11px !important; color: var(--fg-mute) !important; margin-top: 4px !important; }
.zvs-changelog-list { list-style: none !important; display: grid !important; gap: 8px !important; padding: 6px 0 0 !important; margin: 0 !important; }
.zvs-changelog-li { display: grid !important; grid-template-columns: 14px 1fr !important; gap: 12px !important; align-items: baseline !important; font-size: 15px !important; }
.zvs-changelog-dot { width: 4px !important; height: 4px !important; border-radius: 999px !important; margin-top: 8px !important; }

/* ── Tab: FAQ ────────────────────────────────────────── */
.zvs-faq-list { max-width: 820px !important; }
.zvs-faq-item { border-top: 1px solid var(--line-color) !important; }
.zvs-faq-item:last-child { border-bottom: 1px solid var(--line-color) !important; }
.zvs-faq-q {
  width: 100% !important; text-align: left !important; display: grid !important;
  grid-template-columns: 1fr auto !important; align-items: center !important; gap: 16px !important;
  padding: 20px 0 !important; font-family: var(--f-display) !important; font-size: 18px !important;
  font-weight: 600 !important; letter-spacing: -.015em !important; cursor: pointer !important;
  background: transparent !important; border: none !important; color: var(--fg) !important;
}
.zvs-faq-toggle {
  width: 28px !important; height: 28px !important; border-radius: 999px !important;
  border: 1px solid var(--line-color-2) !important; display: grid !important; place-items: center !important;
  transition: transform .25s, background .25s !important; flex-shrink: 0 !important;
}
.zvs-faq-item.zvs-faq--open .zvs-faq-toggle { transform: rotate(45deg) !important; background: var(--lime) !important; color: var(--lime-ink) !important; }
.zvs-faq-a { max-height: 0 !important; overflow: hidden !important; transition: max-height .35s var(--ease-out), padding .35s !important; }
.zvs-faq-item.zvs-faq--open .zvs-faq-a { max-height: 200px !important; padding-bottom: 22px !important; }
.zvs-faq-a p { font-size: 15px !important; line-height: 1.6 !important; color: var(--fg-mute) !important; margin: 0 !important; }


/* ── Standalone Reviews Section ──────────────────── */
.zvs-reviews-section {
  grid-column: 1 / -1 !important;
  border-top: 1px solid var(--line-color) !important;
  padding: 56px 0 !important; margin-top: 0 !important;
}
.zvs-reviews-section__inner { max-width: 1320px; margin: 0 auto; padding: 0 28px; }

/* Grid: 320px aside + fluid reviews list — matches reference */
.zvs-reviews-grid {
  display: grid !important;
  grid-template-columns: 320px 1fr !important;
  gap: 56px !important;
  margin-bottom: 0 !important;
  align-items: start !important;
}
.zvs-reviews-right-col { display: flex; flex-direction: column; }

/* Score panel */
.zvs-reviews-score-panel { position: sticky; top: 100px; }
.zvs-reviews-score-num { font-family: var(--f-display); font-weight: 700; font-size: 64px; letter-spacing: -.04em; line-height: 1; margin-bottom: 8px; }
.zvs-bar-row {
  display: grid; grid-template-columns: 22px 1fr 36px; gap: 8px; align-items: center;
}
/* Clickable bar button variant */
.zvs-bar-row--btn {
  background: none; border: none; padding: 4px 6px; margin: 0 -6px;
  border-radius: var(--r-sm, 8px); cursor: pointer;
  transition: background .15s;
  text-align: left; width: calc(100% + 12px);
  color: var(--fg); /* inherit theme color — browser default is black which is invisible on dark bg */
}
.zvs-bar-row--btn:hover { background: color-mix(in srgb, var(--paper, #F7F5F0) 7%, transparent); color: var(--fg); }
.zvs-bar-row--btn.zvs--active {
  background: color-mix(in srgb, var(--lime, #0848FF) 8%, transparent);
}
.zvs-bar-row--btn.zvs--active .zvs-bar-fill { background: var(--lime); }
.zvs-bar-row--btn.zvs--active span { color: var(--lime) !important; }
/* On mobile: hide the separate filter buttons row (bars do the filtering) */
@media (max-width: 860px) {
  .zvs-reviews-filter { display: none !important; }
}
.zvs-bar-track { height: 4px; border-radius: 999px; background: var(--line-color); overflow: hidden; }
.zvs-bar-fill { height: 100%; background: var(--lime); border-radius: 999px; }
.zvs-write-review-btn {
  display: inline-flex; align-items: center; margin-top: 24px;
  padding: 11px 20px; border-radius: var(--r-btn);
  background: var(--zvs-btn-bg, var(--lime)); color: var(--zvs-btn-color, var(--lime-ink)) !important; text-decoration: none !important;
  border: none; font-size: 14px; font-weight: 500; text-decoration: none; cursor: pointer;
  transition: background .15s, transform .15s, box-shadow .2s;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--paper, #F7F5F0) 20%, transparent) inset;
}
.zv-post-content .zvs-write-review-btn,
.zv-post-body .zvs-write-review-btn {
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
}
.zv-post-content .zvs-write-review-btn--ghost,
.zv-post-body .zvs-write-review-btn--ghost {
  color: var(--fg) !important;
}
.zvs-write-review-btn:hover {
  background: var(--zvs-btn-hover-bg, color-mix(in oklch, var(--lime) 85%, black));
  color: var(--zvs-btn-hover-c, var(--lime-ink)) !important;
  transform: translateY(-1px);
}

/* Review cards — matches .review-card in reference */
.zvs-reviews-list { display: grid; gap: 0; }
.zvs-review-card {
  display: grid !important;
  grid-template-columns: 44px 1fr !important;
  gap: 18px !important;
  padding: 20px 0 !important;
  border-top: 1px solid var(--line-color) !important;
}
.zvs-review-card.zvs-hidden { display: none !important; }
.zvs-review-card:last-child { border-bottom: 1px solid var(--line-color) !important; }
.zvs-review-avatar {
  width: 44px !important; height: 44px !important; border-radius: 999px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-family: var(--f-display) !important; font-weight: 600 !important; font-size: 15px !important;
  line-height: 1 !important; text-align: center !important;
  color: color-mix(in srgb, var(--paper, #F7F5F0) 70%, transparent) !important; flex-shrink: 0 !important;
}
.zvs-review-body { min-width: 0; }
.zvs-review-meta-row { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; flex-wrap: wrap; }
.zvs-review-name { font-family: var(--f-display); font-weight: 600; font-size: 15px; color: var(--fg); }
.zvs-review-title { font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; color: var(--fg-mute); margin-bottom: 8px; text-transform: uppercase; }
.zvs-review-text { font-size: 15px; line-height: 1.6; color: var(--fg-mute); }
.zvs-review-text p { margin: 0; }
/* Star color in review cards via dashboard var */
.zvs-review-card [style*="var(--lime)"] { color: var(--zvs-star, var(--lime)) !important; }

/* Review form — hidden until triggered via "Write a review" button */
.zvs-review-form-wrap {
  overflow: hidden !important;
  max-height: 0 !important;
  opacity: 0 !important;
  transition: max-height .45s cubic-bezier(.4,0,.2,1), opacity .3s ease !important;
}
.zvs-review-form-wrap.zvs--open {
  max-height: 900px !important;
  opacity: 1 !important;
}
.zvs-review-form-inner { padding-top: 40px; }
/* Login prompt — shown to logged-out users */
.zvs-review-login-prompt { padding-top: 40px; border-top: 1px solid var(--line-color); margin-top: 8px; }
/* Ghost variant — secondary action (Create account) */
.zvs-write-review-btn--ghost {
  background: var(--bg-2) !important;
  color: var(--fg) !important;
  box-shadow: none !important;
  border: 1px solid var(--line-color-2) !important;
}
.zvs-write-review-btn--ghost:hover,
.zv-post-content .zvs-write-review-btn--ghost:hover,
.zv-post-body .zvs-write-review-btn--ghost:hover {
  background: var(--bg-3) !important;
  color: var(--fg) !important;
  transform: translateY(-1px);
}
.zvs-form-title { font-family: var(--f-display); font-weight: 700; font-size: 22px; letter-spacing: -.025em; margin-bottom: 24px; }
.zvs-review-form-wrap .comment-respond { max-width: 640px; }
/* Use flex + order to visually reorder: stars → name → email → textarea
   comment_form() always outputs comment_field (textarea) first in the DOM */
.zvs-review-form-wrap form.comment-form {
  display: flex !important; flex-direction: column !important;
}
.zvs-review-form-wrap .comment-form-rating  { order: 1 !important; }
.zvs-review-form-wrap .comment-form-author  { order: 2 !important; }
.zvs-review-form-wrap .comment-form-email   { order: 3 !important; }
.zvs-review-form-wrap .comment-form-comment { order: 4 !important; }
.zvs-review-form-wrap .form-submit          { order: 5 !important; }
.zvs-review-form-wrap p { margin-bottom: 16px; }
.zvs-review-form-wrap label { display: block; font-family: var(--f-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin-bottom: 8px; }
.zvs-review-form-wrap input[type="text"],
.zvs-review-form-wrap input[type="email"],
.zvs-review-form-wrap textarea {
  background: var(--bg-2) !important; border: 1px solid var(--line-color-2) !important; border-radius: var(--r-sm) !important;
  color: var(--fg) !important; padding: 12px 16px !important; font-family: var(--f-body) !important; font-size: 14px !important; width: 100% !important;
  transition: border-color .15s !important; display: block !important;
}
/* Suppress WC default .stars block inside our form — we use .zvs-star-picker */
.zvs-review-form-wrap p.stars { display: none !important; }
.zvs-review-form-wrap input:focus, .zvs-review-form-wrap textarea:focus { border-color: var(--zvs-accent, var(--lime)) !important; outline: none !important; }
/* Star picker */
.zvs-star-field label { margin-bottom: 10px; }
.zvs-star-picker { display: flex; gap: 4px; margin-bottom: 4px; }
.zvs-star-pick {
  font-size: 24px; cursor: pointer; color: var(--line-color-2); line-height: 1;
  transition: color .1s, transform .1s; user-select: none;
}
.zvs-star-pick:hover,
.zvs-star-pick.zvs--active { color: var(--zvs-star, var(--lime)); }
.zvs-star-pick:hover { transform: scale(1.15); }
/* Submit — use dashboard vars */
.zvs-review-form-wrap .zvs-submit-btn,
.zvs-review-form-wrap input[type="submit"],
.zvs-review-form-wrap .form-submit input {
  background: var(--zvs-btn-bg, var(--lime)) !important;
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border: none !important; padding: 13px 28px !important; border-radius: var(--r-btn) !important;
  font-family: var(--f-body) !important; font-size: 14px !important; font-weight: 500 !important; cursor: pointer !important;
  transition: transform .15s, background .15s !important;
}
.zvs-review-form-wrap .zvs-submit-btn:hover,
.zvs-review-form-wrap input[type="submit"]:hover {
  background: var(--zvs-btn-hover-bg, color-mix(in oklch, var(--lime) 85%, black)) !important;
  color: var(--zvs-btn-hover-c, var(--lime-ink)) !important;
  transform: translateY(-1px) !important;
}
@media (max-width: 860px) {
  /* On mobile: remove post-content side padding so reviews can go full width */
  body.single-product.zvs-active .zv-post-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Product grid gets its own side padding instead */
  .zvs-active div.product {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  /* Reviews section: full viewport width */
  .zvs-reviews-section {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .zvs-reviews-section__inner {
    padding: 0 20px !important;
  }
  /* Reviews grid: single column */
  .zvs-reviews-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }
  .zvs-reviews-grid > * {
    width: 100% !important; max-width: 100% !important; min-width: 0 !important;
  }
  .zvs-reviews-score-panel { position: static !important; }
  .zvs-reviews-score-num { font-size: 40px !important; }

  /* Filter: All on full-width top row, all star buttons in one row below */
  .zvs-reviews-filter {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-bottom: 20px !important;
  }
  /* All button: full width on its own row */
  .zvs-filter-btn[data-filter="0"] {
    width: 100% !important;
    text-align: center !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
  }
  /* Star buttons: all in one row using flex:1 with max-width cap */
  .zvs-filter-btn:not([data-filter="0"]) {
    flex: 1 1 0 !important;
    text-align: center !important;
    padding: 8px 4px !important;
    font-size: 12px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  /* Review cards: full width, avatar inline with name */
  .zvs-review-card {
    display: block !important; /* drop grid, use block flow */
    padding: 16px 0 !important;
  }
  /* Put avatar + meta-row on one line */
  .zvs-review-card .zvs-review-avatar {
    display: inline-flex !important;
    width: 32px !important; height: 32px !important; font-size: 12px !important;
    vertical-align: middle !important; margin-right: 8px !important;
    flex-shrink: 0 !important;
  }
  .zvs-review-card .zvs-review-meta-row {
    display: inline-flex !important; align-items: center !important;
    gap: 8px !important; flex-wrap: wrap !important;
    width: calc(100% - 40px) !important; vertical-align: middle !important;
  }
  .zvs-review-body {
    display: block !important; width: 100% !important; min-width: 0 !important;
    margin-top: 10px !important;
  }
  .zvs-review-text { font-size: 14px !important; line-height: 1.6 !important; }
}

/* ── Reviews: star filter + pagination ──────────────── */
.zvs-reviews-filter {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 20px;
}
.zvs-filter-btn {
  background: var(--bg-3); color: var(--fg-mute);
  border: 1px solid var(--line-color-2); border-radius: var(--r-btn);
  padding: 5px 12px; font-family: var(--f-mono); font-size: 11px;
  font-weight: 500; letter-spacing: .06em; cursor: pointer;
  transition: all .15s;
}
.zvs-filter-btn:hover { color: var(--fg); border-color: var(--fg-mute); }
.zvs-filter-btn--active {
  background: var(--zvs-accent, var(--lime)); color: var(--lime-ink) !important;
  border-color: transparent !important;
}
.zvs-reviews-pagination {
  display: flex; gap: 4px; align-items: center;
  margin-top: 20px; flex-wrap: wrap;
}
.zvs-page-btn {
  background: var(--bg-3); color: var(--fg-mute);
  border: 1px solid var(--line-color-2); border-radius: var(--r-btn);
  padding: 6px 12px; font-family: var(--f-mono); font-size: 12px;
  cursor: pointer; transition: all .15s; min-width: 36px;
}
.zvs-page-btn:hover:not(:disabled) { color: var(--fg); border-color: var(--fg-mute); }
.zvs-page-btn--active { background: var(--bg-2); color: var(--fg) !important; border-color: var(--line-color-2) !important; }
.zvs-page-btn:disabled { opacity: .3; cursor: not-allowed; }

/* ── Nav: Account + Cart Buttons ─────────────────── */
/* Header Builder wc_account element */
.zvhb-fe-wc-account {
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
  text-decoration: none !important; transition: opacity .15s !important;
}
.zvhb-fe-wc-account:hover { opacity: .75 !important; }
/* Header Builder wc_cart element */
.zvhb-fe-wc-cart {
  position: relative !important; display: inline-flex !important; align-items: center !important;
  justify-content: center !important; text-decoration: none !important; transition: opacity .15s !important;
  width: 36px !important; height: 36px !important;
}
.zvhb-fe-wc-cart:hover { opacity: .75 !important; }
.zvhb-fe-wc-cart__count {
  position: absolute !important; top: -5px !important; right: -6px !important;
  min-width: 17px !important; height: 17px !important; padding: 0 4px !important;
  border-radius: 999px !important; font-size: 10px !important; font-weight: 700 !important;
  display: grid !important; place-items: center !important; line-height: 1 !important;
}
.zvs-nav-injected { display: flex !important; align-items: center !important; gap: 8px !important; }

/* ═══ 11 · RESPONSIVE ══════════════════════════════════ */

@media (max-width: 1024px) {
  .zvs-active div.product { grid-template-columns: 1fr; }
  .zvs-active div.product div.images { position: relative; } /* keep badge anchored to image area, not div.product */
  .zvs-active div.product .woocommerce-tabs { grid-column: auto; }
  .zvs-active .related.products, .zvs-active .upsells.products,
  .zvs-active section.related, .zvs-active section.upsells { grid-column: auto; }
  .zvs-trust-grid { grid-template-columns: 1fr 1fr !important; }
  .zvs-tab-overview { grid-template-columns: 1fr !important; gap: 32px !important; }
  .zvs-active #reviews { grid-template-columns: 1fr !important; gap: 32px !important; }
  .zvs-preview-strip { margin-left: 0 !important; margin-right: 0 !important; }
  .zvs-preview-strip__top { grid-template-columns: 1fr !important; gap: 16px !important; }
  .zvs-changelog-row { grid-template-columns: 1fr !important; gap: 12px !important; }
  .zvs-related.products ul.products,
  .zvs-active .related.products ul.products,
  .zvs-active section.related ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 768px) {
  .zvs-active ul.products { grid-template-columns: repeat(2, 1fr) !important; }
  .zvs-active .related.products ul.products,
  .zvs-active section.related ul.products { grid-template-columns: repeat(2, 1fr) !important; }
  .zvs-cart-style-modern table.cart { display: block; }
  .zvs-cart-style-modern table.cart thead { display: none; }
  .zvs-cart-style-modern table.cart tbody { display: grid; }
  .zvs-cart-style-modern table.cart tr {
    display: grid; grid-template-columns: 64px 1fr auto;
    gap: 12px; padding: 16px; border-bottom: 1px solid var(--line-color);
  }
  .zvs-cart-style-modern table.cart td { padding: 0; border: none; background: transparent; }
  .zvs-trust-grid { grid-template-columns: 1fr !important; }
  .zvs-specs-dl { grid-template-columns: 140px 1fr !important; }
  .zvs-stat-n { font-size: 42px !important; }
  .zvs-active .woocommerce form .form-row-first,
  .zvs-active .woocommerce form .form-row-last { width: 100%; float: none; }
  .zvs-active .woocommerce-order-received .woocommerce-order-overview { flex-direction: column; }
  .zvs-active .woocommerce-order-received .woocommerce-order-overview li { border-right: none; border-bottom: 1px solid var(--line-color); }
}

@media (max-width: 480px) {
  .zvs-active ul.products { grid-template-columns: 1fr !important; }
  .zvs-active div.product p.price .woocommerce-Price-amount { font-size: 32px !important; }
  .zvs-specs-dl { grid-template-columns: 1fr !important; }
  .zvs-specs-dt { border-top: none !important; padding-bottom: 0 !important; }
  .zvs-faq-q { font-size: 16px !important; }
  .zvs-preview-browser__content { aspect-ratio: 16/9 !important; }
  .zvs-subtitle { font-size: 22px !important; }
}

/* ═══ WC GUTENBERG BLOCK GRID ══════════════════════════════
   Targets .wc-block-grid__product (used in Cart/empty-state
   "Neu im Shop" block and similar Gutenberg product blocks).
   Mirrors the loop card design exactly.
   ══════════════════════════════════════════════════════════ */
.zvs-active .wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  list-style: none !important; padding: 0 !important; margin: 0 !important;
}
.zvs-active .wc-block-grid__product {
  background: var(--bg-2) !important;
  border-radius: var(--r-card) !important;
  border: 1px solid var(--line-color) !important;
  overflow: hidden !important;
  display: flex !important; flex-direction: column !important;
  transition: transform .2s var(--ease-out), box-shadow .2s !important;
  position: relative !important;
  /* Override WC Block's own flex constraints */
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.zvs-active .wc-block-grid__product:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 32px rgba(0,0,0,.35) !important; }
/* Sale badge */
.zvs-active .wc-block-grid__product-onsale {
  position: absolute !important; top: 10px !important; left: 10px !important; z-index: 2 !important;
  background: var(--zvs-sale-bg, var(--lime)) !important; color: var(--zvs-sale, var(--lime-ink)) !important;
  font-family: var(--f-mono) !important; font-size: 10px !important; font-weight: 700 !important;
  padding: 3px 9px !important; border-radius: 999px !important; letter-spacing: .06em !important;
  text-transform: uppercase !important; line-height: 1.4 !important;
}
.zvs-active .wc-block-grid__product-onsale .screen-reader-text { display: none !important; }
/* Image area */
.zvs-active .wc-block-grid__product-link { display: block !important; text-decoration: none !important; }
.zvs-active .wc-block-grid__product-image a { display: block !important; }
.zvs-active .wc-block-grid__product-image img { width: 100% !important; height: auto !important; display: block !important; }
/* Title */
.zvs-active .wc-block-grid__product-title {
  font-family: var(--f-display) !important; font-weight: 700 !important; font-size: 15px !important;
  padding: 12px 16px 4px !important; line-height: 1.3 !important; color: var(--fg) !important;
  text-decoration: none !important; display: block !important;
}
/* Price */
.zvs-active .wc-block-grid__product-price {
  padding: 0 16px 8px !important; font-size: 15px !important;
  color: var(--zvs-price, var(--lime)) !important; display: block !important;
}
.zvs-active .wc-block-grid__product-price del {
  color: var(--fg-mute) !important; font-size: 13px !important;
  text-decoration: line-through !important; margin-right: 4px !important;
}
.zvs-active .wc-block-grid__product-price del .woocommerce-Price-amount { color: var(--fg-mute) !important; }
.zvs-active .wc-block-grid__product-price ins { text-decoration: none !important; }
/* Rating */
.zvs-active .wc-block-grid__product-rating { padding: 0 16px 0 !important; }
.zvs-active .wc-block-grid__product-rating .star-rating {
  margin: 0 !important; padding: 0 !important; float: none !important;
  display: block !important; font-size: 12px !important; width: 5.4em !important;
}
.zvs-active .wc-block-grid__product-rating .star-rating span::before { color: var(--zvs-star, var(--lime)) !important; }
/* ATC button */
.zvs-active .wc-block-grid__product-add-to-cart { padding: 8px 12px 14px !important; margin-top: auto !important; }
.zvs-active .wc-block-grid__product-add-to-cart .wp-block-button__link,
.zvs-active .wc-block-grid__product-add-to-cart a {
  background: var(--bg-3) !important; color: var(--fg) !important;
  border: 1px solid var(--line-color-2) !important; border-radius: var(--r-btn) !important;
  padding: 11px 16px !important; width: 100% !important; text-align: center !important;
  font-family: var(--f-body) !important; font-size: 13px !important; font-weight: 500 !important;
  transition: all .15s !important; display: block !important; text-decoration: none !important;
  box-sizing: border-box !important;
}
.zvs-active .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.zvs-active .wc-block-grid__product-add-to-cart a:hover {
  background: var(--zvs-btn-bg, var(--lime)) !important;
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border-color: transparent !important;
}
@media (max-width: 860px) {
  .zvs-active .wc-block-grid__products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .zvs-active .wc-block-grid__products { grid-template-columns: 1fr !important; }
}

/* ── Eyebrow *muted* markdown syntax ───────────────── */
.zvs-eyebrow .zvs-eyebrow-muted {
  color: var(--fg-mute) !important;
  font-weight: 300 !important;
  opacity: .7;
}

/* ── Share buttons — theme-styled ───────────────────── */
.zvs-active .zv-sharing { margin: 24px 0 !important; }
.zvs-active .zv-sharing a,
.zvs-active .zv-sharing button {
  background: var(--bg-3) !important;
  color: var(--fg) !important;
  border: 1px solid var(--line-color-2) !important;
  border-radius: var(--r-btn) !important;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-family: var(--f-mono) !important;
  font-weight: 500 !important;
  letter-spacing: .04em !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all .15s !important;
}
.zvs-active .zv-sharing a:hover,
.zvs-active .zv-sharing button:hover {
  background: var(--bg-2) !important;
  border-color: var(--fg-mute) !important;
  color: var(--fg) !important;
}

/* ═══════════════════════════════════════════════════════
   WC BLOCKS CART — Full Restyle
   ═══════════════════════════════════════════════════════ */

/* ── Layout: force nowrap flex, sidebar right ── */
.zvs-cart-style-modern .wc-block-components-sidebar-layout.wc-block-cart {
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 40px !important;
  max-width: 1320px;
  margin: 0 auto;
}
.zvs-cart-style-modern .wc-block-cart__main {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}
.zvs-cart-style-modern .wc-block-cart__sidebar {
  flex: 0 0 380px !important;
  width: 380px !important;
  position: sticky !important;
  top: 100px !important;
  align-self: flex-start !important;
}

/* ── Cart items table header ── */
.zvs-cart-style-modern .wc-block-cart-items__header {
  border-bottom: 1px solid var(--line-color);
  padding: 0 0 10px 0;
}
.zvs-cart-style-modern .wc-block-cart-items__header-product,
.zvs-cart-style-modern .wc-block-cart-items__header-total {
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fg-mute);
}

/* ── Cart item row ── */
.zvs-cart-style-modern .wc-block-cart-items__row {
  border-bottom: 1px solid var(--line-color);
  padding: 20px 0;
  align-items: center;
}

/* ── Thumbnail ── */
.zvs-cart-style-modern .wc-block-cart-item__image img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: var(--r-sm);
  border: 1px solid var(--line-color);
}

/* ── Product name ── */
.zvs-cart-style-modern .wc-block-components-product-name,
.zvs-cart-style-modern .wc-block-components-product-name a {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 15px;
  color: var(--fg);
  text-decoration: none;
}
.zvs-cart-style-modern .wc-block-components-product-name a:hover { color: var(--lime); }

/* ── Product sub-price ── */
.zvs-cart-style-modern .wc-block-cart-item__prices .price,
.zvs-cart-style-modern .wc-block-cart-item__prices .wc-block-components-product-price {
  font-family: var(--f-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--fg-mute);
}

/* ── Variation / addon meta ── */
.zvs-cart-style-modern .wc-block-components-product-details__name {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--fg-mute);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.zvs-cart-style-modern .wc-block-components-product-details__value {
  font-family: var(--f-display);
  font-size: 12px;
  color: var(--fg-mute);
}

/* ── Quantity selector ── */
.zvs-cart-style-modern .wc-block-components-quantity-selector {
  display: flex;
  align-items: center;
  border: 1px solid var(--line-color-2);
  border-radius: var(--r-btn);
  overflow: hidden;
  background: var(--bg-2);
  width: fit-content;
}
.zvs-cart-style-modern .wc-block-components-quantity-selector__input {
  background: transparent;
  border: none;
  color: var(--fg);
  font-family: var(--f-mono);
  font-size: 14px;
  font-weight: 500;
  width: 40px;
  text-align: center;
  padding: 0;
  -moz-appearance: textfield;
  box-shadow: none !important;
}
.zvs-cart-style-modern .wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.zvs-cart-style-modern .wc-block-components-quantity-selector__input::-webkit-inner-spin-button { -webkit-appearance: none; }
.zvs-cart-style-modern .wc-block-components-quantity-selector__button {
  background: transparent;
  border: none;
  color: var(--fg-mute);
  font-size: 16px;
  width: 34px;
  height: 38px;
  cursor: pointer;
  transition: color .15s, background .15s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.zvs-cart-style-modern .wc-block-components-quantity-selector__button:hover {
  color: var(--fg);
  background: var(--bg-3);
}

/* ── Remove link ── */
.zvs-cart-style-modern .wc-block-cart-item__remove-link a {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--fg-mute-2);
  text-decoration: none;
  text-transform: uppercase;
  transition: color .15s;
  margin-top: 8px;
  display: inline-block;
}
.zvs-cart-style-modern .wc-block-cart-item__remove-link a:hover { color: var(--danger, #ef4444); }

/* ── Line total ── */
.zvs-cart-style-modern .wc-block-cart-item__total .wc-block-formatted-money-amount {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 16px;
  color: var(--fg);
}

/* ── Sidebar card ── */
.zvs-cart-style-modern .wc-block-cart__sidebar {
  background: var(--bg-2);
  border: 1px solid var(--line-color);
  border-radius: var(--r-card);
  padding: 28px;
}
.zvs-cart-style-modern .wc-block-cart__totals-title h2 {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -.02em;
  color: var(--fg);
  margin-bottom: 20px;
}

/* ── Totals rows ── */
.zvs-cart-style-modern .wc-block-components-totals-item {
  border-top: 1px solid var(--line-color);
  border-bottom: none !important;
  padding: 14px 0;
}
/* Coupon panel: no double border */
.zvs-cart-style-modern .wc-block-components-totals-coupon {
  border-top: none !important;
  padding-top: 0 !important;
}
/* Kill any WC-injected HR or extra borders in sidebar */
.zvs-cart-style-modern .wc-block-cart__sidebar hr,
.zvs-cart-style-modern .wc-block-components-totals-item + .wc-block-components-totals-item {
  border-top: 1px solid var(--line-color) !important;
}
.zvs-cart-style-modern .wc-block-cart__sidebar .wc-block-components-panel {
  border-top: none !important;
  border-bottom: 1px solid var(--line-color) !important;
  padding-bottom: 4px !important;
}
.zvs-cart-style-modern .wc-block-components-totals-item__label {
  font-family: var(--f-display);
  font-size: 14px;
  color: var(--fg-mute);
}
.zvs-cart-style-modern .wc-block-components-totals-item__value {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 15px;
  color: var(--fg);
}
.zvs-cart-style-modern .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  font-weight: 700;
  font-size: 16px;
  color: var(--fg);
}
.zvs-cart-style-modern .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--lime);
}

/* ── Coupon panel ── */
.zvs-cart-style-modern .wc-block-components-panel__button {
  font-family: var(--f-display);
  font-size: 13px;
  color: var(--fg-mute);
  background: none;
  border: none;
  cursor: pointer;
  padding: 10px 0;
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  transition: color .15s;
}
.zvs-cart-style-modern .wc-block-components-panel__button:hover { color: var(--fg); }

/* ── Proceed to checkout button ── */
.zvs-cart-style-modern .wc-block-cart__submit-container {
  margin-top: 20px;
}
/* Fix WC sticky button glow — WC uses --wp-preset--color--background (white) for the fade.
   Override it to our dark bg so the ::before gradient doesn't glow white. */
.zvs-cart-style-modern {
  --wp--preset--color--background: var(--bg);
}
.zvs-cart-style-modern .wc-block-cart__submit-container::before {
  background: linear-gradient(to top, var(--bg) 0%, transparent 100%) !important;
}
.zvs-cart-style-modern .wc-block-cart__submit-container .wc-block-components-button {
  width: 100% !important;
  background: var(--zvs-btn-bg, var(--lime)) !important;
  color: var(--zvs-btn-color, var(--lime-ink)) !important;
  border: none !important;
  border-radius: var(--r-btn) !important;
  font-family: var(--f-display) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 14px 24px !important;
  cursor: pointer;
  transition: filter .15s, transform .15s;
  text-decoration: none !important;
  display: block !important;
}
.zvs-cart-style-modern .wc-block-cart__submit-container .wc-block-components-button:hover {
  filter: brightness(1.1) !important;
  transform: translateY(-1px) !important;
}


/* ── Coupon field styling ────────────────────────────────── */
.zvs-cart-style-modern .wc-block-components-totals-coupon {
  background: var(--bg-2) !important;
  border-radius: var(--r-card) !important;
  padding: 16px !important;
  margin-bottom: 12px !important;
  border: 1px solid var(--line-color) !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon__form {
  display: flex !important;
  gap: 8px !important;
  margin-top: 10px !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon input[type="text"] {
  flex: 1 !important;
  background: var(--bg-3) !important;
  border: 1px solid var(--line-color-2) !important;
  border-radius: 8px !important;
  color: var(--fg) !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  font-family: var(--f-body) !important;
  -webkit-appearance: none !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon input[type="text"]::placeholder {
  color: var(--fg-mute) !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon button {
  background: var(--lime) !important;
  color: var(--lime-ink) !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  font-family: var(--f-body) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  -webkit-appearance: none !important;
  transition: filter .15s !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon button:hover {
  filter: brightness(1.1) !important;
}

/* ── Cross-sells section ── */
.zvs-cart-style-modern .wp-block-woocommerce-product-collection h2,
.zvs-cart-style-modern .wc-block-cart__main .wp-block-woocommerce-product-collection h2 {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: -.02em;
  margin: 40px 0 20px;
}

/* ── Order summary card: inner alignment ──
   The coupon block is the first child of the summary card, but WC gives it a
   default border-top (paper/0.2) and no top padding — so a stray bright line
   sat right against the card's own rounded border and the coupon field stuck
   to the top edge. The submit button was exactly card-width, painting over
   the card outline on both sides; inset it to match the coupon field. */
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-coupon-form-block {
  border-top: 0 !important;
  padding-top: 20px !important;
}
.zvs-cart-style-modern .wc-block-cart__submit-container {
  padding: 0 24px !important;
  box-sizing: border-box !important;
}

/* ═══ BORDER + SPACING CLEANUP (cart & checkout) ═══════════
   WooCommerce's own block styles paint borders in `paper/0.2` — a light
   line that reads as a foreign element on the dark ZERONIQ card. Several
   wrappers also stack their own dividers, so a single visual separation
   was drawn two or three times. Normalise every border inside the cart and
   the checkout summary to the theme token, then re-enable only the
   dividers that carry meaning. */
.zvs-cart-style-modern .wp-block-woocommerce-cart *,
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-block * {
  border-color: var(--line-color) !important;
}

/* Checkout: kill the duplicate outline drawn 1px inside the card border */
.zvs-checkout-style-modern .checkout-order-summary-block-fill,
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-cart-items-block {
  border: 0 !important;
}
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-coupon-form-block {
  border-top: 1px solid var(--line-color) !important;
  border-bottom: 0 !important;
  padding-top: 16px !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-coupon {
  border: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-totals-block {
  border-top: 1px solid var(--line-color) !important;
  padding-top: 4px !important;
  padding-bottom: 8px !important;
}
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-wrapper,
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-item {
  border: 0 !important;
}
.zvs-checkout-style-modern .wc-block-components-totals-footer-item {
  border-top: 1px solid var(--line-color) !important;
}
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-block {
  padding-bottom: 18px !important;
}
.zvs-checkout-style-modern [class*="order-summary-subtotal-block"] {
  padding-bottom: 12px !important;
}

/* Cart: same treatment — one divider above the totals group, none stacked */
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-block {
  border-bottom: 0 !important;
}
.zvs-cart-style-modern .wc-block-components-totals-coupon {
  border: 0 !important;
}
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-totals-block {
  border-top: 1px solid var(--line-color) !important;
}
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-totals-block .wc-block-components-totals-wrapper {
  border-top: 0 !important;
}

/* Empty WC wrappers that still rendered a divider or reserved height */
.zvs-cart-style-modern .wc-block-components-totals-wrapper:empty,
.zvs-cart-style-modern [class*="order-summary-totals-block"]:empty,
.zvs-cart-style-modern [class*="order-summary-discount-block"]:empty,
.zvs-cart-style-modern [class*="order-summary-fee-block"]:empty,
.zvs-cart-style-modern [class*="order-summary-shipping-block"]:empty,
.zvs-cart-style-modern .wc-block-cart__payment-options:empty {
  display: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ── Checkout order summary: empty WC totals blocks ──
   WooCommerce always renders the discount / fee / shipping / taxes wrappers,
   even with nothing in them. Each empty one still carried 20px of padding,
   stacking into a ~80px void between Zwischensumme and Gesamtsumme. */
.zvs-checkout-style-modern .wc-block-components-totals-wrapper:empty,
.zvs-checkout-style-modern [class*="order-summary-discount-block"]:empty,
.zvs-checkout-style-modern [class*="order-summary-fee-block"]:empty,
.zvs-checkout-style-modern [class*="order-summary-shipping-block"]:empty,
.zvs-checkout-style-modern [class*="order-summary-taxes-block"]:empty {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 0 !important;
}

/* ── Checkout order summary: collapse nested padding ──
   Four nested wrappers each contributed their own horizontal padding
   (22 + 24 + 16 + 24 per side = 86px). In a 264px sidebar that left the
   line-item description ~57px wide, wrapping product names one character
   per line and blowing a single row up to ~1000px tall. Applies at ALL
   widths, not just phones: the worst case is the tablet range, where the
   sidebar is narrowest but a mobile media query would not fire. */
.zvs-checkout-style-modern .wp-block-woocommerce-checkout-order-summary-cart-items-block,
.zvs-checkout-style-modern .wc-block-components-order-summary,
.zvs-checkout-style-modern .wc-block-components-checkout-order-summary__content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.zvs-checkout-style-modern .wc-block-components-order-summary__content {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Two-column line item (thumb | title, price beneath) wherever the sidebar
   is too narrow for the default three-column grid. */
@media (max-width: 1200px) {
  .zvs-checkout-style-modern .wc-block-components-order-summary-item {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 4px 12px !important;
  }
  .zvs-checkout-style-modern .wc-block-components-order-summary-item__image {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
  }
  .zvs-checkout-style-modern .wc-block-components-order-summary-item__description {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }
  .zvs-checkout-style-modern .wc-block-components-order-summary-item__total-price {
    grid-column: 2 !important;
    grid-row: 2 !important;
    text-align: right !important;
    margin-top: 4px !important;
  }
}

/* ── Remove the duplicate order summary on mobile ──
   In its mobile layout WooCommerce renders the summary TWICE: once as a
   collapsed accordion in the sidebar at the top of the page, and again in
   full inside the form above the place-order button. Hide the top one —
   the lower block carries the complete content (line items, coupon field,
   subtotal and grand total), so nothing is lost. WC sets `is-mobile` on the
   layout itself, so this follows WC's own breakpoint rather than guessing. */
.zvs-checkout-style-modern .wc-block-checkout.is-mobile .wc-block-checkout__sidebar {
  display: none !important;
}

/* ── Notices: stack on mobile ──
   `.woocommerce-message` is a flex row with space-between. At phone widths the
   "Warenkorb anzeigen" button held its width and squeezed the message text
   into a ~130px column, wrapping it over ten lines. column-reverse keeps the
   text first in reading order (the button is first in WC's DOM). */
@media (max-width: 768px) {
  .zvs-active .woocommerce-message,
  .zvs-active .woocommerce-info {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 16px !important;
    text-align: left !important;
  }
  .zvs-active .woocommerce-message .button,
  .zvs-active .woocommerce-info .button,
  .zvs-active .woocommerce-info a.button,
  .zvs-active .woocommerce-info .wc-forward {
    margin-left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    white-space: normal !important;
    padding: 11px 16px !important;
  }
}

/* ── Empty WC block wrappers ──
   WooCommerce ships several block wrappers that render nothing here (the
   summary heading is styled away, payment-options is empty without express
   gateways) but still contribute ~35px of margin each. On mobile that stacked
   into a large void above the coupon field. */
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-heading-block {
  margin: 0 !important;
}
.zvs-cart-style-modern .wc-block-cart__payment-options:empty,
.zvs-cart-style-modern .wp-block-woocommerce-cart-order-summary-totals-block:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Responsive ── */
@media (max-width: 768px) {
  /* Layout: sidebar (coupon+totals) ABOVE cart items and cross-sells.
     gap must be reset — the desktop rule sets 40px, which survived the
     switch to column and stacked with the sidebar margin into a ~56px hole. */
  .zvs-cart-style-modern .wc-block-components-sidebar-layout.wc-block-cart {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }
  /* Reading order on mobile: line items → totals/checkout → cross-sells.
     `__main` holds BOTH the items table and the cross-sell collection, so
     ordering it as one block would push the totals either above the items
     (old behaviour) or below ~900px of product recommendations. display:contents
     dissolves the wrapper so its two children can be ordered individually. */
  .zvs-cart-style-modern .wc-block-cart__main {
    display: contents !important;
  }
  .zvs-cart-style-modern .wc-block-cart-items {
    order: 1 !important;
  }
  .zvs-cart-style-modern .wc-block-cart__sidebar {
    order: 2 !important;
    flex: none !important;
    width: 100% !important;
    position: static !important;
    margin: 20px 0 0 !important;
    padding: 20px 0 0 !important;
    border-top: 1px solid var(--line-color) !important;
    border-bottom: 0 !important;
  }
  .zvs-cart-style-modern .wp-block-woocommerce-product-collection {
    order: 3 !important;
  }
  /* Submit button: WC adds margin on both the wrapper and the container */
  .zvs-cart-style-modern .wc-block-cart__submit { margin-bottom: 0 !important; }
  .zvs-cart-style-modern .wc-block-cart__submit-container { margin-top: 16px !important; }

  /* Prevent horizontal overflow */
  .zvs-cart-style-modern .wc-block-components-sidebar-layout,
  .zvs-cart-style-modern .wc-block-cart,
  .zvs-cart-style-modern .wp-block-woocommerce-cart {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Row: 2-col grid — thumbnail | content, price on its own line.
     The old 3-col grid (72px 1fr auto) resolved to 72px/126px/100px at 390px
     viewport: the price column ate 100px and the product title was crushed
     into a 126px column, wrapping product names across four lines. */
  .zvs-cart-style-modern .wc-block-cart-items__row {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    gap: 4px 14px !important;
    align-items: start !important;
    padding: 14px 0 !important;
    max-width: 100% !important;
  }

  /* The table-era rules (`__row td { border-bottom }`, `td.…__image
     { width:88px }`) still applied in the grid layout: the cell border
     rendered as a stub line under the 88px thumbnail instead of a divider
     across the row, and the width override beat the 64px set here. */
  .zvs-cart-style-modern .wc-block-cart-items__row td {
    border-bottom: 0 !important;
    padding: 0 !important;
  }
  .zvs-cart-style-modern .wc-block-cart-items__row {
    border-bottom: 1px solid var(--line-color) !important;
  }
  .zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__image,
  .zvs-cart-style-modern .wc-block-cart-item__image {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 64px !important;
    padding: 0 !important;
  }
  .zvs-cart-style-modern .wc-block-cart-item__image img {
    width: 64px !important;
    height: 64px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    display: block !important;
  }

  .zvs-cart-style-modern .wc-block-cart-item__product {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  /* Page container: 48px of top padding reads as a large void above the
     first line item on a phone. Scoped to cart/checkout only. */
  body.zvs-cart-style-modern .zv-container,
  body.zvs-checkout-style-modern .zv-container {
    padding-top: 24px !important;
  }

  /* Price moves under the title, right-aligned */
  .zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__total,
  .zvs-cart-style-modern .wc-block-cart-item__total {
    grid-column: 2 !important;
    grid-row: 2 !important;
    padding: 0 !important;
    margin-top: 6px !important;
    text-align: right !important;
    justify-content: flex-end !important;
  }
  .zvs-cart-style-modern .wc-block-cart-item__wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
  }

  /* Hide per-unit price — row total is shown in the third column */
  .zvs-cart-style-modern .wc-block-cart-item__prices {
    display: none !important;
  }

  /* Total: own row under the title (see 2-col grid above), price + sale badge
     side by side and right-aligned. */
  .zvs-cart-style-modern .wc-block-cart-items__row .wc-block-cart-item__total {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: start !important;
    padding: 0 !important;
    max-width: none !important;
    margin-top: 6px !important;
    text-align: right !important;
  }
  .zvs-cart-style-modern .wc-block-cart-item__total-price-and-sale-badge-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px 8px !important;
  }
  .zvs-cart-style-modern .wc-block-components-product-badge {
    font-size: 10px !important;
    padding: 2px 6px !important;
    white-space: nowrap !important;
    text-align: right !important;
  }
}

/* ── Cart item row ── */
.zvs-cart-style-modern .wc-block-cart-items__row td {
  padding: 18px 12px 18px 0 !important;
  vertical-align: middle !important;
  border-bottom: 1px solid var(--line-color) !important;
  background: transparent !important;
}
.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__image {
  padding-right: 16px !important;
  width: 88px !important;
}
.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__total {
  padding-right: 0 !important;
  padding-bottom: 14px !important;
  text-align: right !important;
  white-space: nowrap;
  vertical-align: top !important;
}

/* Image: align top with product name */
.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__image {
  vertical-align: top !important;
  padding-top: 20px !important;
  padding-bottom: 14px !important;
}

/* Row bottom padding */
.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__product {
  padding-bottom: 14px !important;
}

/* Pay price: lime */
.zvs-cart-style-modern .wc-block-cart-item__total .wc-block-components-product-price .wc-block-formatted-money-amount {
  color: var(--lime) !important;
  font-weight: 700 !important;
  font-size: 16px !important;
}

/* Spare badge: muted pill */
.zvs-cart-style-modern .wc-block-components-sale-badge {
  background: var(--bg-3) !important;
  color: var(--fg-mute) !important;
  font-family: var(--f-mono) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .04em !important;
  border-radius: 4px !important;
  padding: 2px 5px !important;
  margin-top: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}

/* Qty selector: compact */
.zvs-cart-style-modern .wc-block-components-quantity-selector {
  height: 32px !important;
}
.zvs-cart-style-modern .wc-block-components-quantity-selector__button {
  height: 32px !important;
  width: 30px !important;
}
.zvs-cart-style-modern .wc-block-components-quantity-selector__input {
  height: 32px !important;
  padding: 0 !important;
  line-height: 32px !important;
}

/* Qty area: less top gap */
.zvs-cart-style-modern .wc-block-cart-item__quantity {
  margin-top: 8px !important;
}

/* ══════════════════════════════════════════════════
   CROSS-SELLS — pixel-perfect match to .zvs-card
   ══════════════════════════════════════════════════ */

.zvs-cart-style-modern .wc-block-product-template {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Card shell */
.zvs-cart-style-modern .wc-block-product-template li {
  background: var(--bg-2) !important;
  border: 1px solid var(--line-color) !important;
  border-radius: var(--r-card) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  list-style: none !important;
  padding: 0 !important;
  transition: transform var(--dur-base, .25s) var(--ease-out), box-shadow var(--dur-base, .25s), border-color var(--dur-base, .25s) !important;
}
.zvs-cart-style-modern .wc-block-product-template li:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--sh-card, 0 20px 50px -20px rgba(0,0,0,.25)) !important;
  border-color: var(--line-color-2) !important;
}

/* Image wrapper — position:relative for badge */
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-image {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 3/4 !important;
  overflow: hidden !important;
  background: var(--bg-3) !important;
  position: relative !important;
  flex-shrink: 0 !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-image a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform var(--dur-slow, .5s) var(--ease-out) !important;
}
.zvs-cart-style-modern .wc-block-product-template li:hover .wc-block-components-product-image img {
  transform: scale(1.04) !important;
}

/* Sale badge — absolute on image, top-left like shop */
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-sale-badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  z-index: 2 !important;
  background: var(--lime) !important;
  color: var(--lime-ink, #FFFFFF) !important;
  font-family: var(--f-mono) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 999px !important;
  padding: 3px 9px !important;
  line-height: 1.4 !important;
  display: inline-block !important;
}
/* WC Blocks wraps badge in extra div — move that into position too */
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-image__inner-container {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wp-block-woocommerce-product-sale-badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
}

/* Title */
.zvs-cart-style-modern .wc-block-product-template li h2.wp-block-post-title {
  font-family: var(--f-display) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
  line-height: 1.25 !important;
  color: var(--fg) !important;
  text-align: left !important;
  padding: 12px 16px 0 !important;
  margin: 0 !important;
  display: block !important;
}
.zvs-cart-style-modern .wc-block-product-template li h2.wp-block-post-title a {
  color: var(--fg) !important;
  text-decoration: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline !important;
}
.zvs-cart-style-modern .wc-block-product-template li h2.wp-block-post-title a:hover { color: var(--lime) !important; }

/* Price */
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-price {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 4px !important;
  font-family: var(--f-display) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--lime) !important;
  padding: 6px 16px 0 !important;
  margin: 0 !important;
  text-align: left !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-price del {
  display: inline !important;
  margin: 0 !important;
  color: var(--fg-mute) !important;
  opacity: .6 !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  text-decoration: line-through !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-price ins {
  display: inline !important;
  margin: 0 !important;
  text-decoration: none !important;
}
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-price .screen-reader-text {
  display: none !important;
}

/* ATC button wrapper */
.zvs-cart-style-modern .wc-block-product-template li .wp-block-button {
  padding: 12px 16px 16px !important;
  margin: auto 0 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* ATC button — exact shop match */
.zvs-cart-style-modern .wc-block-product-template li .wp-block-button__link,
.zvs-cart-style-modern .wc-block-product-template li .add_to_cart_button,
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-button__button {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 11px 0 !important;
  border-radius: var(--r-btn) !important;
  background: transparent !important;
  border: 1px solid var(--line-color-2) !important;
  color: var(--fg) !important;
  font-family: var(--f-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  transition: all .15s var(--ease-out) !important;
}
/* Hover — lime fill like shop */
.zvs-cart-style-modern .wc-block-product-template li .wp-block-button__link:hover,
.zvs-cart-style-modern .wc-block-product-template li .add_to_cart_button:hover,
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-button__button:hover {
  background: var(--lime) !important;
  color: var(--lime-ink) !important;
  border-color: transparent !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 22px -10px rgb(8 72 255 / 0.6) !important;
}

/* Section heading */
.zvs-cart-style-modern .wp-block-woocommerce-product-collection .wp-block-heading {
  font-family: var(--f-display) !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  letter-spacing: -.02em !important;
  color: var(--fg) !important;
  margin: 40px 0 20px !important;
  text-align: left !important;
}

/* Responsive */
@media (max-width: 640px) {
  .zvs-cart-style-modern .wc-block-product-template {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Kill WC Blocks auto-margins on cross-sell card children */
.zvs-cart-style-modern .wc-block-product-template li .wc-block-components-product-image { margin: 0 !important; }
.zvs-cart-style-modern .wc-block-product-template li [class*="wp-block-woocommerce-product-price"] { margin: 0 !important; text-align: left !important; }
.zvs-cart-style-modern .wc-block-product-template li [class*="wp-block-woocommerce-product-add-to-cart"] { margin: 0 !important; padding: 0 !important; }

/* ═══ GROUPED PRODUCT TABLE ═══ */
/* "Ausführung wählen" button — dark bg with white text, not grey bg with lime */
.zvs-active .grouped_form .button.product_type_variable,
.zvs-active .woocommerce-grouped-product-list .button.product_type_variable {
    background: var(--ink-2, #121317) !important;
    color: var(--paper, #F7F5F0) !important;
    border: 1px solid color-mix(in srgb, var(--paper, #F7F5F0) 12%, transparent) !important;
    border-radius: var(--r-btn, 10px) !important;
    font-size: 13px !important;
    padding: 10px 16px !important;
    transition: background .15s, border-color .15s;
}
.zvs-active .grouped_form .button.product_type_variable:hover {
    background: var(--ink-3, #22252E) !important;
    border-color: color-mix(in srgb, var(--paper, #F7F5F0) 20%, transparent) !important;
}
/* Grouped product table links — paper white, not lime */
.zvs-active .woocommerce-grouped-product-list td a:not(.button),
.zvs-active .grouped_form td a:not(.button) {
    color: var(--paper, #F7F5F0) !important;
    text-decoration: none !important;
}
.zvs-active .woocommerce-grouped-product-list td a:not(.button):hover,
.zvs-active .grouped_form td a:not(.button):hover {
    color: var(--lime, #0848FF) !important;
}

/* ═══ FINAL CART OVERRIDES ═══════════════════════════════
   These must load AFTER the table-era `.wc-block-cart-items__row td`
   rules further up: WooCommerce still emits <tr>/<td> markup while we
   lay the row out as a grid, and those cell rules have identical
   specificity — so source order decides. Keeping them here is what makes
   the fixes below actually apply. */

@media (max-width: 768px) {
  /* Cell borders drew a 88px stub under the thumbnail instead of a
     divider across the row; the cell width override also beat the 64px
     thumbnail size set in the grid rules. */
  body.zvs-cart-style-modern .wc-block-cart-items__row td {
    border-bottom: 0 !important;
    padding: 0 !important;
  }
  body.zvs-cart-style-modern .wc-block-cart-items__row {
    border-bottom: 1px solid var(--line-color) !important;
  }
  body.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__image {
    width: 64px !important;
    padding: 0 !important;
  }
  body.zvs-cart-style-modern .wc-block-cart-items__row td.wc-block-cart-item__total {
    padding: 0 !important;
    margin-top: 6px !important;
  }
}

/* Coupon toggle: WC only shades the background (bg-2 on a 16px radius) and
   adds a bottom border, so the "box" had no outline of its own while that
   stray border cut across the rounded corners. Give it a real 1px outline
   in the same tone as every other divider. */
body.zvs-cart-style-modern .wp-block-woocommerce-cart .wc-block-components-totals-coupon {
  border: 1px solid var(--line-color) !important;
  border-radius: 12px !important;
  padding: 4px 14px !important;
  margin-bottom: 0 !important;
}
body.zvs-cart-style-modern .wp-block-woocommerce-cart .wp-block-woocommerce-cart-order-summary-coupon-form-block {
  padding-bottom: 16px !important;
}

/* One divider above the grand total, not two 5px apart (the totals wrapper
   and the footer item each drew their own, at different insets). */
body.zvs-cart-style-modern .wp-block-woocommerce-cart .wc-block-components-totals-wrapper {
  border-top: 0 !important;
}
body.zvs-cart-style-modern .wp-block-woocommerce-cart .wc-block-components-totals-footer-item {
  border-top: 1px solid var(--line-color) !important;
  padding-top: 16px !important;
}