/**
 * Popis produktu — vzhľad blokov.
 *
 * Načítava ho katalóg aj administrácia, aby popis v karte produktu vyzeral
 * presne tak, ako ho uvidí zákazník. Kým to bolo napísané len v `rezervacia.css`,
 * administrácia ho vôbec nevykresľovala a majiteľ nemal ako zistiť, čo je na webe.
 *
 * HTML z týchto tried skladá `popis.js` — jeden súbor pre server, katalóg
 * aj administráciu.
 */
/* `padding-bottom:0` musí byť napísané: blok je `<section>` a tie majú
   v styl.css spoločné zvislé odsadenie sekcie stránky (54 px). Bez toho
   ostávala pod každou fotkou diera až po čiaru nasledujúceho bloku. */
.pd-vyrobca{margin-top:15px;padding:16px 0 0;border-top:1px solid var(--line)}
.pd-vyrobca > .pdv-obr-k{margin-top:15px}
.pd-vyrobca h3{font-family:var(--head);font-size:.76rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-soft);margin:0 0 12px}
/* Šírka riadku je NEOBMEDZENÁ. Zámerných 70 znakov sa číta príjemnejšie, ale
   na stránke produktu nechávalo pravú tretinu prázdnu a text vyzeral useknutý
   — majiteľ si to všimol sám (22. 9. 2026). Obsah popisu sú krátke odseky
   a odrážky, nie súvislá próza, takže dlhší riadok tu neškodí. */
.pd-vyrobca p{margin:0 0 .8em;font-size:.93rem;line-height:1.7;color:var(--ink-2)}
.pd-vyrobca p:last-child{margin-bottom:0}
.pdv-body{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.pdv-body li{position:relative;padding:11px 14px 12px 34px;border-radius:11px;
  font-size:.9rem;line-height:1.6;color:var(--ink-2);
  background:linear-gradient(160deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.6) 100%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1), 0 1px 2px rgba(78,58,44,.06),
             0 8px 16px -13px rgba(78,58,44,.5)}
/* Značka patrí KAŽDEJ KARTE zvlášť: v jednom bloku môže byť veta bez značky,
   pod ňou výhody s ✦ a pod nimi číslovaný postup. Karta je vždy rovnaká —
   mení sa len to, čo pred ňou stojí.

   Číslujú sa len karty so značkou `cislo`, a to priebežne: počítadlo preskočí
   všetko ostatné, takže „1. 2. 3." sedí, aj keď medzi nimi stojí hviezdička. */
.pdv-body{counter-reset:karta}
.pdv-body li::before{position:absolute;left:13px;top:11px;
  color:var(--red);font-size:.8rem;opacity:.75}
.pdv-body li.z-hviezda::before{content:"✦"}
.pdv-body li.z-bodka::before{content:"•";font-size:1rem;top:9px}
.pdv-body li.z-cislo{counter-increment:karta}
.pdv-body li.z-cislo::before{content:counter(karta) ".";font-weight:600;opacity:1;
  font-size:.82rem;top:12px;left:11px}
/* Bez značky sa text posunie k ľavému okraju karty. */
.pdv-body li.z-ziadna{padding-left:14px}
.pdv-body li.z-ziadna::before{content:none}
/* Staré popisy majú značku na zozname, nie na karte. */
.pdv-body.z-bodka li:not([class*="z-"])::before{content:"•"}
.pdv-body.z-ziadna li:not([class*="z-"]){padding-left:14px}
.pdv-body li b{color:var(--ink);font-weight:600}

/* Fotky od výrobcu. Prvá cez celú šírku – býva to samotný produkt; ďalšie
   v mriežke, sú to infografiky a dávkovacia tabuľka, ktoré sa dajú otvoriť
   vo veľkom. Pozadie majú biele, preto sa nenásobia ako fotky z katalógu:
   infografika s bielym podkladom by po násobení stratila kontrast. */
.pdv-obr-k{display:block;border-radius:12px;overflow:hidden;background:#fff;
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1), 0 1px 2px rgba(78,58,44,.07),
             0 10px 18px -13px rgba(78,58,44,.55);
  transition:transform .18s cubic-bezier(.22,1,.36,1), box-shadow .18s}
