@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Roboto+Slab:wght@500;600;700;800&display=swap');
/* ============================================================================
   PONOŽKOVNA.cz — Detail produktu, redesign (override vrstva)
   ----------------------------------------------------------------------------
   Cílí VÝHRADNĚ na body.type-detail (Shoptet Dolomit, template-11).
   Design systém v3 — claude.design. Žádné generické třídy, scoped pono-pd-*.
   Pár: pono-detail.css (tato) + pono-detail.js (DOM restrukturalizace).

   Scoping pravidlo (anti-FOUC):
   - Strukturální layout (grid) cílí body.type-detail .p-detail — platí HNED,
     bez čekání na JS, takže žádný flash nativního Bootstrap layoutu.
   - Cokoliv, co závisí na DOM přesunu, je gated .p-detail.pono-pd (JS doběhl).
     Když JS selže, .pono-pd se nepřidá → nativní H1 zůstane viditelný.

   Verze: 0.9 — V0 + V1 + V2 + V3 + V4 + V5 + V6 + V7 mobil.
   ============================================================================ */

/* ── design tokeny ───────────────────────────────────────────────────────── */
body.type-detail {
  --pono-yellow:#F5C842;  --pono-yellow-dk:#E5B82E;  --pono-yellow-soft:#FFF8E0;
  --pono-price-bg:#FBEFC9;
  --pono-navy:#1B2C4A;    --pono-navy-dk:#0F1B31;
  --pono-red:#D64545;     --pono-red-soft:#FCECEC;
  --pono-green:#2F7D4F;   --pono-green-soft:#E8F3EC;
  --pono-ink:#1A1A1A;     --pono-text:#2B2B2B;       --pono-muted:#6F6F6F;
  --pono-border:#E8E6E1;  --pono-rule:#F0EEE8;
  --pono-cream:#FAF7F0;   --pono-paper:#FFFFFF;
  --pono-sans:'DM Sans',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --pono-serif:'Roboto Slab',Georgia,'Times New Roman',serif;
}

/* ── base ────────────────────────────────────────────────────────────────── */
body.type-detail .p-detail,
body.type-detail .p-detail * { box-sizing: border-box; }
body.type-detail .p-detail { font-family: var(--pono-sans); color: var(--pono-text); }

/* ── hlavní grid: 72px thumbs | obrázek | 420px buy panel ────────────────────
   platí HNED. V0: obrázek spanuje thumbs+obrázek (1/3), sloupec thumbs naplní V3. */
body.type-detail .p-detail .product-top {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 420px;
  gap: 20px;
  align-items: start;
  margin: 18px 0 0;          /* žádné max-width + auto margin — dědit šířku nativního containeru,
                                jinak vznikne 95 px gap proti breadcrumb/footer */
}
body.type-detail .p-detail .product-top > div[class*="col-"] {
  float: none; width: auto; max-width: none;
  padding-left: 0; padding-right: 0; margin: 0;
}
/* badge/info řádek přes celou šířku */
body.type-detail .p-detail .product-top > .col-xs-12:not(.p-image-wrapper):not(.p-info-wrapper) {
  grid-column: 1 / -1;
}
body.type-detail .p-detail .p-image-wrapper { grid-column: 1 / 3; }
body.type-detail .p-detail .p-info-wrapper  { grid-column: 3 / 4; }

/* ── H1 přesunutý do buy panelu (gated — až JS doběhne) ──────────────────── */
body.type-detail .p-detail.pono-pd .p-detail-inner-header { display: none; }
body.type-detail .p-detail.pono-pd .pono-pd-head { margin-bottom: 12px; }
body.type-detail .p-detail.pono-pd .pono-pd-brand {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--pono-muted);
}
body.type-detail .p-detail.pono-pd .pono-pd-title {
  font-family: var(--pono-serif);
  font-size: 34px; font-weight: 700; line-height: 1.12;
  letter-spacing: -0.02em; color: var(--pono-ink);
  margin: 4px 0 0;
}

/* ════════════════════════════════════════════════════════════════════════════
   V1 — BUY PANEL
   ════════════════════════════════════════════════════════════════════════════ */

