/*
 * sodnamis — woocommerce.css
 * Skins WooCommerce single-product, shop/archive, cart/checkout to the theme.
 * Author: sodnamis.lt
 */

.woocommerce-page-inner { max-width: var(--container-max); }

/* ---------- Breadcrumb ---------- */
.woocommerce-breadcrumb {
  margin: 0 0 1.5rem;
  font-size: 0.85rem;
  color: hsl(var(--muted-foreground));
}
.woocommerce-breadcrumb a { color: hsl(var(--muted-foreground)); }
.woocommerce-breadcrumb a:hover { color: hsl(var(--primary)); }

/* ---------- Single product layout ---------- */
/* The 2-column layout lives in the variantas-4 override section further down; the
   only rules shared with the default WC markup are the gallery image styling. */
/* Product page top spacing = ref „px-4 pb-12" (minimal top). */
.single-product .section { padding-block: 1.5rem 3rem; }
.single-product div.product .woocommerce-product-gallery { width: 100% !important; margin: 0; float: none; }
.single-product div.product .woocommerce-product-gallery__wrapper img { border-radius: var(--radius); box-shadow: var(--shadow-card); }
.single-product .product_title { margin-bottom: 0.75rem; }

/* Sale flash → our red pill badge */
.woocommerce span.onsale {
  min-height: auto; min-width: auto; line-height: 1;
  padding: 0.3rem 0.7rem; margin: 0;
  top: 0.85rem; left: 0.85rem; right: auto;
  background: hsl(var(--destructive)); color: #fff;
  font-family: var(--font-body); font-weight: 700; font-size: 0.75rem;
  text-transform: uppercase; letter-spacing: 0.04em;   /* "AKCIJA" like the catalogue cards (client 2026-09-15) */
  border-radius: 9999px;
}

/* Price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: hsl(var(--primary));
  font-family: var(--font-heading); font-weight: 800; font-size: 1.6rem;
  margin-bottom: 1rem;
}
.woocommerce div.product p.price del { color: hsl(var(--muted-foreground)); font-weight: 500; opacity: 0.8; }
.woocommerce div.product p.price ins { text-decoration: none; color: hsl(var(--destructive)); }   /* sale price red (client 2026-09-15) */

.woocommerce-product-details__short-description { color: hsl(var(--muted-foreground)); margin-bottom: 1.25rem; }