.pdv-obr-k:hover{transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1), 0 18px 28px -16px rgba(58,44,34,.85)}
.pdv-obr-k.prva{grid-column:1 / -1}
.pdv-obr-k img{display:block;width:100%;height:auto}

/* Jedna zvýraznená karta. To isté sklo ako odrážky, len sama – na vetu,
   ktorú má zákazník prečítať ako prvú. */
.pdv-karta{padding:14px 16px 15px;border-radius:13px;
  background:linear-gradient(160deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.62) 100%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1), 0 1px 2px rgba(78,58,44,.06),
             0 12px 22px -14px rgba(78,58,44,.55)}
.pdv-karta p{margin:0 0 .6em;max-width:none}
.pdv-karta p:last-child{margin-bottom:0}

/* Tabuľka – typicky kŕmna dávka. Na úzkom displeji sa posúva vodorovne,
   nezalamuje: dávka rozsypaná na dva riadky sa nedá prečítať. */
.pdv-tab{overflow-x:auto;border-radius:12px;border:1px solid var(--line);
  background:var(--bg)}
.pdv-tab table{width:100%;border-collapse:collapse;font-size:.88rem}
.pdv-tab th,.pdv-tab td{padding:9px 13px;text-align:left;
  border-bottom:1px solid var(--line);white-space:nowrap}
.pdv-tab thead th{font-family:var(--head);font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);
  background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.45))}
.pdv-tab tbody tr:last-child td{border-bottom:0}
.pdv-tab td{color:var(--ink-2)}
.pdv-tab td:first-child{color:var(--ink);font-weight:600}

/* Zarovnanie celého bloku. Nadpis zarovnaný inak než text pod ním vyzerá
   ako chyba sadzby, preto sa nastavuje bloku, nie odseku. */
.pd-vyrobca.p-stred{text-align:center}
.pd-vyrobca.p-vpravo{text-align:right}
/* `max-width` na odseku by pri zarovnaní na stred držal text vľavo. */
.pd-vyrobca.p-stred p,.pd-vyrobca.p-vpravo p{max-width:none}
.pd-vyrobca.p-stred .pdv-body li,.pd-vyrobca.p-vpravo .pdv-body li{text-align:left}

/* Medzera medzi kartami. Bez nej si tiene susedných kariet liezli do seba
   a pri troch pod sebou to vyzeralo ako jedna rozmazaná plocha. */
.pdv-karta + .pdv-karta{margin-top:11px}
.pdv-karta + p,p + .pdv-karta,.pdv-body + .pdv-karta,.pdv-karta + .pdv-body{margin-top:13px}
/* Dva bloky, v ktorých je len karta, nepotrebujú medzi sebou ešte aj čiaru —
   karta je oddelená sama sebou. */
.pd-vyrobca:has(> .pdv-karta:first-child) + .pd-vyrobca:has(> .pdv-karta:first-child){
  border-top:0;padding-top:0;margin-top:11px}

/* Veľkosť písma bloku — tri kroky, nie ľubovoľné číslo. Väčší na úvodnú vetu,
   menší na poznámku pod čiarou. */
.pd-vyrobca.p-velky p,.pd-vyrobca.p-velky li{font-size:1.05rem;line-height:1.65}
.pd-vyrobca.p-maly p,.pd-vyrobca.p-maly li{font-size:.82rem;line-height:1.6}

/* Kŕmna tabuľka z obalu. Vzhľad dedí po `.pdv-tab` — je to tá istá vec a má
   vyzerať rovnako. Navyše má len to, čo je pri dávkach iné: prvý stĺpec je
   hlavička riadku (hmotnosť zvieraťa), čísla sa čítajú lepšie na stred a pri
   krmive pre šteňatá býva stĺpcov aj desať, takže sa mriežka musí zmestiť. */
.kt-tab th[scope="row"]{color:var(--ink);font-weight:600;white-space:nowrap;
  background:rgba(255,255,255,.5)}
.kt-tab thead th:not(:first-child),.kt-tab td{text-align:center}
.kt-tab table{font-size:.85rem}
.kt-tab th,.kt-tab td{padding:8px 11px}