/* ── panel: sticky ───────────────────────────────────────────────────────── */
body.type-detail .p-detail.pono-pd .p-info-wrapper {
  position: sticky; top: 16px; align-self: start;
}

/* ── dostupnost / sklad ──────────────────────────────────────────────────── */
body.type-detail .p-detail.pono-pd .availability-value {
  font-size: 12.5px; margin: 0 0 12px; line-height: 1.5;
}
body.type-detail .p-detail.pono-pd .availability-value .availability-label { font-weight: 700; }
body.type-detail .p-detail.pono-pd .availability-value .delivery-line {
  margin-top: 4px; color: var(--pono-muted); font-size: 14px;
}
body.type-detail .p-detail.pono-pd .availability-value .shipping-options {
  color: var(--pono-ink); font-weight: 600; text-decoration: underline;
}
/* skrýt default-variant placeholder "Zvolte variantu" — působí jako pseudo-nadpis.
   Po výběru varianty se objeví konkrétní choose-variant.no-display.N (toggle Dolomit). */
body.type-detail .p-detail.pono-pd .availability-value .choose-variant.default-variant,
body.type-detail .p-detail.pono-pd .delivery-time .choose-variant.default-variant {
  display: none !important;
}
/* skrýt celý "Kód: …" řádek dokud není vybrána varianta — tj. dokud má body class
   disabled-add-to-cart (Dolomit nastavuje při chybějícím variant selection).
   Po výběru varianty Shoptet doplní reálný kód varianty a my .p-code zobrazíme. */
body.type-detail.disabled-add-to-cart .p-detail.pono-pd .p-code {
  display: none !important;
}

/* ── žlutý price block (REBEL horizontal, Koncept 1) ──────────────────────────
   Princip: TŘI ceny na JEDNÉ řadě (MOC strike → current strike → coupon bold)
   + chip se "s kódem" PŘILEPENÝ INLINE na coupon cenu. Hierarchii řeší
   VÁHA (thin → thin → 800) a BARVA (muted → muted → ink), ne plošná velikost
   — proto se vše vejde nowrap do 388px buy panelu včetně chipu.
   Pod tím tichý meta řádek (sleva % · countdown) a unit (/ks) jako mikro-řádek.

   Stavy:
     A) standard + current + coupon  → 9̶9̶ 7̶7̶ [49] 〈chip〉 / -37% · countdown
     B) current + coupon (no MOC)    → 9̶2̶0̶ [580] 〈chip〉 / -37% · countdown
     C) single (no coupon, no MOC)   → 2 712 / ks (žádný strike, žádný chip)
     D) standard + current (sale)    → 9̶9̶ [77 red] / -22% (žádný chip)

   Nativní .p-final-price-wrapper + #shkDiscountPromoExtension zůstávají v DOM
   offscreen (microdata + Shoptet click flow). Chip volá .click() na hidden
   __promoCode aby se Shoptet aplikoval kód při Add to Cart.
   ─────────────────────────────────────────────────────────────────────────── */

/* wrapper — žluté podloží, jedna karta která drží VŠECHNO (row + meta + unit).
   Sjednocený blok = bez vizuálního drobení (Roman: "nelíbí takto oddělený"). */
body.type-detail .p-detail.pono-pd .pono-pd-price {
  margin-bottom: 14px;
  background: var(--pono-price-bg);
  padding: 16px 18px 14px;
  display: flex; flex-direction: column;
}
/* nativní wrappery skryté offscreen, microdata zůstávají čitelná.
   pointer-events:auto = hidden __promoCode reaguje na JS .click() (Shoptet flow). */
body.type-detail .p-detail.pono-pd .p-final-price-wrapper,
body.type-detail .p-detail.pono-pd #shkDiscountPromoExtension {
  position: absolute !important; left: -9999px !important; top: auto !important;
  width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important;
  margin: 0 !important; padding: 0 !important;
  pointer-events: auto;
}

/* ROW — tři ceny + chip v jedné řadě, baseline aligned.
   gap = 10px, nowrap, chip flex-shrink: 0 aby zůstal celý.
   Když je chip přítomný + dlouhé ceny, data-size="long" zmenší current.
   font-feature tabular-nums = stejná šířka číslic pro stabilní rytmus. */