/* Add-to-cart + quantity */
.woocommerce div.product form.cart { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.woocommerce .quantity input.qty {
  width: 4.5rem; height: 3rem; padding: 0 0.5rem;
  border: 1px solid hsl(var(--input)); border-radius: 9999px; text-align: center; font: inherit;
  color: hsl(var(--foreground)); background: hsl(var(--background));
}
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button {
  display: inline-flex; align-items: center; justify-content: center;
  background: hsl(var(--primary)); color: #fff;
  font-family: var(--font-body); font-weight: 600; font-size: 0.9375rem;
  padding: 0.7rem 1.5rem; border: 1px solid transparent; border-radius: var(--radius);
  box-shadow: var(--shadow-button); transition: background 0.2s ease, transform 0.1s ease;
  text-transform: none; letter-spacing: normal;
}
/* .alt (primary CTA, e.g. single Add to cart) carries an extra class → match specificity */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt { background: hsl(var(--primary)); color: #fff; }
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover { background: hsl(var(--accent)); color: #fff; }
.woocommerce .button:active { transform: translateY(1px); }
.woocommerce div.product form.cart .button { height: 3rem; }

/* Product meta */
.woocommerce div.product .product_meta { font-size: 0.85rem; color: hsl(var(--muted-foreground)); border-top: 1px solid hsl(var(--border)); padding-top: 1rem; }
.woocommerce div.product .product_meta a { color: hsl(var(--primary)); }

/* ---------- Tabs ---------- */
.woocommerce div.product .woocommerce-tabs { grid-column: 1 / -1; margin-top: 1rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs {
  padding: 0; margin: 0 0 1.5rem; display: flex; gap: 0.5rem; flex-wrap: wrap;
  border-bottom: 1px solid hsl(var(--border));
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent; border: none; border-radius: 0; padding: 0; margin: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  padding: 0.75rem 1.1rem; font-family: var(--font-heading); font-weight: 600; font-size: 0.95rem;
  color: hsl(var(--muted-foreground)); border-bottom: 2px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: hsl(var(--primary)); border-bottom-color: hsl(var(--primary)); }
.woocommerce div.product .woocommerce-tabs .panel { padding: 0; }
.woocommerce div.product .woocommerce-tabs .panel h2:first-child { margin-bottom: 1rem; }

/* Review form inputs */
.woocommerce #reviews input[type="text"],
.woocommerce #reviews input[type="email"],
.woocommerce #reviews textarea {
  width: 100%; padding: 0.65rem 0.85rem; font: inherit;
  border: 1px solid hsl(var(--input)); border-radius: 0.5rem; background: hsl(var(--background));
}
.woocommerce #reviews .comment-form-rating .stars a { color: #f5a623; }

/* ---------- Product loop (shop, archives, related) ---------- */
.woocommerce ul.products {
  display: grid; gap: 1.5rem; margin: 0; padding: 0;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); } }
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product {
  width: auto !important; margin: 0 !important; float: none; text-align: left;
  background: var(--gradient-card); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); box-shadow: var(--shadow-card); overflow: hidden;
  display: flex; flex-direction: column;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.woocommerce ul.products li.product:hover { box-shadow: var(--shadow-card-hover); transform: translateY(-4px); }
.woocommerce ul.products li.product a img { margin: 0; border-radius: 0; aspect-ratio: 4 / 3; object-fit: cover; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 1rem 1.25rem 0; font-family: var(--font-heading); font-size: 1.1rem; font-weight: 600; color: hsl(var(--foreground));
}
.woocommerce ul.products li.product .price {
  padding: 0.25rem 1.25rem 0; color: hsl(var(--primary)); font-family: var(--font-heading); font-weight: 800; font-size: 1.15rem;
}
.woocommerce ul.products li.product .price del { color: hsl(var(--muted-foreground)); font-weight: 500; font-size: 0.9rem; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce ul.products li.product .button { margin: 1rem 1.25rem 1.25rem; align-self: flex-start; }
.woocommerce ul.products li.product .onsale { position: absolute; }

.woocommerce .related.products,
.woocommerce .upsells.products { grid-column: 1 / -1; margin-top: 3rem; }
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2 { font-size: 1.75rem; margin-bottom: 1.5rem; }

/* ---------- Notices ---------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-top-color: hsl(var(--primary));
  background: hsl(var(--secondary) / 0.5);
  border-radius: var(--radius);
}
.woocommerce-message a.button, .woocommerce-info a.button { box-shadow: none; }

/* ---------- Shop toolbar ---------- */
.woocommerce .woocommerce-result-count { color: hsl(var(--muted-foreground)); }
.woocommerce .woocommerce-ordering select {
  padding: 0.5rem 0.75rem; border: 1px solid hsl(var(--input)); border-radius: 0.5rem; font: inherit;
}

/* ---------- Spec table (single product) ---------- */
/* Specifications — icon-card grid (ref variantas-4). */
.sodnamis-specs { display: grid; grid-template-columns: 1fr; gap: 0.75rem; margin: 1rem 0; }
@media (min-width: 600px) { .sodnamis-specs { grid-template-columns: 1fr 1fr; } }
.sodnamis-specs__item { display: flex; align-items: center; gap: 0.7rem; padding: 0.75rem 0.9rem; border: 1px solid hsl(var(--border)); border-radius: 0.6rem; background: hsl(var(--secondary) / 0.4); }
.sodnamis-specs__icon { flex: 0 0 auto; display: grid; place-content: center; width: 2.25rem; height: 2.25rem; border-radius: 0.5rem; background: hsl(var(--background)); color: hsl(var(--primary)); }
.sodnamis-specs__img { width: 20px; height: 20px; object-fit: contain; display: block; }
.sodnamis-specs__text { display: grid; line-height: 1.3; min-width: 0; }
.sodnamis-specs__key { font-size: 0.75rem; color: hsl(var(--muted-foreground)); }
.sodnamis-specs__val { font-family: var(--font-heading); font-weight: 600; color: hsl(var(--foreground)); }

/* ---------- Magento PageBuilder responsive image variants (imported descriptions) ----------
   Description blocks carry both a desktop icon (.pagebuilder-mobile-hidden) and a mobile
   icon (.pagebuilder-mobile-only). Without these rules both render at every width. */
.pagebuilder-mobile-only { display: none; }
@media (max-width: 768px) {
	.pagebuilder-mobile-hidden { display: none; }
	.pagebuilder-mobile-only { display: inline-block; }
}

/* ---------- Single product — variantas-4 layout ---------- */
/* The override wraps a full-width .sodnamis-product__gallery and a 2-col
   .sodnamis-product__body inside div.product. Keep div.product a plain block so it
   never imposes a grid of its own on top of the body's own columns (WC core styles
   can otherwise lay .product out). The real grid lives on .sodnamis-product__body. */
.single-product div.product { display: block; }
/* .woocommerce-product-gallery floats its viewport internally; the previous grid on div.product
   happened to contain those floats as a side effect. Now that div.product is block, give the
   gallery wrapper its own block-formatting-context so it doesn't collapse to 0 height and push
   .sodnamis-product__body out of normal flow. */
.sodnamis-product__gallery { margin-bottom: 2rem; display: flow-root; }
/* WooCommerce's core zoom plugin (jquery.zoom.js, wc-product-gallery-zoom theme support)
   appends a full-resolution <img class="zoomImg"> as a SIBLING of the featured image's <a>
   (not a descendant), absolutely positioned to cover it, opacity:0 until hover. It never sets
   pointer-events on that overlay. That's harmless on stock (small) galleries, but this
   variantas-4 layout makes the featured image the full-width hero — so the overlay's hit area
   now covers the entire hero, and it sits ABOVE the <a> in paint order without being inside it,
   which means click events landing on the hero never bubble through the anchor: the lightbox
   trigger silently no-ops when a visitor clicks the big image itself (thumbnails/the search-icon
   trigger are unaffected, since they're not the zoom target). Let clicks pass through to the
   real anchor underneath. */
.single-product .woocommerce-product-gallery .zoomImg { pointer-events: none; }
.sodnamis-product__body { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 900px) {
  .sodnamis-product__body { grid-template-columns: minmax(0,1fr) 360px; align-items: start; }
  /* Left column stacks main → extra (warranty/financing/tabs) → related; the sticky
     buy-card spans all three rows on the right. Mobile keeps source order
     (main → aside → extra → related) so the buy-card follows the configurator
     summary (E19) and sits above "Panašūs nameliai". */
  .sodnamis-product__main { grid-column: 1; grid-row: 1; }
  .sodnamis-product__aside { grid-column: 2; grid-row: 1 / span 3; }
  .sodnamis-product__extra { grid-column: 1; grid-row: 2; }
  .sodnamis-product__body > .related.products { grid-column: 1; grid-row: 3; }
}
.sodnamis-product__extra { display: flex; flex-direction: column; gap: 2rem; }
/* Main column = uniform 2rem (32px) rhythm between blocks (ref space-y-8);
   the title cluster is one block, so its internal spacing stays tight. */
.sodnamis-product__main { display: flex; flex-direction: column; gap: 2rem; }
.sodnamis-product__title { font-size: 2.25rem; line-height: 1.1; letter-spacing: -0.9px; margin: 0 0 0.25rem; }
.sodnamis-product__eyebrow { color: hsl(var(--muted-foreground)); margin: 0 0 1rem; }
/* Dividers bracket the chips (ref: eyebrow → divider → chips → divider → about). */
/* variantas-4: flex flex-wrap gap-6 py-6 border-y; each item = icon + label/value. */
.spec-bar { list-style: none; display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 0 0 1.5rem; padding: 1.5rem 0; border-top: 1px solid hsl(var(--border)); border-bottom: 1px solid hsl(var(--border)); }
.spec-bar__item { display: flex; align-items: center; gap: 0.75rem; }
/* variantas-4: 48px rounded-xl icon tile, primary tint bg + primary icon (24px). */
.spec-bar__icon { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 0.75rem; background: hsl(var(--primary) / 0.1); color: hsl(var(--primary)); }
.spec-bar__icon--accent { background: hsl(var(--accent) / 0.2); color: hsl(var(--accent)); }
.spec-bar__icon svg { width: 24px; height: 24px; }
.spec-bar__text { display: flex; flex-direction: column; line-height: 1.3; }
.spec-bar__key { font-size: 0.875rem; color: hsl(var(--muted-foreground)); }
.spec-bar__val { font-weight: 600; color: hsl(var(--foreground)); }
/* Korekcijos #4: on phones the flex-wrap left the 4th tile floating; a 2x2 grid keeps them aligned. */
@media (max-width: 640px) { .spec-bar { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } }
.sod-cfg__total-note { font-size: 0.8rem; font-weight: 400; color: hsl(var(--muted-foreground)); margin-left: 0.25rem; }
.sod-cfg__total-note:empty { margin-left: 0; }
.sodnamis-product__about { margin: 0; }
/* Share button — top-right of the title block (ruttl UodCg0TW). */
.sodnamis-product__head { position: relative; padding-right: 3.5rem; }
.sodnamis-share { position: absolute; top: 0; right: 0; display: grid; place-content: center; width: 2.75rem; height: 2.75rem; border: 1px solid hsl(var(--border)); border-radius: 50%; background: hsl(var(--background)); color: hsl(var(--foreground)); cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease; }
.sodnamis-share:hover, .sodnamis-share:focus-visible { background: hsl(var(--secondary) / 0.6); border-color: hsl(var(--primary)); outline: none; }
/* Warranty trust block — now after the configurator (email E16), a bordered card
   like lovable; both it and the configurator get a primary-tinted border + fill. */
.sod-cfg { padding: 1.5rem; border: 1px solid hsl(var(--primary) / 0.2); border-radius: 1rem; background: hsl(var(--secondary) / 0.3); }
.sodnamis-product__warranty { display: flex; align-items: center; gap: 0.7rem; padding: 1.5rem; border: 1px solid hsl(var(--primary) / 0.2); border-radius: 1rem; background: hsl(var(--secondary) / 0.4); color: hsl(var(--primary)); }
.sodnamis-product__warranty-text { display: grid; line-height: 1.3; }
.sodnamis-product__warranty-text strong { font-family: var(--font-heading); font-size: 0.95rem; color: hsl(var(--foreground)); }
.sodnamis-product__warranty-text span { font-size: 0.8rem; color: hsl(var(--muted-foreground)); }
/* Related products = catalog cards, 2-col (ruttl KVaW22p0/QzXuvOKw/n5adzL4p). */
.sodnamis-related { margin-top: 2rem; }
.sodnamis-related__title { font-size: 1.35rem; margin: 0 0 1.25rem; }
/* Korekcijos #2: the header is sticky too (z140, --header-height), so the card must start below it. */
@media (min-width: 900px) { .sodnamis-product__aside { position: sticky; top: calc(var(--header-height) + 1rem); } }
/* Buy card = ref „p-6 rounded-2xl bg-card border border-border shadow-lg". */
.sodnamis-product__card { padding: 1.5rem; border-radius: 1rem; border: 1px solid hsl(var(--border)); background: hsl(var(--card)); box-shadow: 0 10px 15px -3px hsl(0 0% 0% / 0.1), 0 4px 6px -4px hsl(0 0% 0% / 0.1); }
.sodnamis-product__ctas { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.75rem; }
.sodnamis-product__ctas .btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
.sodnamis-product__ctas .btn svg { flex: 0 0 auto; }
.btn--block { display: block; width: 100%; text-align: center; }
.btn--outline { background: transparent; border: 1px solid hsl(var(--primary)); color: hsl(var(--primary)); }
.btn--outline:hover { background: hsl(var(--primary) / 0.08); color: hsl(var(--primary)); }
/* expert card */
.expert-card { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid hsl(var(--border)); }
/* Rotation: every manager's card is in the page, only the current one shows. The explicit
   [hidden] rule matters — a class-level display would otherwise beat the UA default. */
.expert-card[hidden] { display: none; }
.expert-card__eyebrow { display: block; font-size: 0.8rem; color: hsl(var(--muted-foreground)); margin-bottom: 0.5rem; }
.expert-card__person { display: flex; align-items: center; gap: 0.75rem; }
.expert-card__photo { border-radius: 50%; width: 80px; height: 80px; object-fit: cover; flex: 0 0 auto; }   /* 80px circle like lovable (email E14) */
.expert-card__name { display: block; font-weight: 700; }
.expert-card__role { display: block; font-size: 0.8rem; color: hsl(var(--muted-foreground)); }
.expert-card__rating { display: flex; align-items: center; gap: 1px; margin-top: 3px; font-size: 0.8rem; color: hsl(var(--muted-foreground)); }
.expert-card__star { color: hsl(var(--border)); }
.expert-card__star.is-on { color: #f5a623; }   /* amber rating star (email E14) */
.expert-card__rating-num { margin-left: 5px; }
.expert-card__badges { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.75rem; }
.expert-card__badge { font-size: 0.72rem; font-weight: 600; padding: 0.25rem 0.6rem; border-radius: 9999px; background: hsl(var(--secondary) / 0.6); color: hsl(var(--foreground)); }
/* Bordered "Skambinti tiesiogiai" block with phone icon (ref variantas-4). */
.expert-card__call { display: flex; align-items: center; gap: 0.7rem; margin-top: 0.75rem; padding: 0.75rem 0.9rem; border: 1px solid hsl(var(--border)); border-radius: 0.6rem; }
.expert-card__call-icon { flex: 0 0 auto; width: 2.25rem; height: 2.25rem; display: grid; place-content: center; border-radius: 50%; background: hsl(var(--secondary) / 0.6); color: hsl(var(--primary)); }
.expert-card__call-text { display: grid; line-height: 1.3; min-width: 0; }
.expert-card__call-label { font-size: 0.72rem; color: hsl(var(--muted-foreground)); }
.expert-card__phone { font-weight: 700; color: hsl(var(--primary)); }

/* Related products = 2×2 (ref alva-3x4 "Recommended Products"); 1-col on phones
   so the cards don't cramp (matches the shop grid's mobile behaviour). */
@media (min-width: 640px) {
  .related.products ul.products,
  .up-sells.products ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
/* Configurator */
.sod-cfg__head h2 { margin: 0 0 1rem; font-size: 1.35rem; }
.sod-cfg__groups { display: grid; gap: 1.25rem; }
.sod-cfg__group { border: 0; margin: 0; padding: 0; }
/* Conditional groups (client spec p.6) are hidden until their parent option is chosen.
   Explicit so the rule does not depend on the UA stylesheet inside a grid container. */
.sod-cfg__group[hidden] { display: none; }
/* Standard/Premium + size switching between products (client spec p.1). */
.sodnamis-variants { display: grid; gap: .5rem; margin: .75rem 0 0; }
.sodnamis-variants__row { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.sodnamis-variants__legend { font-size: .8125rem; color: #6b7280; min-width: 6.5rem; }
.sodnamis-variants__opts { display: flex; flex-wrap: wrap; gap: .375rem; }
.sodnamis-variants__opt {
	display: inline-flex; align-items: baseline; gap: .375rem;
	padding: .3125rem .6875rem; border: 1px solid #d1d5db; border-radius: 999px;
	font-size: .875rem; line-height: 1.2; text-decoration: none; color: inherit; background: #fff;
}
.sodnamis-variants__opt:hover { border-color: #9ca3af; }
.sodnamis-variants__opt.is-current { background: #111827; border-color: #111827; color: #fff; }
.sodnamis-variants__note { font-size: .75rem; color: #6b7280; }
.sodnamis-variants__opt:hover .sodnamis-variants__note { color: inherit; }

/* Supplier colour swatch inside an option (client spec p.5/p.7). */
.sod-cfg__opt-swatch img { display: block; width: 28px; height: 28px; border-radius: 4px; object-fit: cover; }
/* variantas-4: font-heading text-lg font-medium text-foreground flex items-center gap-2. */
.sod-cfg__legend { display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-heading); font-weight: 500; font-size: 1.125rem; color: hsl(var(--foreground)); margin-bottom: 0.5rem; padding: 0; }
.sod-cfg__legend-icon { flex: 0 0 auto; color: hsl(var(--primary)); }
/* Per-group "?" help (variantas-4): tap to reveal a short description. */
.sod-cfg__help-btn { display: inline-flex; align-items: center; justify-content: center; margin-left: 0.15rem; padding: 0; color: hsl(var(--muted-foreground)); background: none; border: 0; cursor: pointer; line-height: 0; }
.sod-cfg__help-btn:hover, .sod-cfg__help-btn[aria-expanded="true"] { color: hsl(var(--primary)); }
.sod-cfg__help { margin: 0 0 0.75rem; padding: 0.7rem 0.9rem; font-size: 0.85rem; line-height: 1.5; color: hsl(var(--muted-foreground)); background: hsl(var(--secondary) / 0.5); border-radius: calc(var(--radius) - 4px); }
.sod-cfg__help[hidden] { display: none; }
/* Sticky mobile action bar (title + live price over add-to-cart + quote) —
   phones only. Matches variantas-4's taller mobile bar. */
.sodnamis-product__mobilebar { display: none; }
@media (max-width: 1023px) {
  .sodnamis-product__mobilebar {
    display: block;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 0.75rem 1.25rem calc(0.75rem + env(safe-area-inset-bottom, 0px));
    background: #fff; border-top: 1px solid hsl(var(--border));
    box-shadow: 0 -4px 20px hsl(0 0% 0% / 0.1);
  }
  /* Collapsible "Selected Options" panel — sits above the summary; because the bar is
     pinned to the bottom, expanding it grows the bar UPWARD while the base stays put. */
  .sodnamis-mobilebar__panel { max-height: 0; overflow: hidden; opacity: 0; padding: 0; border-bottom: 0 solid hsl(var(--border)); transition: max-height 0.3s ease, opacity 0.25s ease, margin 0.3s ease, border-bottom-width 0.3s ease; }
  .sodnamis-product__mobilebar.is-open .sodnamis-mobilebar__panel { max-height: 45vh; opacity: 1; overflow-y: auto; margin-bottom: 0.7rem; border-bottom-width: 1px; }
  .sodnamis-mobilebar__panel-title { margin: 0 0 0.45rem; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: hsl(var(--muted-foreground)); }
  .sodnamis-mobilebar__list { list-style: none; margin: 0 0 0.1rem; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; }
  .sodnamis-mobilebar__list li { display: flex; justify-content: space-between; gap: 0.75rem; font-size: 0.875rem; }
  .sodnamis-mobilebar__list li > span:first-child { color: hsl(var(--muted-foreground)); }
  .sodnamis-mobilebar__list li > span:last-child { font-weight: 600; text-align: right; color: hsl(var(--foreground)); }
  .sodnamis-mobilebar__summary { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.7rem; }
  .sodnamis-mobilebar__title { flex: 1 1 auto; min-width: 0; font-size: 0.9375rem; font-weight: 600; color: hsl(var(--foreground)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sodnamis-mobilebar__price { flex: 0 0 auto; font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; color: hsl(var(--primary)); white-space: nowrap; }
  .sodnamis-mobilebar__toggle { flex: 0 0 auto; width: 2rem; height: 2rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 0.4rem; background: transparent; color: hsl(var(--muted-foreground)); cursor: pointer; transition: transform 0.3s ease, color 0.15s ease; }
  .sodnamis-mobilebar__toggle:hover { color: hsl(var(--primary)); }
  .sodnamis-product__mobilebar.is-open .sodnamis-mobilebar__toggle { transform: rotate(180deg); color: hsl(var(--primary)); }
  .sodnamis-mobilebar__price del { display: none; }
  .sodnamis-mobilebar__price ins { text-decoration: none; }
  .sodnamis-mobilebar__actions { display: flex; gap: 0.6rem; }
  .sodnamis-product__mobilebar .btn { flex: 1 1 0; margin: 0; white-space: nowrap; height: 3rem; font-size: 1rem; display: inline-flex; align-items: center; justify-content: center; }
  .single-product .site-main { padding-bottom: 8.5rem; }
}
/* Option cards — ref „grid grid-cols-1 md:grid-cols-3 gap-3", label 16px/600,
   price 14px/500, padding 16px 20px, radius 12px. */
.sod-cfg__opts { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
@media (min-width: 768px) { .sod-cfg__opts { grid-template-columns: repeat(3, 1fr); } }
.sod-cfg__opt { display: grid; grid-template-columns: auto 1fr; align-items: start; column-gap: 0.6rem; row-gap: 0.2rem; padding: 1rem 1.25rem; border: 1px solid hsl(var(--border)); border-radius: 0.75rem; cursor: pointer; background: hsl(var(--background)); transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; }
/* Selected: emphasized (2px-look) primary border + faint fill — ref variantas-4. */
.sod-cfg__opt:has(input:checked) { border-color: hsl(var(--primary)); box-shadow: inset 0 0 0 1px hsl(var(--primary)); background: hsl(var(--primary) / 0.05); }
/* Native radio → a „varnelė" indicator that lights up (fills + check) when selected. */
.sod-cfg__opt input { appearance: none; -webkit-appearance: none; grid-column: 1; grid-row: 1; margin-top: 0.1rem; width: 1.35rem; height: 1.35rem; border: 2px solid hsl(var(--border)); border-radius: 50%; display: grid; place-content: center; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; }
.sod-cfg__opt input:checked { border-color: hsl(var(--primary)); background: hsl(var(--primary)); }
.sod-cfg__opt input:checked::after { content: ''; width: 0.68rem; height: 0.38rem; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translateY(-0.06rem); }
.sod-cfg__opt input:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 2px; }
.sod-cfg__opt-label { grid-column: 2; grid-row: 1; font-size: 1rem; font-weight: 600; }
.sod-cfg__opt-desc { grid-column: 2; grid-row: 2; font-size: 0.875rem; font-weight: 400; line-height: 1.35; color: hsl(var(--muted-foreground)); }
.sod-cfg__opt-price { grid-column: 2; grid-row: 3; font-size: 0.875rem; font-weight: 500; color: hsl(var(--muted-foreground)); margin-top: 0.15rem; }
/* Optional per-option leading icon (impregnation + raingutter groups, matching Lovable):
   insert a middle column for it and shift the text stack to column 3. */
.sod-cfg__opt:has(.sod-cfg__opt-icon) { grid-template-columns: auto auto 1fr; }
.sod-cfg__opt-icon { grid-column: 2; grid-row: 1 / 4; align-self: center; display: flex; color: hsl(var(--primary)); }
.sod-cfg__opt:has(.sod-cfg__opt-icon) .sod-cfg__opt-label,
.sod-cfg__opt:has(.sod-cfg__opt-icon) .sod-cfg__opt-desc,
.sod-cfg__opt:has(.sod-cfg__opt-icon) .sod-cfg__opt-price { grid-column: 3; }
.sod-cfg__summary { margin-top: 1.5rem; padding: 1.1rem 1.25rem; border-radius: 0.8rem; background: hsl(var(--secondary) / 0.4); }
.sod-cfg__summary h3 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.sod-cfg__summary-list { list-style: none; margin: 0 0 0.75rem; padding: 0; display: grid; gap: 0.3rem; }
.sod-cfg__summary-list li { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.875rem; color: hsl(var(--muted-foreground)); }
.sod-cfg__summary-list li span:last-child { color: hsl(var(--foreground)); text-align: right; }
.sod-cfg__total-row { display: flex; justify-content: flex-end; align-items: baseline; margin: 0.5rem 0 0; padding-top: 0.75rem; border-top: 1px solid hsl(var(--border)); }
/* Label left, amount flush right (client 2026-09-09 p.10). The quote note the JS may append
   is a third flex child, which space-between used to park the amount in the middle. */
.sod-cfg__total-row > span:first-child { margin-right: auto; }
.sod-cfg__total { font-family: var(--font-heading); font-size: 1.4rem; color: hsl(var(--primary)); }
.sod-cfg__warranty { margin: 0.75rem 0 0; font-size: 0.8rem; color: hsl(var(--muted-foreground)); }
.btn.is-emphasized { box-shadow: 0 0 0 3px hsl(var(--primary) / 0.25); }
/* Financing info band (static; monthly estimate + payment come from a plugin later). */
.sod-financing { border: 1px solid hsl(var(--border)); border-radius: 0.8rem; padding: 1.5rem; background: hsl(var(--secondary) / 0.3); }
.sod-financing h2 { margin: 0 0 0.5rem; font-size: 1.2rem; }
.sod-financing p { margin: 0 0 1rem; color: hsl(var(--muted-foreground)); }
/* Bigbank calculator: markup and skin are the bank's widget - assets/vendor/bigbank/bigbank.css. */
/* Colour steps as a swatch grid (client 2026-09-07 p.9). The lovable reference has no colour
   picker of its own, so this keeps its option-card feel: tile = swatch + name, selected = ring. */
/* Colour steps like Lovable's "Select Color" (client 2026-09-09 p.6): a sub-heading, big square
   swatches with the name underneath, the chosen one outlined with a check on the swatch. A
   price shows only when a colour costs more (impregnation white). Two columns on phones. */
.sod-cfg__group--colour { margin-top: -0.25rem; }
.sod-cfg__group--colour .sod-cfg__legend { font-size: 0.95rem; font-weight: 500; color: hsl(var(--muted-foreground)); margin-bottom: 0.6rem; }
.sod-cfg__group--colour .sod-cfg__legend .sod-cfg__legend-icon { display: none; }
.sod-cfg__group--colour .sod-cfg__opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 0.75rem; }
@media (max-width: 640px) { .sod-cfg__group--colour .sod-cfg__opts { grid-template-columns: repeat(2, 1fr); } }
.sod-cfg__group--colour .sod-cfg__opt { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.5rem; padding: 0.6rem; }
.sod-cfg__group--colour .sod-cfg__opt-swatch { display: block; width: 100%; }
.sod-cfg__group--colour .sod-cfg__opt-swatch img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; border-radius: 0.5rem; object-fit: cover; }
.sod-cfg__group--colour .sod-cfg__opt-swatch--solid { aspect-ratio: 1 / 1; border-radius: 0.5rem; background: var(--sod-sw, hsl(var(--border))); box-shadow: inset 0 0 0 1px hsl(var(--border)); }
.sod-cfg__group--colour .sod-cfg__opt-label { font-size: 0.85rem; font-weight: 500; line-height: 1.25; overflow-wrap: anywhere; }
.sod-cfg__group--colour .sod-cfg__opt-price { margin: 0; font-size: 0.8rem; }
.sod-cfg__group--colour .sod-cfg__opt-price:empty { display: none; }
.sod-cfg__group--colour .sod-cfg__opt input { position: absolute; top: 1rem; right: 1rem; margin: 0; background: hsl(var(--background)); }
.sod-cfg__group--colour .sod-cfg__opt input:checked { background: hsl(var(--primary)); }
.sod-cfg__group--colour .sod-cfg__opt:has(input:checked) { outline: 2px solid hsl(var(--primary)); outline-offset: -2px; }
/* Product info accordion (replaces horizontal tabs; ref „w-full space-y-3"). */
.sod-acc { display: grid; gap: 0.75rem; }
.sod-acc__item { border: 1px solid hsl(var(--border)); border-radius: 0.6rem; background: hsl(var(--background)); }
.sod-acc__summary { list-style: none; cursor: pointer; padding: 1rem 1.25rem; font-family: var(--font-heading); font-weight: 600; font-size: 1.05rem; display: flex; align-items: center; justify-content: space-between; }
.sod-acc__summary::-webkit-details-marker { display: none; }
.sod-acc__summary::after { content: ''; flex: 0 0 auto; width: 0.55rem; height: 0.55rem; margin-left: 1rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 0.2s ease; }
.sod-acc__item[open] .sod-acc__summary::after { transform: rotate(-135deg) translateY(2px); }
.sod-acc__panel { padding: 0 1.25rem 1.25rem; }
.sod-acc__panel .sodnamis-specs { margin: 0; }
/* Aprašymas (description) content — match variantas-4 „About This Home": muted
   prose at 18px/1.625, foreground headings, space-y-4 (16px) rhythm. The imported
   content leads with a duplicate „Aprašymas" H2 (the accordion is already titled) —
   hide it so the section reads like the ref (single heading → prose). */
.sod-acc__item--description .sod-acc__panel { color: hsl(var(--muted-foreground)); font-size: 1.125rem; line-height: 1.625; }
.sod-acc__item--description .sod-acc__panel > h2:first-child { display: none; }
.sod-acc__item--description .sod-acc__panel > * { margin: 0; }
.sod-acc__item--description .sod-acc__panel > * + * { margin-top: 1rem; }
.sod-acc__item--description .sod-acc__panel :where(p, li, div) { font-size: 1.125rem; line-height: 1.625; }
.sod-acc__item--description .sod-acc__panel :where(h2, h3, h4) { color: hsl(var(--foreground)); font-family: var(--font-heading); font-weight: 600; }
.sod-acc__item--description .sod-acc__panel h2 { font-size: 1.5rem; line-height: 1.3; }
.sod-acc__item--description .sod-acc__panel :where(h3, h4) { font-size: 1.125rem; }
.sod-acc__item--description .sod-acc__panel strong { color: hsl(var(--foreground)); }
.sod-acc__item--description .sod-acc__panel img { max-width: 100%; height: auto; border-radius: var(--radius); }
/* Užsakymo procesas — numbered steps (ref variantas-4 „Details"). */
.sod-order { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.sod-order__step { display: grid; grid-template-columns: auto 1fr; column-gap: 1rem; align-items: start; padding: 1rem 1.25rem; border: 1px solid hsl(var(--border)); border-radius: 0.75rem; }
.sod-order__badge { display: grid; justify-items: center; gap: 0.35rem; }
.sod-order__icon { width: 2.5rem; height: 2.5rem; display: grid; place-content: center; border-radius: 0.6rem; background: hsl(var(--secondary) / 0.5); color: hsl(var(--primary)); }
.sod-order__num { font-size: 0.7rem; font-weight: 600; color: hsl(var(--muted-foreground)); }
.sod-order__title { font-family: var(--font-heading); font-size: 1.05rem; font-weight: 600; margin: 0 0 0.35rem; color: hsl(var(--foreground)); }
.sod-order__desc { margin: 0; font-size: 1.125rem; line-height: 1.6; color: hsl(var(--muted-foreground)); }
/* Related products sit in the left grid column → 2-col there = smaller cards (ref).
   margin-top:0 because the body grid row-gap already provides the 2rem rhythm. */
.sodnamis-product__body > .related.products { margin-top: 0; }
/* Add-to-cart toast — single bubble, bottom-right (no WC notice on AJAX add). */
/* WC appends a "Krepšelis" link under loop/related ajax buttons — we use the toast. */
.added_to_cart { display: none !important; }
.sod-toast { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 400; max-width: 340px; display: flex; flex-direction: column; gap: 0.35rem; padding: 1rem 1.25rem; border-radius: 0.75rem; background: hsl(var(--primary)); color: #fff; box-shadow: 0 10px 15px -3px hsl(0 0% 0% / 0.18), 0 4px 6px -4px hsl(0 0% 0% / 0.18); opacity: 0; transform: translateY(12px); transition: opacity 0.25s ease, transform 0.25s ease; }
.sod-toast.is-visible { opacity: 1; transform: translateY(0); }
.sod-toast--err { background: hsl(var(--destructive)); }
.sod-toast__msg { font-family: var(--font-heading); font-weight: 600; }
.sod-toast__meta { font-size: 0.8125rem; color: hsl(0 0% 100% / 0.85); }
.sod-toast__link { color: #fff; text-decoration: underline; font-size: 0.875rem; }
@media (max-width: 480px) { .sod-toast { right: 0.75rem; left: 0.75rem; bottom: 0.75rem; max-width: none; } }
/* product FAQ (DUK tab) */
.sodnamis-faq__item { border-bottom: 1px solid hsl(var(--border)); padding: 0.6rem 0; }
.sodnamis-faq__item summary { cursor: pointer; font-weight: 600; }
.sodnamis-faq__a { padding: 0.5rem 0 0; color: hsl(var(--muted-foreground)); }

/* ---------- Single product — variantas-4 polish (gallery, badges, buy card) ---------- */
/* Gallery = main slider (left, fixed 4:3) + up to 4 thumbnails (right, 2×2), ref
   variantas-4. WC gallery slider (flexslider) gives the slider + hover-zoom +
   lightbox; extra images (5+) stay in the slider, only the first 4 thumbs show. */
.sodnamis-product__gallery { position: relative; }
.sodnamis-product__gallery .woocommerce-product-gallery {
  width: 100% !important; float: none; margin: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; align-items: start;
}
/* Main slider — left column. */
.sodnamis-product__gallery .flex-viewport { grid-column: 1; grid-row: 1; position: relative; border-radius: var(--radius); overflow: hidden; }
.sodnamis-product__gallery .woocommerce-product-gallery__wrapper { margin: 0; }
.sodnamis-product__gallery .woocommerce-product-gallery__image { aspect-ratio: 4 / 3; }
.sodnamis-product__gallery .woocommerce-product-gallery__image a { display: block; height: 100%; }
.sodnamis-product__gallery .woocommerce-product-gallery__image img {
  /* height:100% must beat WooCommerce core's `img { height:auto }` (higher
     specificity), or the image keeps its natural ratio and leaves whitespace
     below it inside the 4:3 frame. */
  width: 100%; height: 100% !important; object-fit: cover; border-radius: var(--radius); display: block; box-shadow: none;
}
/* Thumbnails — right column, 2×2, capped at 4 (extras remain in the slider). */
.sodnamis-product__gallery .flex-control-thumbs {
  grid-column: 2; grid-row: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;
  margin: 0; padding: 0; list-style: none; align-content: start;
}
/* Override flexslider/WC's `width:25%;float:left` on the thumb <li> (higher
   specificity than a plain class chain) so each stretches to fill its grid cell. */
.sodnamis-product__gallery .flex-control-thumbs li { position: relative; width: 100% !important; float: none !important; margin: 0; line-height: 0; }
.sodnamis-product__gallery .flex-control-thumbs li:nth-child(n+5) { display: none; }
/* "+N" overlay on the 4th thumbnail — opens the full-screen lightbox gallery. */
.sodnamis-thumb-more {
  position: absolute; inset: 0; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius); cursor: pointer;
  background: hsl(220 30% 10% / 0.62); color: #fff;
  font-size: 1.15rem; font-weight: 700; line-height: 1;
  transition: background 0.15s ease;
}
.sodnamis-thumb-more:hover,
.sodnamis-thumb-more:focus-visible { background: hsl(220 30% 10% / 0.74); outline: none; }
.sodnamis-product__gallery .flex-control-thumbs img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius);
  cursor: pointer; opacity: 0.7; transition: opacity 0.15s ease; box-shadow: none;
}
.sodnamis-product__gallery .flex-control-thumbs img.flex-active,
.sodnamis-product__gallery .flex-control-thumbs img:hover { opacity: 1; }
@media (max-width: 767px) {
  .sodnamis-product__gallery .woocommerce-product-gallery { grid-template-columns: 1fr; }
  .sodnamis-product__gallery .flex-control-thumbs { grid-column: 1; grid-row: 2; grid-template-columns: repeat(4, 1fr); }
}
/* Sale badges over the featured (left half): "Akcija" top-left, "-N%" at its right edge.
   35px on the product page (client); scaled down proportionally on mobile below. */
.sodnamis-product__gallery span.onsale { position: absolute; top: 0.9rem; left: 0.9rem; right: auto; z-index: 3; font-size: 2.1875rem; padding: 0.35rem 0.9rem; }
.sodnamis-product__gallery span.onsale.onsale--pct { left: auto; right: calc(50% + 1rem); background: hsl(var(--destructive)); }
/* Mobile (single-column gallery): proportionally smaller badges + "-N%" pinned to the
   far right so it doesn't overlap "Akcija". Placed AFTER the desktop rules so it wins
   on equal specificity. */
@media (max-width: 767px) {
  .sodnamis-product__gallery span.onsale { font-size: 1.5rem; padding: 0.3rem 0.7rem; }
  .sodnamis-product__gallery span.onsale.onsale--pct { left: auto; right: 0.9rem; }
}
/* ---- Before the slider script runs (2026-09-18, CLS 0.21 → 0, LCP −1.5 s) ----
   WooCommerce ships the gallery at opacity 0 and stacks images 2..n as 25 % inline
   thumbnails until flexslider rebuilds them; the rebuild moved the whole page body up
   150 px on phones. The wrapper is a DIRECT child of the gallery only before init
   (flexslider wraps it in .flex-viewport), so these rules lay the images out in the
   same grid the slider ends up with — main 4:3 left, four 4:3 thumbs right (2×2) — and
   the gallery is shown at once, so the first image is the LCP element from the first
   paint instead of after jQuery. */
/* Client 2026-09-25: with opacity forced to 1 the flexslider initialisation was visible (the image
   slid in from outside the frame). WooCommerce fades the gallery in after init; the box keeps its
   height meanwhile, so CLS stays at 0 without showing the pre-init state. */
.sodnamis-product__gallery .woocommerce-product-gallery { opacity: 0; transition: opacity .2s ease; }
.sodnamis-product__gallery .woocommerce-product-gallery.flexslider,
.sodnamis-product__gallery .woocommerce-product-gallery:has(.flex-viewport) { opacity: 1; }
/* The gallery box keeps its final height through the slider's rebuild (flexslider empties the
   wrapper for a frame while it measures): desktop = main 4:3 image at half width → 8:3 overall;
   phones = main 4:3 + one row of four 4:3 thumbs → ≈16:15. Content taller than that still grows the box. */
.sodnamis-product__gallery .woocommerce-product-gallery { aspect-ratio: 8 / 3; }
@media (max-width: 767px) {
  .sodnamis-product__gallery .woocommerce-product-gallery { aspect-ratio: 21 / 20; } /* 0.9375·W + 12px gap ≈ W·20/21 for 320–430px phones */
}
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
  display: grid; grid-template-columns: minmax(0, calc(50% - 0.375rem)) minmax(0, 1fr) minmax(0, 1fr); gap: 0.75rem; grid-column: 1 / -1; /* main = exactly the slider's half-width column */
}
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image { width: 100% !important; display: block !important; margin: 0; min-width: 0; } /* !important: beats WooCommerce's nth-child(n+2){width:25%;display:inline-block} */
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:first-child { grid-column: 1; grid-row: 1 / span 2; }
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:nth-child(n+2) { background: hsl(var(--muted)); border-radius: var(--radius); } /* skeleton — the slider's thumbs are images 1–4, ours would be 2–5 */
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:nth-child(n+2) img { visibility: hidden; }
.sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:nth-child(n+6) { display: none !important; }
@media (max-width: 767px) {
  .sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sodnamis-product__gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:first-child { grid-column: 1 / -1; grid-row: 1; }
}

/* Hide WC's zoom magnifier trigger — it sits top-right where the -% badge goes,
   and the whole featured image already opens the lightbox on click. */
.sodnamis-product__gallery .woocommerce-product-gallery__trigger { display: none; }
/* Image counter — bottom-right of the slider; Watch Tour bottom-left. Both the
   counter and the arrows are relocated into .flex-viewport by main.js, so they
   anchor to the actual slider box (correct on mobile too). */
.sodnamis-gallery__counter {
  position: absolute; right: 0.9rem; bottom: 0.9rem; z-index: 3; pointer-events: none;
  background: hsl(220 30% 10% / 0.65); color: #fff; font-size: 0.8rem; font-weight: 600;
  padding: 0.25rem 0.7rem; border-radius: 9999px;
}
/* Prev/next arrows over the main slider (WC disables flexslider's own). */
.sodnamis-gallery__nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  display: flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; padding: 0 0 0.15rem; border: 0; border-radius: 9999px;
  background: hsl(0 0% 100% / 0.9); color: hsl(var(--foreground));
  font-size: 1.6rem; line-height: 1; cursor: pointer;
  box-shadow: 0 2px 8px hsl(220 30% 10% / 0.18); transition: background 0.15s ease;
}
.sodnamis-gallery__nav:hover { background: #fff; }
.sodnamis-gallery__nav--prev { left: 0.75rem; }
.sodnamis-gallery__nav--next { right: 0.75rem; }
/* Watch Tour button + video modal (variantas-4). */
.sodnamis-tour {
  position: absolute; left: 0.9rem; bottom: 0.9rem; z-index: 4;
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.45rem 0.9rem; border: 0; border-radius: 9999px;
  background: hsl(220 30% 10% / 0.65); color: #fff;
  font-family: var(--font-heading); font-weight: 600; font-size: 0.85rem;
  cursor: pointer; backdrop-filter: blur(4px); transition: background 0.2s ease;
}
.sodnamis-tour:hover { background: hsl(220 30% 10% / 0.85); color: #fff; }
.sodnamis-tour-modal { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; padding: 1.5rem; background: hsl(0 0% 0% / 0.85); }
.sodnamis-tour-modal[hidden] { display: none; }
.sodnamis-tour-modal__inner { width: min(1000px, 100%); aspect-ratio: 16 / 9; background: #000; border-radius: var(--radius); overflow: hidden; }
.sodnamis-tour-modal__inner .sod-video-embed { width: 100%; height: 100%; border: 0; display: block; }
.sodnamis-tour-modal__close { position: absolute; top: 1rem; right: 1.5rem; width: 2.5rem; height: 2.5rem; font-size: 2rem; line-height: 1; color: #fff; background: none; border: 0; cursor: pointer; }
/* Buy card: "Kaina nuo" label + green full-width add-to-cart (houses have no qty). */
.sodnamis-product__price-label { display: block; font-size: 0.85rem; color: hsl(var(--muted-foreground)); margin-bottom: 0.1rem; }
/* 45px current price on the product page (client). Specificity deliberately exceeds
   WooCommerce core's `.woocommerce div.product p.price` (~1.6em) so it actually wins. */
.woocommerce div.product .sodnamis-product__card .price { font-size: 2.8125rem; line-height: 1.1; margin-bottom: 1rem; }
.sodnamis-product__card form.cart { display: block; margin-bottom: 0; }
.sodnamis-product__card form.cart .quantity { display: none; }
.sodnamis-product__card .single_add_to_cart_button.button.alt { display: block; width: 100%; height: 3rem; background: hsl(var(--success)); border-color: transparent; }
.sodnamis-product__card .single_add_to_cart_button.button.alt:hover { background: hsl(var(--success) / 0.9); }

/* ---------- Cart & Checkout blocks — theme buttons + accents ---------- */
/* WC block buttons use a doubled-class selector for specificity; match it so the
   filled "Apmokėti" / "Pateikti užsakymą" buttons become the theme's navy pill. */
.wc-block-components-button.wc-block-components-button.contained {
  background: hsl(var(--primary)); color: #fff;
  border-radius: var(--radius); font-family: var(--font-body); font-weight: 600;
  box-shadow: var(--shadow-button); text-transform: none; letter-spacing: normal;
}
.wc-block-components-button.wc-block-components-button.contained:hover { background: hsl(var(--accent)); color: #fff; }
.wc-block-components-button.wc-block-components-button.contained:focus { box-shadow: 0 0 0 3px hsl(var(--primary) / 0.35); }
/* Block section titles in the heading font, links in the brand colour. */
.wc-block-components-title { font-family: var(--font-heading); }
.wc-block-components-checkout-step__title { font-family: var(--font-heading); }
.wp-block-woocommerce-cart a, .wp-block-woocommerce-checkout a { color: hsl(var(--primary)); }

/* Contract p.7 — direct-purchase limit: above it the basket button is replaced by the quote note. */
.sodnamis-product__card.is-over-limit form.cart,
.sodnamis-product__card.is-over-limit .single_add_to_cart_button { display: none; }
.sodnamis-product__limit-note { margin: 0.75rem 0 0; padding: 0.75rem 0.9rem; border-radius: 0.5rem; background: hsl(var(--muted)); color: hsl(var(--foreground)); font-size: 0.9rem; line-height: 1.45; }
.sodnamis-product__limit-note[hidden] { display: none; }