body.type-detail .p-detail.pono-pd .pono-pd-price-row {
  display: flex; align-items: baseline; gap: 10px;
  flex-wrap: nowrap; white-space: nowrap;
  font-family: var(--pono-sans);
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-tier { font-family: var(--pono-sans); }
/* MOC (standard) — strike, mikro, muted. Nese kontext "kolik to mělo původně stát". */
body.type-detail .p-detail.pono-pd .pono-pd-price-tier--standard {
  font-size: 14px; font-weight: 500; color: #9A9893;
  text-decoration: line-through; text-decoration-thickness: 1px;
}
/* CURRENT (cena bez kódu) — strike když je coupon (state A, B); jinak hero ink (state C, D).
   Modifier --is-final dělá z current finální cifru (žádný strike, ink, big bold). */
body.type-detail .p-detail.pono-pd .pono-pd-price-tier--current {
  font-size: 18px; font-weight: 500; color: var(--pono-muted);
  text-decoration: line-through; text-decoration-thickness: 1px;
  letter-spacing: -0.01em;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-tier--current.is-final {
  font-size: 30px; font-weight: 800; color: var(--pono-ink);
  text-decoration: none; letter-spacing: -0.02em;
}
/* CURRENT v sale módu (state D, bez kódu, ale s MOC) — finální cena, ale red. */
body.type-detail .p-detail.pono-pd .pono-pd-price-tier--current.is-sale {
  font-size: 30px; font-weight: 800; color: var(--pono-red);
  text-decoration: none; letter-spacing: -0.02em;
}
/* COUPON — finální cifra, největší a bold. ink (ne navy, aby kontrast vůči žluté byl plný). */
body.type-detail .p-detail.pono-pd .pono-pd-price-tier--coupon {
  font-size: 30px; font-weight: 800; color: var(--pono-ink);
  letter-spacing: -0.02em;
}

/* CHIP "s kódem A3HQI9" — JEMNÝ kupónový útržek, NE dark pilulka.
   Návrh (DETAIL-FIX-PUNCHLIST §6): "kód jako jemný chip (border)" =
   white background + dashed ink border na žlutém podkladu. Decentní,
   nenásilná prezentace; tmavý chip na žluté podloží byl "zlo".
   INLINE v řadě s cenami, flex-shrink: 0 = nikdy nezalomí.
   Click = trigger hidden Shoptet promoCode + copy to clipboard. */
body.type-detail .p-detail.pono-pd .pono-pd-price-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: #fff; color: var(--pono-ink);
  padding: 3px 8px 3px 9px; border-radius: 4px;
  border: 1px dashed rgba(26, 26, 26, 0.35);
  font-size: 11px; font-weight: 600; letter-spacing: 0.01em;
  cursor: pointer; user-select: none; line-height: 1.25;
  font-family: var(--pono-sans);
  transition: background .15s, border-color .15s, transform .1s;
  flex-shrink: 0; align-self: center;
  vertical-align: middle;
  box-shadow: none;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip:hover {
  background: #FFFDF5; border-color: var(--pono-ink);
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip:active { transform: scale(0.97); }
body.type-detail .p-detail.pono-pd .pono-pd-price-chip-label {
  color: var(--pono-muted); font-weight: 500;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip-code {
  color: var(--pono-ink);
  font-weight: 800; letter-spacing: 0.06em; font-size: 11.5px;
  font-family: 'JetBrains Mono', 'SF Mono', Consolas, monospace;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip-copy {
  width: 11px; height: 11px; opacity: .55; flex-shrink: 0;
  color: var(--pono-muted);
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip.is-copied {
  background: var(--pono-green-soft);
  border-color: var(--pono-green);
  border-style: solid;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-chip.is-copied .pono-pd-price-chip-code,
body.type-detail .p-detail.pono-pd .pono-pd-price-chip.is-copied .pono-pd-price-chip-label,
body.type-detail .p-detail.pono-pd .pono-pd-price-chip.is-copied .pono-pd-price-chip-copy {
  color: var(--pono-green); opacity: 1;
}

/* META — tichý řádek POD cenovou řadou: sleva % · countdown.
   Single line, decentní muted, čárkový separátor. Když není ani %, ani countdown, schovaný. */
body.type-detail .p-detail.pono-pd .pono-pd-price-meta {
  margin-top: 8px;
  font-size: 11.5px; color: var(--pono-muted); font-weight: 500;
  line-height: 1.4;
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-meta:empty { display: none; }
body.type-detail .p-detail.pono-pd .pono-pd-price-meta-pct {
  color: var(--pono-ink); font-weight: 700;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-meta-sep {
  opacity: .45;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-meta-countdown {
  color: var(--pono-muted);
}
body.type-detail .p-detail.pono-pd .pono-pd-price-meta-countdown-title {
  color: var(--pono-text); font-weight: 600;
}

/* UNIT — "/ ks" jako mikro suffix, jen na samostatném řádku úplně dole.
   Technický identifier, nepatří mezi marketingové ceny. */
body.type-detail .p-detail.pono-pd .pono-pd-price-unit {
  margin-top: 4px;
  font-size: 11px; color: var(--pono-muted); font-weight: 500;
}
body.type-detail .p-detail.pono-pd .pono-pd-price-unit:empty { display: none; }

/* auto-shrink pro velmi dlouhé ceny ("2 712 Kč") — když row přeteče 388px buy panel,
   data-size na .pono-pd-price postupně zmenší current+coupon, ale MOC zůstává malý. */
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="long"] .pono-pd-price-tier--coupon,
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="long"] .pono-pd-price-tier--current.is-final,
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="long"] .pono-pd-price-tier--current.is-sale {
  font-size: 26px;
}
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="long"] .pono-pd-price-tier--current {
  font-size: 16px;
}
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="long"] .pono-pd-price-tier--standard {
  font-size: 13px;
}
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="xlong"] .pono-pd-price-tier--coupon,
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="xlong"] .pono-pd-price-tier--current.is-final,
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="xlong"] .pono-pd-price-tier--current.is-sale {
  font-size: 22px;
}
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="xlong"] .pono-pd-price-tier--current {
  font-size: 14px;
}
body.type-detail .p-detail.pono-pd .pono-pd-price[data-size="xlong"] .pono-pd-price-row {
  gap: 8px;
}

/* legacy classy zůstávají pro případ, že naše extrakce selže (zachová alespoň cenu) */
body.type-detail .p-detail.pono-pd .pr-list-unit,
body.type-detail .p-detail.pono-pd .price-measure {
  font-size: 13px; font-weight: 500; color: var(--pono-muted);
}

/* ── variant slot (color-variants widget #pnz-main-container) ────────────── */
body.type-detail .p-detail.pono-pd .pono-pd-variants { margin: 14px 0; }
body.type-detail .p-detail.pono-pd .pono-pd-variants:empty { display: none; }

/* ── add to cart: qty stepper + navy CTA ─────────────────────────────────── */
body.type-detail .p-detail.pono-pd .add-to-cart {
  display: flex; gap: 8px; align-items: stretch; margin: 14px 0 0;
}
body.type-detail .p-detail.pono-pd .add-to-cart .quantity {
  display: flex; align-items: center; width: 116px; flex-shrink: 0;
  border: 1.5px solid var(--pono-border);
}
body.type-detail .p-detail.pono-pd .add-to-cart .quantity label { margin: 0; flex: 1; order: 2; }
body.type-detail .p-detail.pono-pd .add-to-cart .decrease { order: 1; }
body.type-detail .p-detail.pono-pd .add-to-cart .increase { order: 3; }
body.type-detail .p-detail.pono-pd .add-to-cart .increase-tooltip,
body.type-detail .p-detail.pono-pd .add-to-cart .decrease-tooltip { order: 0; }
body.type-detail .p-detail.pono-pd .add-to-cart input.amount {
  width: 100%; height: 48px; border: none; background: transparent;
  text-align: center; font-weight: 700; font-size: 15px;
  color: var(--pono-ink); font-family: var(--pono-sans);
}
body.type-detail .p-detail.pono-pd .add-to-cart .increase,
body.type-detail .p-detail.pono-pd .add-to-cart .decrease {
  width: 36px; height: 48px; padding: 0;
  background: none; border: none; cursor: pointer;
  font-size: 17px; color: var(--pono-ink);
  display: flex; align-items: center; justify-content: center;
}
body.type-detail .p-detail.pono-pd .add-to-cart .btn-conversion {
  flex: 1; min-height: 50px;
  background: var(--pono-navy); color: #fff;
  border: 1.5px solid var(--pono-navy); border-radius: 3px;
  font-family: var(--pono-sans); font-size: 14px; font-weight: 700;
  letter-spacing: 0.01em; cursor: pointer;
  transition: background .15s;
}
body.type-detail .p-detail.pono-pd .add-to-cart .btn-conversion:hover {
  background: var(--pono-navy-dk);
}
body.type-detail .p-detail.pono-pd.disabled-add-to-cart .add-to-cart .btn-conversion,
body.type-detail .p-detail.pono-pd .add-to-cart .btn-conversion[disabled],
body.type-detail .p-detail.pono-pd .add-to-cart .btn-conversion.disabled {
  background: var(--pono-muted); border-color: var(--pono-muted); cursor: not-allowed;
}

/* ── trust box ───────────────────────────────────────────────────────────── */
body.type-detail .p-detail.pono-pd .pono-pd-trust {
  margin-top: 16px; padding: 14px;
  border: 1px solid var(--pono-rule);
  display: grid; gap: 10px;
}
body.type-detail .p-detail.pono-pd .pono-pd-trust-row {
  display: flex; gap: 10px; align-items: flex-start; font-size: 14px;
}
body.type-detail .p-detail.pono-pd .pono-pd-trust-row svg {
  flex-shrink: 0; color: var(--pono-navy); margin-top: 1px;
}
body.type-detail .p-detail.pono-pd .pono-pd-trust-t { font-weight: 700; color: var(--pono-ink); }
body.type-detail .p-detail.pono-pd .pono-pd-trust-d { color: var(--pono-muted); margin-top: 1px; }

/* ── kód, parametry, social, skryté ──────────────────────────────────────── */
body.type-detail .p-detail.pono-pd .p-code {
  display: block; margin-top: 14px;
  font-size: 11px; color: var(--pono-muted);
}
body.type-detail .p-detail.pono-pd .detail-parameters {
  width: 100%; margin-top: 14px; font-size: 12.5px;
}
body.type-detail .p-detail.pono-pd .social-buttons-wrapper {
  margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--pono-rule);
}
body.type-detail .p-detail.pono-pd .pono-pd-hidden { display: none !important; }

/* ════════════════════════════════════════════════════════════════════════════
   V3 — GALERIE (CSS restrukturalizace, cloud-zoom uzly se nepřesouvají)
   ════════════════════════════════════════════════════════════════════════════ */

/* .p-image-wrapper = vnitřní grid: thumbs vlevo (72px) | obrázek vpravo */
body.type-detail .p-detail.pono-pd .p-image-wrapper {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 12px; align-items: start;
}
body.type-detail .p-detail.pono-pd .p-image-wrapper .p-image {
  grid-column: 2; grid-row: 1; margin: 0;
  border: 1px solid var(--pono-rule);
}
body.type-detail .p-detail.pono-pd .p-image-wrapper .p-thumbnails-wrapper {
  grid-column: 1; grid-row: 1; margin: 0; padding: 0; overflow: hidden;
}
body.type-detail .p-detail.pono-pd .p-image-wrapper .up-banner-wrapper {
  grid-column: 1 / -1; grid-row: 2; margin: 0;
}

/* thumbnaily vertikálně — vypnout horizontální carousel.
   Shoptet dává .p-thumbnails (class overflow-next/prev) margin-left:45px a vnitřní
   .p-thumbnails-inner má position:absolute (kotva pro horizontal slide animace).
   Reset margin + position aby thumb sloupec startoval na grid-column:1 left edge. */
body.type-detail .p-detail.pono-pd .p-thumbnails {
  margin: 0 !important; padding: 0 !important;
  width: 100% !important; height: auto !important;
  position: static !important;
  overflow: visible !important;
}
body.type-detail .p-detail.pono-pd .p-thumbnails-inner {
  width: 100% !important; height: auto !important;
  position: static !important;
  transform: none !important; left: auto !important; top: auto !important;
}
body.type-detail .p-detail.pono-pd .p-thumbnails-inner > div {
  display: flex !important; flex-direction: column !important;
  gap: 6px; width: 72px !important; transform: none !important;
}
body.type-detail .p-detail.pono-pd .p-thumbnails .thumbnail-prev,
body.type-detail .p-detail.pono-pd .p-thumbnails .thumbnail-next { display: none !important; }
body.type-detail .p-detail.pono-pd .p-thumbnails-inner a.cbox-gal { display: none !important; }
body.type-detail .p-detail.pono-pd .p-thumbnails-inner a.p-thumbnail {
  display: block !important; box-sizing: border-box;
  width: 72px !important; height: 72px !important; margin: 0 !important; padding: 0;
  border: 1.5px solid var(--pono-border); overflow: hidden;
  transition: border-color .15s;
}
body.type-detail .p-detail.pono-pd .p-thumbnails-inner a.p-thumbnail:hover { border-color: var(--pono-ink); }
body.type-detail .p-detail.pono-pd .p-thumbnails-inner a.p-thumbnail.highlighted {
  border-color: var(--pono-ink); box-shadow: 0 0 0 1px var(--pono-ink);
}
body.type-detail .p-detail.pono-pd .p-thumbnails-inner a.p-thumbnail img {
  width: 100% !important; height: 100% !important; object-fit: cover; display: block;
}

/* flags jako overlay vlevo nahoře na obrázku. V grid módu visí nad první buňkou
   (p-image left == grid first cell left). pointer-events:none aby flag neblokovala
   klik na lightbox — flag samotná není interaktivní. */
body.type-detail .p-detail.pono-pd .p-image .flags {
  position: absolute; top: 12px; left: 12px; z-index: 3;
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px; margin: 0;
  pointer-events: none;
}
body.type-detail .p-detail.pono-pd .p-image .flag {
  font-family: var(--pono-sans); font-size: 10px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .04em;
  padding: 4px 8px; line-height: 1.3; border-radius: 3px;
  color: #fff !important;
}
body.type-detail .p-detail.pono-pd .p-image .flag-new { background: var(--pono-navy) !important; }
body.type-detail .p-detail.pono-pd .p-image .flag-promo-extra-sleva,
body.type-detail .p-detail.pono-pd .p-image .flag-sale,
body.type-detail .p-detail.pono-pd .p-image .flag-tip { background: var(--pono-red) !important; }

/* rating přesunutý do hlavičky buy panelu */
body.type-detail .p-detail.pono-pd .pono-pd-head .p-detail-info { margin: 8px 0 0; }

/* galerie: grid mód (>=4 fotky) — 2x2 mřížka velkých fotek */
body.type-detail .p-detail.pono-pd .pono-pd-gal-grid .p-image { border: none; }
body.type-detail .p-detail.pono-pd .pono-pd-photo-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
body.type-detail .p-detail.pono-pd .pono-pd-photo-cell {
  margin: 0; padding: 0; background: #fff;
  border: 1px solid var(--pono-rule);
  cursor: zoom-in; overflow: hidden; aspect-ratio: 3 / 4;
  position: relative;   /* #4 fix: anchor pro vlajky overlay přesunuté do první buňky */
}
body.type-detail .p-detail.pono-pd .pono-pd-photo-cell img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
/* #4 fix: vlajky uvnitř první buňky gridu (ne v .p-image jako celku, jinak padají přes thumb sloupec) */
body.type-detail .p-detail.pono-pd .pono-pd-photo-cell .flags {
  position: absolute; top: 8px; left: 8px; z-index: 3;
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px; margin: 0;
}
/* galerie: solo mód (1 fotka / grid bez overflow) → bez thumb sloupce */
body.type-detail .p-detail.pono-pd .p-image-wrapper.pono-pd-gal-solo {
  grid-template-columns: minmax(0, 1fr);
}
body.type-detail .p-detail.pono-pd .pono-pd-gal-solo .p-image { grid-column: 1; }
body.type-detail .p-detail.pono-pd .pono-pd-gal-solo .p-thumbnails-wrapper { display: none; }

/* ════════════════════════════════════════════════════════════════════════════
   V5 — OBSAHOVÁ ČÁST (Popis | Parametry vedle sebe, dle elegant.cz)
   .description-inner je nativně flex row: .basic-description | .extended-description.
   GINA-buggy produkty pravý sloupec přetlačí dolů — tady ho zrobustníme (nowrap +
   min-width:0 + fixní šířka pravého sloupce) a nastylujeme.
   ════════════════════════════════════════════════════════════════════════════ */
body.type-detail .p-detail.pono-pd .shp-tabs-wrapper {
  margin: 44px 0 0;           /* dědit šířku z nativního containeru, ne centrovat na 1380 */
}
body.type-detail .p-detail.pono-pd .shp-tabs-wrapper .row { margin: 0; }
body.type-detail .p-detail.pono-pd .shp-tabs-wrapper .col-sm-12 { padding: 0; width: auto; float: none; }
/* tab nav skrytá — jen 1 tab „Popis" */
body.type-detail .p-detail.pono-pd .shp-tabs-row { display: none !important; }

/* 2-sloupcový layout obsahu */
body.type-detail .p-detail.pono-pd .description-inner {
  display: flex !important; flex-direction: row !important; flex-wrap: nowrap;
  gap: 32px; align-items: flex-start;
}
body.type-detail .p-detail.pono-pd .basic-description {
  flex: 1 1 auto; min-width: 0;
  font-size: 14px; line-height: 1.65; color: var(--pono-text);
}
body.type-detail .p-detail.pono-pd .basic-description img { max-width: 100%; height: auto; }
body.type-detail .p-detail.pono-pd .basic-description table { max-width: 100%; }
body.type-detail .p-detail.pono-pd .extended-description {
  flex: 0 0 320px; align-self: flex-start;
  background: var(--pono-cream); padding: 20px;
}
/* nadpisy obsahu */
body.type-detail .p-detail.pono-pd .description-inner h3 {
  font-family: var(--pono-serif); font-size: 20px; font-weight: 700;
  letter-spacing: -0.01em; color: var(--pono-ink); margin: 0 0 14px;
}
body.type-detail .p-detail.pono-pd .extended-description h3 {
  font-family: var(--pono-sans); font-size: 14px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em; margin: 0 0 12px;
}
/* parametry tabulka v pravém boxu */
body.type-detail .p-detail.pono-pd .extended-description .detail-parameters {
  width: 100%; border-collapse: collapse; font-size: 12.5px;
}
body.type-detail .p-detail.pono-pd .extended-description .detail-parameters tr {
  border-bottom: 1px solid var(--pono-rule);
}
body.type-detail .p-detail.pono-pd .extended-description .detail-parameters th,
body.type-detail .p-detail.pono-pd .extended-description .detail-parameters td {
  padding: 7px 0; text-align: left; vertical-align: top;
}
body.type-detail .p-detail.pono-pd .extended-description .row-header-label { color: var(--pono-muted); font-weight: 600; }
/* prázdný params pahýl v buy panelu (varianta-stub) — pryč, reálné parametry jsou v obsahu */
body.type-detail .p-detail.pono-pd .p-info-wrapper .detail-parameters { display: none !important; }

/* ════════════════════════════════════════════════════════════════════════════
   V4 — REMOVED. Předchozí verze přesouvala addon dovnitř .pono-pd-price a
   stylovala jeho .shkDiscountPromo__* uzly přímo. Nový přístup (REBEL horizontal):
   addon zůstává offscreen (CSS hidden), naše .pono-pd-price-row a chip jsou
   jediné viditelné UI. JS chip volá .click() na hidden __promoCode aby se
   Shoptet flow stále provedl (kód vstoupí do košíku).
   ════════════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════════════════
   V6 — BENEFIT BANNER (.benefitBanner — 4 položky: ikona + titulek + data)
   ════════════════════════════════════════════════════════════════════════════ */
body.type-detail .p-detail.pono-pd .benefitBanner {
  display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 0;
  margin: 32px 0 0;           /* dědit šířku z nativního containeru */
}
body.type-detail .p-detail.pono-pd .benefitBanner__item {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 18px; margin: 0 -1px 0 0;
  border: 1px solid var(--pono-rule); background: #fff;
}
body.type-detail .p-detail.pono-pd .benefitBanner__picture { flex-shrink: 0; display: flex; }
body.type-detail .p-detail.pono-pd .benefitBanner__img {
  width: 34px; height: 34px; object-fit: contain; display: block;
}
body.type-detail .p-detail.pono-pd .benefitBanner__title {
  display: block; font-size: 13px; font-weight: 700;
  color: var(--pono-ink); line-height: 1.3;
}
body.type-detail .p-detail.pono-pd .benefitBanner__data {
  font-size: 14px; color: var(--pono-muted); line-height: 1.3;
}

/* ════════════════════════════════════════════════════════════════════════════
   V7 — MOBIL: sticky spodní CTA lišta (skrytá na desktopu, viz @media níže)
   ════════════════════════════════════════════════════════════════════════════ */
body.type-detail .pono-pd-mobilebar { display: none; }

/* ── responsivita ────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  body.type-detail .p-detail .product-top {
    grid-template-columns: 64px minmax(0, 1fr) 360px; gap: 14px;
  }
}
@media (max-width: 880px) {
  body.type-detail .p-detail .product-top { grid-template-columns: 1fr; gap: 16px; }
  body.type-detail .p-detail .p-image-wrapper,
  body.type-detail .p-detail .p-info-wrapper { grid-column: 1 / -1; }
  body.type-detail .p-detail.pono-pd .pono-pd-title { font-size: 26px; }
  /* V5 — obsah pod sebe na mobilu */
  body.type-detail .p-detail.pono-pd .shp-tabs-wrapper { padding: 0 16px; margin-top: 28px; }
  body.type-detail .p-detail.pono-pd .description-inner { flex-direction: column !important; gap: 20px; }
  body.type-detail .p-detail.pono-pd .extended-description { flex: 0 0 auto; width: 100%; }
  /* V6 — benefit banner 2-col na mobilu */
  body.type-detail .p-detail.pono-pd .benefitBanner { grid-template-columns: 1fr 1fr; padding: 0 16px; }
  body.type-detail .p-detail.pono-pd .benefitBanner__item { margin: 0 -1px -1px 0; }
  /* V7 — mobilní galerie: jeden sloupec, thumbs horizontálně pod obrázkem */
  body.type-detail .p-detail.pono-pd .p-image-wrapper { grid-template-columns: 1fr; }
  body.type-detail .p-detail.pono-pd .p-image-wrapper .p-image { grid-column: 1; grid-row: 1; }
  body.type-detail .p-detail.pono-pd .p-image-wrapper .p-thumbnails-wrapper { grid-column: 1; grid-row: 2; }
  body.type-detail .p-detail.pono-pd .p-thumbnails-inner > div {
    flex-direction: row !important; width: auto !important;
    overflow-x: auto; padding-bottom: 4px;
  }
  /* V7 — sticky spodní CTA lišta */
  body.type-detail .pono-pd-mobilebar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 200;
    align-items: center; gap: 10px;
    background: #fff; border-top: 1px solid var(--pono-border);
    padding: 10px 14px; box-shadow: 0 -2px 12px rgba(0,0,0,.08);
  }
  body.type-detail .pono-pd-mb-price {
    font-size: 18px; font-weight: 800; color: var(--pono-ink); white-space: nowrap;
  }
  body.type-detail .pono-pd-mb-btn {
    flex: 1; height: 46px; border: none; border-radius: 3px;
    background: var(--pono-navy); color: #fff;
    font-family: var(--pono-sans); font-weight: 700; font-size: 14px; cursor: pointer;
  }
  body.type-detail .p-detail { padding-bottom: 74px; }
}
