/* novy-2026-vyjimky.css, 24. 8. 2026. Vrstva vzhledu nad aplikaci vyjimek
   /objednat-muj-vyber (program Muj vyber, drive Na miru a Vybiram si;
   stara adresa /objednat-online-vyjimky vraci 404). Stejny software jako
   objednavka Menicka. Nic v DOM se nepresouva, JS jen prida body tridu zs26-vyj.
   Bez JS je stranka jako dnes. Tokeny z novy-2026.css (balik 25), musi byt nacteny.
   Figma pro tuhle obrazovku neexistuje, vzhled je odvozeny z design systemu
   (karty, chipy, sticky souhrn jako u vrstvy nad fox2). Zadny hex mimo #fff, zadne stiny. */

body.zs26-vyj { text-align: left; }

/* ---------- rozlozeni ---------- */
body.zs26-vyj .objednavka_komplet {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: var(--zs-odstup-xl);
  align-items: start;
  margin-top: var(--zs-odstup-lg);
}
body.zs26-vyj .cast_menu,
body.zs26-vyj #cast_menu,
body.zs26-vyj .dnesnimenu,
body.zs26-vyj .cast_objednavka,
body.zs26-vyj .cast_objednavka > div,
body.zs26-vyj #objednavka,
body.zs26-vyj #objednavkaResume { width: auto !important; max-width: none !important; min-width: 0; float: none !important; margin-left: 0; margin-right: 0; }
body.zs26-vyj .cast_objednavka {
  position: sticky;
  top: var(--zs-odstup-lg);
  align-self: start;
}
@media (max-width: 899px) {
  body.zs26-vyj .objednavka_komplet { grid-template-columns: 1fr; }
  body.zs26-vyj .cast_objednavka { position: static; }
}

/* ---------- oznameni nad prepinacem dnu ---------- */
body.zs26-vyj #clanek h3.text-center,
body.zs26-vyj #clanek > div > h3:first-child {
  font-size: 16px;
  font-weight: 500;
  color: var(--zs-barva-text-tlumeny);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-male);
  padding: var(--zs-odstup-sm) var(--zs-odstup-base);
  margin: 0 0 var(--zs-odstup-base);
  text-align: left;
}

/* ---------- prepinac dnu, Figma 600-2 uzel 600:33 ----------
   Pilulky tydnu vlevo, oddelovac, pilulky dnu. Aktivni je tmave zelena vypln.

   Ctyri rozmerove vady, ktere se daji najit jen merenim na zive strance, ne
   ctenim HTML. Vsechny maji tutez pricinu: skin pilulky prekreslil, ale
   nezrusil hodnoty, ktere na tytez uzly pise objednavka2024.css a engine.
   Namereno na Menicku 31. 8. 2026, plati i tady, je to tentyz engine.
     1. objednavka2024.css dava .tyden > * height 2.5em a .tyden > .vybrany
        height 3em. Vybrany den proto stoji o 8 px vys (44 proti 36).
        Resi jedna min-height na vsech pilulkach a nulovy svisly padding.
     2. Obal .dny dostane tutez vysku a pilulka z nej vyteče. height auto.
     3. .dalsityden ma width 5em, tedy 68 px, ale text "predchozi tyden"
        potrebuje 141. Pretekal ven a naboural se do pondelka.
     4. "Dalsi tyden" engine kresli jako div.dny > span.alink > span.dalsityden,
        tedy pilulka uvnitr pilulky. Vnitrni musi byt jen text, jinak jsou na
        konci pasu dva ramecky pres sebe.

   Pata past, kvuli ktere je tady height: auto na sourozenci: kdyz se pas pri
   scrollu prepne na .tyden.fixed, engine napise PREDCHOZIMU SOUROZENCI
   #prepinacDnu inline height (44px, po navratu 0px), aby vykryl misto po pasu.
   Ciho toho uzlu je, ho nezajima. Vrstva tam ma vlastni hlavicku s H1, takze
   by ji engine nastavil height 0 a nadpis by vytekl ven. Pas nikdy nefixujeme. */
body.zs26-vyj #prepinacDnu.tyden {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zs-odstup-sm);
  margin: 0 0 var(--zs-odstup-xl);
  padding: 0;
  background: none;
  border: 0;
  height: auto !important;
  position: static !important;
  justify-content: flex-start;
  overflow-x: auto;
  scrollbar-width: none;
}
body.zs26-vyj #prepinacDnu.tyden::-webkit-scrollbar { display: none; }
/* hlavicka vrstvy je predchozi sourozenec pasu, engine ji pise inline vysku */
body.zs26-vyj .zs26-vyj-hlavicka { height: auto !important; }

body.zs26-vyj #prepinacDnu > span.alink,
body.zs26-vyj #prepinacDnu > .dny {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 36px;
  height: auto !important;
  padding: 0 var(--zs-odstup-base);
  border-radius: var(--zs-radius-pill);
  border: 1px solid var(--zs-barva-ramecek-pole);
  background: var(--zs-barva-pozadi-karta);
  color: var(--zs-barva-text-nadpis);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  float: none;
  width: auto !important;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
/* POZOR: tohle musi platit jen na VNORENE spany, tedy na text uvnitr pilulky.
   Zapis span:not(.fa) bez zanoreni trefi i pilulku samotnou (je to taky span),
   je pozdeji v souboru a sebere ji ramecek i display. Stalo se 31. 8. 2026
   a na snimku to vypada jako rozsypany pas, ne jako chyba selektoru. */
body.zs26-vyj #prepinacDnu span span:not(.fa) {
  display: inline;
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  width: auto !important;
  height: auto !important;
  line-height: inherit;
}
/* vnorena pilulka v pilulce: vnitrni je jen text */
body.zs26-vyj #prepinacDnu .dny > span.alink {
  border: 0;
  padding: 0;
  min-height: 0;
  background: none;
  color: inherit;
  font: inherit;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body.zs26-vyj #prepinacDnu > span.alink:hover,
body.zs26-vyj #prepinacDnu > .dny:hover { border-color: var(--zs-barva-akce-primarni); }
body.zs26-vyj #prepinacDnu > span.alink.vybrany {
  background: var(--zs-barva-text-nadpis);
  border-color: var(--zs-barva-text-nadpis);
  color: #fff;
  font-weight: 600;
}
/* Tyden jako par vlevo. Engine dava "predchozi tyden" jako div BEZ onclicku,
   zpatky v case se kliknout neda, takze se z nej pilulka nedela: je to popisek
   a chova se jako neaktivni. "Dalsi tyden" onclick ma a je to druha pilulka. */
body.zs26-vyj #prepinacDnu .dny.predchozi {
  order: -2;
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}
body.zs26-vyj #prepinacDnu .dny.dalsi:not(.predchozi) { order: 9; }
/* Oddeleni tydne od dnu delá mezera, ne linka. Linka by musela byt absolutne
   pozicovana v pruzku, ktery se pri uzkem okne roluje, a pri rolovani by ujizdela. */
body.zs26-vyj #prepinacDnu .dny.predchozi { margin-right: var(--zs-odstup-base); }
body.zs26-vyj #prepinacDnu .dny.dalsi:not(.predchozi) { margin-left: var(--zs-odstup-base); }
/* Minuly den aktualniho tydne. Marek 12. 9. 2026: "mame tam nejake hranate
   tlacitka, melo by to byt stejne jako je ten ctvrtek."

   Zmereno 13. 9. 2026 na webvyvoj: engine posila uz probehly den jako <div>
   BEZ tridy a BEZ onclicku, tedy nesplni ani "> span.alink", ani "> .dny",
   propadne na enginove objednavka2024.css .tyden > * a vyjde jako sedy
   obdelnik 208x44 misto pilulky 122x36.

   Selektor musi vynechat .dny (tydenni pilulky) a #celkem_fix (castka),
   protoze to jsou taky primi potomci a divy. Nedostupnost se kresli stejne
   jako u "predchoziho tydne" vyse: ztlumit, ne prebarvit. */
body.zs26-vyj #prepinacDnu > div:not(.dny):not(.celkem_fix) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 36px;
  height: auto !important;
  padding: 0 var(--zs-odstup-base);
  border-radius: var(--zs-radius-pill);
  border: 1px solid var(--zs-barva-ramecek-pole);
  background: var(--zs-barva-pozadi-karta);
  color: var(--zs-barva-text-nadpis);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
  float: none;
  width: auto !important;
  text-align: center;
  text-decoration: none;
  opacity: 0.45;
  cursor: default;
  pointer-events: none;
}

/* sipkove pilulky .dden nemaji ve Figme protejsek a duplikuji dny */
body.zs26-vyj #prepinacDnu .dden { display: none !important; }
body.zs26-vyj #prepinacDnu .fa { font-size: 11px; opacity: 0.6; }
/* celkova castka z pasu odchazi: na desktopu ji nese souhrn, na mobilu lista */
body.zs26-vyj #prepinacDnu #celkem_fix { display: none !important; }

/* ---------- menu dne, Figma 600-2 uzly 602:4041 az 602:4130 ----------
   Radek jidla je prosty radek s vlasovou linkou dole, ne karta s rameckem.
   Vlevo nazev a odkaz na slozeni, vpravo cena a kulate tlacitko plus.

   Engine kresli kazde jidlo jako div.radek_mujvyber se dvema detmi:
   .jidelnicek_polozka (nazev a ikona) a .vyjimky_buttony (osm cen).
   Jsou to sourozenci, takze se z obalu udela grid o dvou sloupcich a nic
   se nepresouva. Panel se slozenim je treti dite a jde pres oba sloupce. */
/* Nadpis "Menu pondeli 7. 9." Figma 600-2 nema vubec, den je videt na aktivni
   pilulce a v souhrnu. Nechavame ho jako drobny popisek: pas dnu se na uzkem
   okne roluje a po odrolovani by jinak nebylo poznat, ktery den se dívá. */
body.zs26-vyj #cast_menu > h2,
body.zs26-vyj .cast_menu > h2,
body.zs26-vyj #cast_menu h2.u0 {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--zs-barva-text-tlumeny);
  margin: 0 0 var(--zs-odstup-base);
  padding: 0;
  text-align: left;
}
body.zs26-vyj .dnesnimenu.plocha {
  background: none;
  padding: 0;
  margin: 0;
  border: 0;
  width: auto;
}

/* nadpis chodu, protejsek "Hlavni jidla" ve Figme (602:4042).
   Dvojtecka za nazvem se z DOMu nemaze, jen se orizne. */
body.zs26-vyj .dnesnimenu .nazevchodu {
  display: block;
  margin: var(--zs-odstup-2xl) 0 var(--zs-odstup-xs);
  padding: 0 0 var(--zs-odstup-xs);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--zs-barva-text-nadpis);
  background: none;
  border: 0;
  width: auto;
  text-align: left;
}
body.zs26-vyj .dnesnimenu .nazevchodu:first-child { margin-top: 0; }
/* puvodni text ma na konci dvojtecku, Figma ji nema. Uzel se neprepisuje,
   jen se jeho vlastni text orizne na nulu a vypise se atribut od JS. */
body.zs26-vyj .dnesnimenu .nazevchodu[data-zs-chod] { font-size: 0; }
body.zs26-vyj .dnesnimenu .nazevchodu[data-zs-chod]::before {
  content: attr(data-zs-chod);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
}

/* jeden radek jidla */
body.zs26-vyj .dnesnimenu .radek_mujvyber {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--zs-odstup-base);
  padding: 0;
  margin: 0;
  border-bottom: 1px solid var(--zs-barva-ramecek-pole);
  width: auto;
  float: none;
  transition: background-color 0.15s;
}
body.zs26-vyj .dnesnimenu .radek_mujvyber:hover { background: var(--zs-barva-pozadi-sekce); }

body.zs26-vyj .dnesnimenu .jidelnicek_polozka.chod {
  grid-column: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  margin: 0;
  padding: var(--zs-odstup-md) 0;
  background: none;
  border: 0;
  border-radius: 0;
  width: auto;
  height: auto;
  min-height: 0;
  float: none;
  text-align: left;
}
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .nazev {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--zs-odstup-sm);
  padding: 0;
  margin: 0;
  width: auto;
  float: none;
  background: none;
}
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .jmeno,
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .jmeno:hover {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--zs-barva-text-nadpis);
  cursor: default;
  /* Engine podtrhava nazev pri najeti, protoze to byl spousteč bubliny se
     slozenim. Od 13. 9. 2026 bublina nikam nevede, takze podtrzeni slibuje
     odkaz, ktery neexistuje. Slozeni otevira zeleny rozklik pod nazvem. */
  text-decoration: none;
}
/* ikonu enginu nahrazuje textovy stitek, obrazek zustava v DOMu skryty */
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .wheat,
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .pz { display: none !important; }
body.zs26-vyj .zs26-vyj-znacka {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--zs-radius-pill);
  background: var(--zs-barva-pozadi-sekce);
  color: var(--zs-barva-text-odkaz);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* odkaz na slozeni, ve Figme zeleny text pod nazvem */
body.zs26-vyj #obsah .zs26-vyj-slozeni.zs26-vyj-slozeni.zs26-vyj-slozeni.zs26-vyj-slozeni {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--zs-barva-text-odkaz);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
  text-align: left;
  cursor: pointer;
  width: auto;
  min-height: 0;
  border-radius: 0;
  box-shadow: none !important;
}
body.zs26-vyj .zs26-vyj-slozeni:hover { text-decoration: underline; }
body.zs26-vyj .zs26-vyj-slozeni::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 0.15s;
}
body.zs26-vyj .zs26-vyj-slozeni[aria-expanded="true"]::after { transform: translateY(1px) rotate(225deg); }

/* panel se slozenim, Figma 602:4128 */
body.zs26-vyj .zs26-vyj-panel {
  grid-column: 1 / -1;
  margin: 0 0 var(--zs-odstup-md);
  padding: var(--zs-odstup-md) var(--zs-odstup-base);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-male);
}
body.zs26-vyj .zs26-vyj-panel[hidden] { display: none !important; }
body.zs26-vyj #obsah .zs26-vyj-panel__slozeni {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--zs-barva-text-zaklad);
}
body.zs26-vyj .zs26-vyj-panel__slozeni strong { font-weight: 700; }
body.zs26-vyj #obsah .zs26-vyj-nutri {
  margin: var(--zs-odstup-sm) 0 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.6;
  color: var(--zs-barva-text-nadpis);
}
body.zs26-vyj .zs26-vyj-nutri:empty { display: none; }
body.zs26-vyj #obsah .zs26-vyj-panel__pozn {
  margin: var(--zs-odstup-sm) 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
}

/* pravy sloupec radku: cena a tlacitko plus */
body.zs26-vyj .dnesnimenu .vyjimky_buttony {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--zs-odstup-sm);
  margin: 0;
  padding: var(--zs-odstup-md) 0;
  background: none;
  border: 0;
  border-radius: 0;
  width: auto;
  height: auto;
  float: none;
  text-align: right;
}
body.zs26-vyj .dnesnimenu .vyjimky_buttony form.cenaButton {
  display: inline-block;
  margin: 0;
  padding: 0;
  width: auto;
  float: none;
}
/* Cena je ve Figme text vlevo od kulateho tlacitka plus. Cislo tedy nese
   .cena a plus je jeji pseudoprvek, aby vrstva nemusela vkladat dalsi uzel
   dovnitr formulare enginu. */
/* Marek 12. 9. 2026: "kdyz na to najedu, tak se ohranici, je tam nejaky prekryv."
   Zmereno 13. 9. 2026: objednavka2024.css ma
   .cenaButton .cena:hover s tmave zelenym 3px rameckem a stinem 0 0 6px cerne
   na 30 %. Vrstva od 26. 8. prebijela border, ale ne stin, takze po najeti zustaval
   kolem ceny sedy halo ramecek. Odezvu na najeti uz nese zvetseni kulateho plus
   o 8 % a podbarveni radku, dalsi ramecek je sum. */
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena,
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena:hover,
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena:focus {
  box-shadow: none !important;
  /* Marek 13. 9. 2026: "kdyz vybiram jidlo na ikonu plus, tak je useknuta."
     .cena ma z enginu overflow: hidden a kulate plus je jeji pseudoprvek,
     ktery se o hranu boxu osekne: kolecko 30x30 v boxu vysokem 30 prijde
     o zaobleni a pri najeti ho scale(1.08) roztahne na 32,4 px, takze
     z nej je osmiuhelnik. Zmereno 13. 9. 2026, cely retez rodicu ma
     overflow visible, hidden je jen na .cena samotne. */
  overflow: visible !important;
}
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: var(--zs-odstup-md);
  min-width: 0;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: none;
  color: var(--zs-barva-text-nadpis);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  width: auto;
  height: auto;
  margin: 0;
  float: none;
  line-height: 1.2;
  white-space: nowrap;
}
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena::after {
  content: "+";
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--zs-barva-akce-primarni);
  color: var(--zs-barva-akce-primarni-text);
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
  transition: transform 0.15s;
}
body.zs26-vyj .dnesnimenu .radek_mujvyber:hover .cena::after { transform: scale(1.08); }
/* stitek kJ u ceny odchazi: rada se vybira jednou nahore, opakovat ji
   u osmnacti jidel je sum. Uzel zustava v DOMu. */
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena .kj { display: none !important; }
body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena > span:not(.kj) {
  font-size: 16px;
  font-weight: 700;
  display: inline;
}
/* Dokud neni vybrana velikost porce, je misto ceny rozsah. Zadna velikost se
   nepredvybira potichu, takze tlacitko plus tu jeste neni: nebylo by co pridat. */
body.zs26-vyj .dnesnimenu .vyjimky_buttony .zs26-vyj-rozsah {
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--zs-barva-text-tlumeny);
  text-align: right;
  white-space: normal;
  max-width: 230px;
}
body.zs26-vyj .dnesnimenu .vyjimky_buttony .zs26-vyj-rozsah:empty { display: none; }

/* ---------- souhrn ---------- */
body.zs26-vyj .cast_objednavka > div {
  background: var(--zs-barva-pozadi-sekce-2, var(--zs-barva-pozadi-sekce));
  border-radius: var(--zs-radius-karta);
  padding: var(--zs-odstup-lg);
}
/* Kotva je #objednavka, ne #objednavkaResume. Resume drzi engine jen dokud je
   kosik prazdny; po prvnim jidle ho zahodi a vykresli .objednavka.plocha,
   .celkem_uplny a .final. Do 25. 8. se naplneny kosik nedal videt bez uctu,
   takze cela tahle cast byla nestylovana: holy textovy input na pocet, sipky
   plus a minus jako sede glyfy a Vycistit objednavku jako podtrzeny odkaz.
   Zmereno a doplneno 26. 8. 2026. */
body.zs26-vyj #objednavka h2 {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-base);
  padding: 0;
  text-align: left;
}
body.zs26-vyj #objednavka .objednavka.plocha {
  background: none;
  padding: 0;
  margin: 0;
  border: 0;
  width: auto;
  font-size: 15px;
  line-height: 1.5;
  color: var(--zs-barva-text-zakladni);
}
body.zs26-vyj #objednavka .objednavka.plocha table { width: 100%; border-collapse: collapse; }
body.zs26-vyj #objednavka .objednavka.plocha td,
body.zs26-vyj #objednavka .objednavka.plocha th {
  padding: 8px 0;
  border-bottom: 1px solid var(--zs-barva-ramecek-karta, var(--zs-barva-ramecek-pole));
  vertical-align: top;
  text-align: left;
  font-size: 15px;
}

/* den v kosiku */
body.zs26-vyj #objednavka .podrobnosti_den { margin: 0 0 var(--zs-odstup-base); }
body.zs26-vyj #objednavka .podrobnosti_den h4 {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-sm);
  padding: 0;
}

/* radek polozky */
body.zs26-vyj #objednavka .podrobnosti_den .chod {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--zs-odstup-sm);
  padding: 10px 0;
  border-bottom: 1px solid var(--zs-barva-ramecek-karta, var(--zs-barva-ramecek-pole));
  width: auto;
  float: none;
  margin: 0;
}
body.zs26-vyj #objednavka .podrobnosti_den .chod .nazev {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--zs-barva-text-zakladni);
  width: auto;
  float: none;
  text-align: left;
}
body.zs26-vyj #objednavka .podrobnosti_den .chod .nazev input[name="pocet"] {
  flex: 0 0 auto;
  width: 44px;
  min-height: 34px;
  padding: 0 6px;
  text-align: center;
  font: inherit;
  font-size: 14px;
  color: var(--zs-barva-text-nadpis);
  background: #fff;
  border: 1px solid var(--zs-barva-ramecek-pole);
  border-radius: var(--zs-radius-male);
}
body.zs26-vyj #objednavka .podrobnosti_den .chod .nazev > span {
  flex: 0 0 auto;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj #objednavka .podrobnosti_den .chod > .cena {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-sm);
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 15px;
  font-weight: 700;
  color: var(--zs-barva-text-nadpis);
  width: auto;
  float: none;
  text-align: right;
}
body.zs26-vyj #objednavka .buttonky { display: inline-flex; align-items: center; gap: 4px; float: none; }
body.zs26-vyj #objednavka .buttonky .but_plus {
  display: inline-block;
  width: 26px;
  height: 26px;
  background-size: 26px 26px;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 0.75;
}
body.zs26-vyj #objednavka .buttonky .but_plus:hover { opacity: 1; }

/* dopravne je radek bez ovladani, ne polozka k odebrani */
body.zs26-vyj #objednavka .podrobnosti_den .jidlochod .nazev,
body.zs26-vyj #objednavka .podrobnosti_den .jidlochod > .cena {
  color: var(--zs-barva-text-tlumeny);
  font-weight: 500;
}

/* mezisoucet za den a celkova castka */
body.zs26-vyj #objednavka .celkem_cena {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--zs-odstup-sm);
  padding: var(--zs-odstup-sm) 0 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--zs-barva-text-nadpis);
  width: auto;
  float: none;
}
body.zs26-vyj #objednavka .celkem_uplny {
  margin-top: var(--zs-odstup-base);
  padding-top: var(--zs-odstup-base);
  border-top: 2px solid var(--zs-barva-ramecek-karta, var(--zs-barva-ramecek-pole));
  font-size: 18px;
}
body.zs26-vyj #objednavka .celkem_uplny .cena { font-size: 24px; color: var(--zs-barva-text-nadpis); }

/* zaver: vycistit je vedlejsi akce, prihlaseni je ta hlavni */
body.zs26-vyj #objednavka .final { margin-top: var(--zs-odstup-base); }
body.zs26-vyj #objednavka .final .alink {
  display: inline-block;
  font-size: 14px;
  color: var(--zs-barva-text-tlumeny);
  text-decoration: underline;
  cursor: pointer;
}
body.zs26-vyj #objednavka .final .alink:hover { color: var(--zs-barva-text-nadpis); }
body.zs26-vyj #objednavka .final p {
  font-size: 14px;
  line-height: 1.5;
  color: var(--zs-barva-text-zakladni);
  margin: var(--zs-odstup-base) 0 var(--zs-odstup-sm);
}
/* #obsah je tu proto, ze globalni pravidlo na a.button_hlavni v novy-2026-obsah.css
   ma (1 id, 4 tridy, 2 typy) a maluje s !important. Dve id tu specificitu prebiji.
   PRIHLASENI je hlavni akce karty, patri limetka, ne obrys. */
body.zs26-vyj #obsah #objednavka .objednavka.plocha a.button_hlavni,
body.zs26-vyj #obsah #objednavka .objednavka.plocha .button_hlavni,
body.zs26-vyj #obsah #objednavka .objednavka.plocha input[type="submit"],
body.zs26-vyj #obsah #objednavka .objednavka.plocha button,
body.zs26-vyj #obsah #objednavka .final a.button_hlavni,
body.zs26-vyj #obsah #objednavka .final .button_hlavni,
body.zs26-vyj #obsah #objednavka .final input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--zs-vyska-tlacitko);
  margin-top: var(--zs-odstup-base);
  padding: 0 var(--zs-odstup-xl) !important;
  border-radius: var(--zs-radius-pill) !important;
  border: 2px solid var(--zs-barva-akce-primarni) !important;
  background: var(--zs-barva-akce-primarni) !important;
  color: var(--zs-barva-akce-primarni-text) !important;
  font-weight: 600;
  font-size: 16px !important;
  text-decoration: none !important;
  cursor: pointer;
}

/* ---------- mobil ---------- */
@media (max-width: 699px) {
  body.zs26-vyj #prepinacDnu #celkem_fix { margin-left: 0; width: 100%; }
  body.zs26-vyj #prepinacDnu #celkem_fix .desktop { display: none; }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop {
    display: flex;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 60;
    align-items: center;
    justify-content: space-between;
    gap: var(--zs-odstup-base);
    min-height: 64px;
    padding: var(--zs-odstup-sm) var(--zs-odstup-base);
    background: var(--zs-barva-pozadi-karta);
    border-top: 1px solid var(--zs-barva-ramecek-pole);
    font-weight: 700;
    color: var(--zs-barva-text-nadpis);
  }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop::before { content: "Celkem"; font-weight: 500; color: var(--zs-barva-text-tlumeny); }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop::after {
    content: "Zobrazit objednávku";
    display: inline-flex; align-items: center;
    min-height: var(--zs-vyska-tlacitko-male);
    padding: 0 var(--zs-odstup-base);
    border-radius: var(--zs-radius-pill);
    background: var(--zs-barva-akce-primarni);
    color: var(--zs-barva-akce-primarni-text);
    font-size: 14px; font-weight: 600;
  }
  body.zs26-vyj { padding-bottom: 72px !important; }
  body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena { min-width: calc(25% - 8px); }
}

/* ==========================================================================
   Vrstva Muj vyber, 25. 8. 2026
   Kalorickou radu se vybira jednou nahore, filtr "tohle nejim", legenda ikon,
   souhrn s tim, co chybi. Vse ridi zs26-vyjimky.js pres datove atributy:
     body[data-zs26-rada]            index zvolene rady, prazdny = nevybrano
     form.cenaButton[data-zs26-rada] index rady u konkretni ceny
     form.cenaButton[data-zs26-vybrano] prave ta zvolena
     [data-zs26-skryto]              schovano filtrem
   Bez JS se z teto sekce neuplatni nic, protoze vse visi na body.zs26-vyj.
   ========================================================================== */

/* ---------- ovladaci panel nad menu ---------- */
body.zs26-vyj .zs26-vyj-ovladani {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--zs-odstup-lg);
  margin: 0 0 var(--zs-odstup-lg);
  padding: var(--zs-odstup-lg);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-karta);
}
body.zs26-vyj .zs26-vyj-blok { min-width: 0; }
body.zs26-vyj .zs26-vyj-nadpis {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-xs, 8px);
}
body.zs26-vyj .zs26-vyj-perex {
  font-size: 14px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
  margin: 0 0 var(--zs-odstup-sm);
}

/* ---------- chipy: rada i filtr ---------- */
body.zs26-vyj .zs26-vyj-rady,
body.zs26-vyj .zs26-vyj-filtry {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zs-odstup-xs, 8px);
  margin: 0;
  padding: 0;
}
/* Chipy vrstvy jsou <button>, takze na ne dosahovalo globalni pravidlo
   body:has(.zs26-hlavicka):not(.foxplus) #obsah > :not(.zs26) button
   v novy-2026-obsah.css, ktere maluje pozadi, barvu i ramecek s !important.
   Zmereno 26. 8. 2026: aktivni chip mel aria-checked true, tridu --aktivni
   a pritom bile pozadi a stejny ramecek jako nevybrane, takze zvolena velikost
   porce nebyla poznat. !important sam o sobe nestacil, mezi !important
   deklaracemi porad rozhoduje specificita a to pravidlo ma (1 id, 4 tridy,
   2 typy) proti nasim (0, 2, 1). Opraveno na strane obsah css pridanim
   :not([class*="zs26-vyj"]). !important tady zustava jako pojistka proti
   content2024.css, ktery na holy button taky sahá. */
body.zs26-vyj .zs26-vyj-chip {
  appearance: none;
  font: inherit;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1;
  color: var(--zs-barva-text-nadpis) !important;
  background: #fff !important;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  border-radius: 999px !important;
  padding: 10px 16px !important;
  cursor: pointer;
  min-height: 40px;
}
body.zs26-vyj .zs26-vyj-chip:hover { border-color: var(--zs-barva-akce-tmave) !important; }
body.zs26-vyj .zs26-vyj-chip:focus-visible {
  outline: 2px solid var(--zs-barva-akce-tmave);
  outline-offset: 2px;
}
body.zs26-vyj .zs26-vyj-chip--aktivni {
  background: var(--zs-barva-akce-primarni) !important;
  border-color: var(--zs-barva-akce-primarni) !important;
  color: var(--zs-barva-akce-primarni-text) !important;
}
/* vylouceno se cte jako prekrtnuti, ne jako zapnuta volba */
body.zs26-vyj .zs26-vyj-chip--filtr.zs26-vyj-chip--aktivni {
  background: var(--zs-barva-akce-tmave) !important;
  border-color: var(--zs-barva-akce-tmave) !important;
  color: var(--zs-barva-text-inverzni) !important;
  text-decoration: line-through;
}
body.zs26-vyj .zs26-vyj-pozor {
  font-size: 13px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
  margin: var(--zs-odstup-sm) 0 0;
}
body.zs26-vyj .zs26-vyj-stav-filtru {
  font-size: 14px;
  font-weight: 600;
  color: var(--zs-barva-text-odkaz);
  margin: var(--zs-odstup-xs, 8px) 0 0;
  min-height: 21px;
}

/* ---------- legenda ikon ---------- */
body.zs26-vyj .zs26-vyj-legenda {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zs-odstup-sm);
  margin: 0 0 var(--zs-odstup-lg);
}
body.zs26-vyj .zs26-vyj-legenda__nadpis {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj .zs26-vyj-legenda__polozka {
  appearance: none;
  font: inherit;
  font-size: 14px !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px 6px 6px !important;
  background: #fff !important;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  border-radius: 999px !important;
  color: var(--zs-barva-text-nadpis) !important;
  cursor: pointer;
  min-height: 40px;
}
body.zs26-vyj .zs26-vyj-legenda__polozka img { width: 24px; height: 24px; display: block; }
body.zs26-vyj .zs26-vyj-legenda__polozka--aktivni {
  border-color: var(--zs-barva-akce-tmave) !important;
  background: var(--zs-barva-pozadi-sekce) !important;
  font-weight: 700;
}

/* ---------- jadro: jedna cena misto osmi ----------
   Kdyz je vybrana rada, zbyde u jidla jeden formular. Popisek kJ se schova,
   protoze velikost uz je zvolena nahore a opakovat ji u kazde ceny je sum. */
/* Radek, kde engine posila jedinou cenu, se negatuje vubec: cena je videt vzdy.
   Priznak dava JS podle poctu formularu v radku, viz oznac(). */
body.zs26-vyj .dnesnimenu .vyjimky_buttony[data-zs26-jedna-cena] form.cenaButton { display: block; }
body.zs26-vyj .dnesnimenu .vyjimky_buttony[data-zs26-jedna-cena] .zs26-vyj-rozsah { display: none !important; }

body.zs26-vyj[data-zs26-rada] .dnesnimenu .vyjimky_buttony:not([data-zs26-jedna-cena]) form.cenaButton { display: none; }
body.zs26-vyj[data-zs26-rada] .dnesnimenu .vyjimky_buttony:not([data-zs26-jedna-cena]) form.cenaButton[data-zs26-vybrano] { display: block; }
body.zs26-vyj[data-zs26-rada] .dnesnimenu .vyjimky_buttony:not([data-zs26-jedna-cena]) .zs26-vyj-rozsah { display: none; }
body.zs26-vyj[data-zs26-rada] .dnesnimenu .vyjimky_buttony form.cenaButton[data-zs26-vybrano] .cena .kj { display: none; }

/* Dokud rada vybrana neni, ukaze se misto osmi tlacitek rozsah ceny.
   Menu se da prohlizet, cena je poctiva a nic se nepredvybira potichu. */
body.zs26-vyj[data-zs26-rada=""] .dnesnimenu .vyjimky_buttony:not([data-zs26-jedna-cena]) form.cenaButton { display: none; }
body.zs26-vyj[data-zs26-rada=""] .dnesnimenu .vyjimky_buttony:not([data-zs26-jedna-cena]) .zs26-vyj-rozsah { display: inline-block; }
/* vzhled rozsahu je v sekci menu dne, tady se jen prepina viditelnost */

/* ---------- filtr: co je skryte ---------- */
body.zs26-vyj [data-zs26-skryto="1"] { display: none !important; }

/* ---------- souhrn ---------- */
body.zs26-vyj #objednavka .zs26-vyj-souhrn {
  margin-top: var(--zs-odstup-base);
  padding-top: var(--zs-odstup-base);
  border-top: 1px solid var(--zs-barva-ramecek-karta, var(--zs-barva-ramecek-pole));
}
body.zs26-vyj .zs26-vyj-souhrn {
  margin: var(--zs-odstup-base) 0 0;
  padding: var(--zs-odstup-base) 0 0;
  border-top: 1px solid var(--zs-barva-ramecek-pole);
}
body.zs26-vyj .zs26-vyj-souhrn__stav {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-sm);
}
body.zs26-vyj .zs26-vyj-souhrn__popis {
  font-size: 13px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
  margin: var(--zs-odstup-xs, 8px) 0 0;
}
body.zs26-vyj .zs26-vyj-tlacitko {
  appearance: none;
  font: inherit;
  font-size: 15px !important;
  font-weight: 700;
  line-height: 1;
  color: var(--zs-barva-akce-primarni-text) !important;
  background: var(--zs-barva-akce-primarni) !important;
  border: 0 !important;
  border-radius: var(--zs-radius-pill) !important;
  padding: 14px 20px !important;
  width: 100%;
  min-height: 48px;
  cursor: pointer;
}
body.zs26-vyj .zs26-vyj-tlacitko:disabled { opacity: 0.45; cursor: not-allowed; }
body.zs26-vyj .zs26-vyj-tlacitko:hover { background: var(--zs-barva-akce-primarni-hover) !important; }
body.zs26-vyj .zs26-vyj-tlacitko:focus-visible {
  outline: 2px solid var(--zs-barva-akce-tmave);
  outline-offset: 2px;
}

/* ---------- mobil ---------- */
@media (max-width: 699px) {
  body.zs26-vyj .zs26-vyj-ovladani {
    grid-template-columns: 1fr;
    gap: var(--zs-odstup-base);
    padding: var(--zs-odstup-base);
  }
  body.zs26-vyj .zs26-vyj-rady,
  body.zs26-vyj .zs26-vyj-filtry { gap: 6px; }
  body.zs26-vyj .zs26-vyj-chip { padding: 10px 14px; font-size: 13px; }
  body.zs26-vyj .zs26-vyj-legenda { gap: 6px; }
}
/* ---------- karta na jeden radek, ZRUSENO 31. 8. 2026 ----------
   Puvodne tady byl dvousloupcovy grid na .dnesnimenu.plocha, ktery kladl
   .jidelnicek_polozka a .vyjimky_buttony vedle sebe, protoze jsou to sourozenci
   a vrstva uzly nepresouva. Platil ale az po volbe velikosti porce, takze
   stranka pred volbou a po volbe vypadala jinak.

   Od 31. 8. je grid o patro niz, na obalu div.radek_mujvyber, ktery engine
   kolem kazdeho jidla kresli. Je to spolehlivejsi (radek si drzi svoje sloupce
   sam), plati ve vsech stavech, a panel se slozenim se do nej vejde pres oba
   sloupce. Sekce menu dne vyse.

   Zaloha pro markup bez obalu: kdyby engine .radek_mujvyber prestal kreslit,
   polozky spadnou pod sebe. Neni to rozbite, jen uzsi. */

/* ---------- jidlo, ktere uz je v kosiku ----------
   Engine radek v seznamu nijak neoznaci, oznaceni resi vrstva atributem
   data-zs26-vkosiku podle inputu name="pocet" v souhrnu. Bez toho clovek po
   kliknuti nepozna, co uz ma vybrano, a klika totez jidlo znovu.
   Zmereno 26. 8. 2026: trida .cena.act, se kterou vrstva puvodne pocitala,
   se v teto aplikaci neobjevi ani jednou. */
/* Marek 13. 9. 2026: "kdyz je to vybrane, tak to dela tohle skarede
   podkresleni zelenou, mel by to byt podkresleny asi cely radek."
   Mel pravdu: podbarveny byly OBA SLOUPCE mrizky zvlast, tedy nazev vlevo
   a cena vpravo, a mezi nimi zustal bily pruh siroky jako column-gap.
   Podklad proto nese cely radek .radek_mujvyber a sloupce uz zadny nemaji. */
body.zs26-vyj .dnesnimenu .radek_mujvyber[data-zs26-vkosiku] {
  background: var(--zs-barva-akcent-limetka-plo, var(--zs-barva-pozadi-sekce));
  border-color: var(--zs-barva-akce-primarni);
}
body.zs26-vyj .dnesnimenu .jidelnicek_polozka.chod[data-zs26-vkosiku],
body.zs26-vyj .dnesnimenu .vyjimky_buttony[data-zs26-vkosiku] {
  background: none;
}
body.zs26-vyj .dnesnimenu .jidelnicek_polozka.chod[data-zs26-vkosiku] .nazev::after {
  content: "v objednávce";
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-left: var(--zs-odstup-sm);
  padding: 0 10px;
  border-radius: var(--zs-radius-pill);
  background: var(--zs-barva-akce-primarni);
  color: var(--zs-barva-akce-primarni-text);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

/* Marek 12. 9. 2026 k pravemu panelu: "je moc naplne a teto trochu nerozumim."
   Panel mel ctyri sdeleni nad sebou. Veta enginu "Objednejte si klikanim na
   pozadovane jidlo." rika totez, co rika sam seznam s tlacitky plus, takze
   odchazi a zustava stav + veta pod tlacitkem.
   :only-child je pojistka: jakmile engine do .objednavka.plocha vykresli
   polozky kosiku, uz to jedinacek neni a pravidlo se neuplatni. */
body.zs26-vyj #objednavkaResume .objednavka.plocha > p:only-child { display: none !important; }

/* ---------- hlavicka stranky ----------
   Vzor: 5 z 5 svetovych konkurentu ma nad seznamem nadpis, ktery pojmenuje,
   co si clovek vybira. Do 26. 8. 2026 tady zacinal rovnou prepinac dnu. */
body.zs26-vyj .zs26-vyj-hlavicka {
  max-width: 720px;
  margin: 0 0 var(--zs-odstup-lg);
  padding: 0;
}
body.zs26-vyj .zs26-vyj-hlavicka__nadpis {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-sm);
  padding: 0;
}
body.zs26-vyj .zs26-vyj-hlavicka__perex {
  font-size: 17px;
  line-height: 1.5;
  color: var(--zs-barva-text-zakladni);
  margin: 0;
}

/* ---------- pruh, kdyz filtr neco skryva ---------- */
body.zs26-vyj .zs26-vyj-pruh {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--zs-odstup-sm);
  margin: 0 0 var(--zs-odstup-base);
  padding: var(--zs-odstup-sm) var(--zs-odstup-base);
  border-radius: var(--zs-radius-karta);
  background: var(--zs-barva-akcent-zluta-plo, var(--zs-barva-pozadi-sekce));
  border: 1px solid var(--zs-barva-akcent-zluta, var(--zs-barva-ramecek-pole));
}
body.zs26-vyj .zs26-vyj-pruh__text {
  font-size: 14px;
  line-height: 1.4;
  color: var(--zs-barva-text-nadpis);
  font-weight: 600;
}
body.zs26-vyj .zs26-vyj-pruh__zrusit {
  appearance: none;
  font: inherit;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1;
  min-height: var(--zs-vyska-tlacitko-male);
  padding: 0 var(--zs-odstup-base) !important;
  border-radius: var(--zs-radius-pill) !important;
  border: 1px solid var(--zs-barva-text-nadpis) !important;
  background: #fff !important;
  color: var(--zs-barva-text-nadpis) !important;
  cursor: pointer;
}
body.zs26-vyj .zs26-vyj-pruh__zrusit:hover { background: var(--zs-barva-pozadi-sekce) !important; }

/* ---------- detail jidla v radku ----------
   Slozeni na karte drobnym textem: Factor, Green Chef, HelloFresh, CookUnity,
   tedy 4 z 5. Cisla na karte, protoze je tak ma stavajici jidelnicek
   Zdraveho stravovani a nase karta nema fotku. */
body.zs26-vyj .dnesnimenu .jidelnicek_polozka .zs26-vyj-detail {
  flex: 1 0 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
  /* Odsazeni pod ikonu musi byt padding, ne margin. Zaklad 100 % je sirka
     radku, margin by se k ni pricetl a blok by o 36 px pretekal ven, takze
     by tri tecky u slozeni skoncily za okrajem karty. */
  box-sizing: border-box;
  margin: 2px 0 0;
  padding-left: 36px;
  min-width: 0;
}
body.zs26-vyj .zs26-vyj-nutri {
  font-size: 13px;
  line-height: 1.4;
  color: var(--zs-barva-text-nadpis);
  margin: 0;
  font-variant-numeric: tabular-nums;
}
body.zs26-vyj .zs26-vyj-slozeni {
  appearance: none;
  font: inherit;
  font-size: 13px !important;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  display: flex;
  align-items: baseline;
  /* nowrap je zamerne. S wrap se dlouhy text nezmensi, ale zalomi se pod
     popisek, a misto tri tecek ho pak orizne az okraj bunky mrizky. */
  flex-wrap: nowrap;
  gap: 6px;
  width: 100%;
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: var(--zs-barva-text-tlumeny) !important;
  cursor: pointer;
}
body.zs26-vyj .zs26-vyj-slozeni[aria-expanded="true"] { flex-wrap: wrap; }
body.zs26-vyj .zs26-vyj-slozeni__stitek {
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--zs-barva-text-nadpis);
  text-decoration: underline;
}
/* Jednoradkovy vytah. min-width: 0 je nutne, jinak flexova polozka nezmensi
   pod svuj obsah a text vyleze z radku misto orezani s tremi teckami. */
body.zs26-vyj .zs26-vyj-slozeni__text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.zs26-vyj .zs26-vyj-slozeni[aria-expanded="true"] .zs26-vyj-slozeni__text {
  flex: 1 1 100%;
  overflow: visible;
  white-space: normal;
}
body.zs26-vyj .zs26-vyj-slozeni:hover .zs26-vyj-slozeni__stitek { color: var(--zs-barva-akce-tmave); }

@media (max-width: 699px) {
  body.zs26-vyj .zs26-vyj-hlavicka__nadpis { font-size: 30px; }
  body.zs26-vyj .zs26-vyj-hlavicka__perex { font-size: 15px; }
  body.zs26-vyj .dnesnimenu .jidelnicek_polozka .zs26-vyj-detail { padding-left: 0; }
}

/* ==========================================================================
   Doladeni podle Figmy 600-2, 31. 8. 2026
   ZS-wireframe, stranka "03 Objednavka Menicka", node 600:2. Marek: Muj vyber
   ma vypadat jako Menicko, ale pocet porci u chodu dne nedava smysl a slozeni
   s alergeny musi byt videt.

   Tahle sekce je zamerne az na konci souboru. Prepisuje hodnoty, ktere si
   drzi starsi sekce z 24. az 26. 8., kdy Figma pro tuhle obrazovku jeste
   neexistovala a vzhled se odvozoval z design systemu. Slucovat to zpatky
   do puvodnich sekci ma smysl az potom, co si Marek vzhled odsouhlasi.
   ========================================================================== */

/* ---------- hlavicka stranky, Figma 600:32 ---------- */
body.zs26-vyj .zs26-vyj-hlavicka {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--zs-odstup-base);
  margin: 0 0 var(--zs-odstup-xl);
}
body.zs26-vyj .zs26-vyj-hlavicka__radek {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-base);
  flex: 1 1 auto;
  min-width: 0;
}
body.zs26-vyj .zs26-vyj-hlavicka__text { flex: 1 1 auto; min-width: 0; }
body.zs26-vyj #obsah .zs26-vyj-hlavicka__nadpis {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--zs-barva-text-nadpis);
  margin: 0;
  padding: 0;
}
body.zs26-vyj #obsah .zs26-vyj-hlavicka__perex {
  margin: var(--zs-odstup-sm) 0 0;
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.55;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj #obsah .zs26-vyj-hlavicka__hint {
  flex: 0 1 auto;
  margin: 0;
  padding-bottom: 4px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
  text-align: right;
}
/* puvodni zeleny pruh s uzaverkou: text uz nese hlavicka, pruh odchazi */
body.zs26-vyj #clanek h3[data-zs26-prevzato] { display: none !important; }

/* "dalsi tyden" je pilulka, ne odkaz */
body.zs26-vyj #prepinacDnu .dny .alink,
body.zs26-vyj #prepinacDnu .dalsityden { text-decoration: none !important; }

/* ---------- ovladaci panel: jeden tenky pruh misto tri bloku ----------
   Marek 31. 8. 2026: nastroje zustavaji, ale maji se sbalit do jednoho radku
   nad menu, at neubiraji prostor jidlum. Do teto chvile zabiraly 250 px vysky
   drive, nez clovek uvidel prvni jidlo. */
body.zs26-vyj .zs26-vyj-ovladani {
  display: flex;
  flex-direction: column;
  gap: var(--zs-odstup-md);
  margin: 0 0 var(--zs-odstup-lg);
  padding: var(--zs-odstup-base);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-karta);
}
body.zs26-vyj .zs26-vyj-blok {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--zs-odstup-sm) var(--zs-odstup-md);
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
}
body.zs26-vyj #obsah .zs26-vyj-nadpis {
  flex: 0 0 auto;
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--zs-barva-text-nadpis);
}
body.zs26-vyj #obsah .zs26-vyj-perex,
body.zs26-vyj #obsah .zs26-vyj-pozor {
  flex: 1 0 100%;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj .zs26-vyj-rady,
body.zs26-vyj .zs26-vyj-filtry,
body.zs26-vyj .zs26-vyj-legenda {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
}
body.zs26-vyj #obsah .zs26-vyj-legenda__nadpis {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--zs-barva-text-tlumeny);
}
/* Marek 13. 9. 2026: "tohle neni UX jasne, ze jsou to tlacitka, chapu,
   ze to ma nizsi hierarchii, ale ma to byt jasnejsi, ze jde o filtr."

   Obraci to rozhodnuti z 31. 8. 2026, kdy byla legenda zamerne jen
   vysvetlivka: plochy text oddeleny teckami, bez ramecku. Jenze klikaci
   je, filtruje seznam, a nic to nerikalo.

   Tvar je stejny jako pilulka dne v pasu nahore (:90), o dva px nizsi:
   jedna tvaroslovi na strance, ne treti. Vybrany program se kresli stejne
   jako vybrany den, tedy tmave zelenou vyplni. Limetka se sem nedava,
   ta na teto strance patri konverzni akci, viz pravidlo o hierarchii
   tlacitek; filtr je pomocna akce.

   !important je tu proto, ze novy-2026-obsah.css maluje kazdy button
   v #obsah pres !important, ne kvuli specificite uvnitr vrstvy. */
body.zs26-vyj #obsah .zs26-vyj-legenda__polozka {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 28px !important;
  padding: 0 12px !important;
  border-radius: var(--zs-radius-pill) !important;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  background: var(--zs-barva-pozadi-karta) !important;
  color: var(--zs-barva-text-nadpis) !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none !important;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
body.zs26-vyj #obsah .zs26-vyj-legenda__polozka:hover {
  border-color: var(--zs-barva-akce-primarni) !important;
}
body.zs26-vyj #obsah .zs26-vyj-legenda__polozka--aktivni {
  background: var(--zs-barva-text-nadpis) !important;
  border-color: var(--zs-barva-text-nadpis) !important;
  color: #fff !important;
  font-weight: 600;
}
body.zs26-vyj .zs26-vyj-legenda__polozka img { display: none !important; }

/* chipy vrstvy: pilulky jako ve Figme, mensi nez tlacitka */
body.zs26-vyj #obsah .zs26-vyj-chip.zs26-vyj-chip.zs26-vyj-chip.zs26-vyj-chip,
body.zs26-vyj #obsah .vyberPortion.vyberPortion.vyberPortion.vyberPortion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px !important;
  padding: 0 14px !important;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  border-radius: var(--zs-radius-pill) !important;
  background: #fff !important;
  color: var(--zs-barva-text-nadpis) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  box-shadow: none !important;
  cursor: pointer;
}
body.zs26-vyj #obsah .zs26-vyj-chip--aktivni.zs26-vyj-chip--aktivni.zs26-vyj-chip--aktivni.zs26-vyj-chip--aktivni,
body.zs26-vyj #obsah .vyberPortion.aktiv.aktiv.aktiv.aktiv {
  background: var(--zs-barva-text-nadpis) !important;
  border-color: var(--zs-barva-text-nadpis) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* ---------- souhrn, Figma 603:91 ---------- */
body.zs26-vyj .cast_objednavka > div {
  background: var(--zs-barva-pozadi-sekce-2, var(--zs-barva-pozadi-sekce));
  border-radius: var(--zs-radius-karta);
  padding: var(--zs-odstup-lg);
}
body.zs26-vyj #obsah #objednavka h2,
body.zs26-vyj #obsah #objednavkaResume h2 {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--zs-barva-text-nadpis);
  margin: 0 0 var(--zs-odstup-md);
  padding: 0;
  text-align: left;
}
body.zs26-vyj #obsah #objednavka .objednavka.plocha,
body.zs26-vyj #obsah .zs26-vyj-souhrn__stav,
body.zs26-vyj #obsah .zs26-vyj-souhrn__popis {
  font-size: 14px;
  line-height: 1.55;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj .zs26-vyj-souhrn { margin-top: var(--zs-odstup-md); }
body.zs26-vyj #obsah .zs26-vyj-souhrn__stav { margin: 0 0 var(--zs-odstup-md); }
body.zs26-vyj #obsah .zs26-vyj-souhrn__popis { margin: var(--zs-odstup-sm) 0 0; font-size: 12.5px; }
/* CTA pres celou sirku karty, Figma 603:110 */
body.zs26-vyj #obsah .zs26-vyj-tlacitko.zs26-vyj-tlacitko.zs26-vyj-tlacitko.zs26-vyj-tlacitko {
  display: block;
  width: 100% !important;
  min-height: var(--zs-vyska-tlacitko) !important;
  padding: 0 var(--zs-odstup-base) !important;
  border: 0 !important;
  border-radius: var(--zs-radius-pill) !important;
  background: var(--zs-barva-akce-primarni) !important;
  color: var(--zs-barva-akce-primarni-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  cursor: pointer;
}

/* ---------- mobil, Figma 600:4 a sticky lista 605:163 ---------- */
@media (max-width: 699px) {
  body.zs26-vyj #obsah .zs26-vyj-hlavicka__nadpis { font-size: 32px; }
  body.zs26-vyj #obsah .zs26-vyj-hlavicka__hint { text-align: left; }
  body.zs26-vyj .dnesnimenu .radek_mujvyber { column-gap: var(--zs-odstup-sm); }
  body.zs26-vyj .dnesnimenu .jidelnicek_polozka .jmeno { font-size: 15px; }
  body.zs26-vyj .dnesnimenu .vyjimky_buttony .cena { gap: var(--zs-odstup-sm); font-size: 15px; }
  /* pas dnu roluje vodorovne, pilulky se nelamou do dvou radku */
  body.zs26-vyj #prepinacDnu.tyden { flex-wrap: nowrap; margin-inline: calc(var(--zs-odstup-base) * -1); padding-inline: var(--zs-odstup-base); }
}

/* ---------- vyber velikosti porce kresli od 31. 8. 2026 SERVER ----------
   Zmereno na ostrem webu 31. 8. 2026: v surovem HTML (curl, tedy pred jakymkoliv
   JS) uz jsou tridy zs26-vyj-nadpis, zs26-vyj-perex a zs26-vyj-rady a osm
   tlacitek .vyberPortion, a zadny soubor vrstvy se tam nenacita. Vyvojar tedy
   navrh vrstvy prevzal primo do enginu a redukci "osm cen u jidla na jednu"
   udelal na serveru.

   Pro vrstvu z toho plyne dvoji. Vlastni chipy uz nestavi (postavRady se
   nepusti, protoze u jidla je jeden formular), a naopak MUSI nastylovat uzly,
   ktere prijdou od serveru. Ty sedi primo v #cast_menu, tedy vedle panelu
   vrstvy, ne v nem. Nepresouvame je: presun uzlu enginu by se musel opakovat
   po kazdem AJAXu a je to prvni past teto vrstvy. Slepuji se vizualne. */
body.zs26-vyj .zs26-vyj-ovladani { border-radius: var(--zs-radius-karta) var(--zs-radius-karta) 0 0; margin-bottom: 0; }
body.zs26-vyj #cast_menu > h3.zs26-vyj-nadpis,
body.zs26-vyj #cast_menu > p.zs26-vyj-perex,
body.zs26-vyj #cast_menu > .zs26-vyj-rady {
  background: var(--zs-barva-pozadi-sekce);
  margin: 0;
  padding: 0 var(--zs-odstup-base);
}
body.zs26-vyj #cast_menu > h3.zs26-vyj-nadpis { padding-top: var(--zs-odstup-base); }
body.zs26-vyj #cast_menu > p.zs26-vyj-perex { font-size: 12.5px; color: var(--zs-barva-text-tlumeny); line-height: 1.5; }
body.zs26-vyj #cast_menu > .zs26-vyj-rady {
  padding-bottom: var(--zs-odstup-base);
  padding-top: var(--zs-odstup-sm);
  border-radius: 0 0 var(--zs-radius-karta) var(--zs-radius-karta);
  margin-bottom: var(--zs-odstup-lg);
}
/* panel vrstvy uz neni posledni, spodni radius nese blok porci */
body.zs26-vyj #cast_menu:has(> .zs26-vyj-rady) .zs26-vyj-ovladani { border-radius: var(--zs-radius-karta) var(--zs-radius-karta) 0 0; }

/* ---------- opravy po prvnim srovnani s Figmou, 31. 8. 2026 vecer ---------- */

/* uzaverka ma byt vpravo od nadpisu, ne pod nim: hint se lamal, protoze
   sloupec s textem si bral 1 1 320px a na hint uz nezbylo */
/* align-items: baseline padalo, protoze ucari kontejneru bere z prvni polozky
   a tou je od 31. 8. vnoreny radek s ikonou programu. Jeho ucari lezi na spodni
   hrane obrazku, ne na ucari H1, takze uzaverka vpravo spadla o 79 px niz (1440 px).
   center nestaci, ten vnoreny radek ma 132 px i s perexem a jeho stred neni stred
   nadpisu. Zmereno na nasazene strance 31. 8. 2026. */
body.zs26-vyj .zs26-vyj-hlavicka { flex-wrap: nowrap; align-items: flex-start; }
body.zs26-vyj #obsah .zs26-vyj-hlavicka__perex { max-width: 52ch; }
body.zs26-vyj #obsah .zs26-vyj-hlavicka__hint { flex: 0 0 auto; max-width: 34ch; padding-bottom: 0; }
@media (max-width: 899px) {
  body.zs26-vyj .zs26-vyj-hlavicka { flex-wrap: wrap; }
  body.zs26-vyj #obsah .zs26-vyj-hlavicka__hint { text-align: left; max-width: none; }
}

/* pruh nastroju: bez mezer mezi bloky, at je to jeden pruh a ne tri karty */
body.zs26-vyj .zs26-vyj-ovladani { padding-bottom: var(--zs-odstup-md); }
body.zs26-vyj .zs26-vyj-ovladani .zs26-vyj-legenda { margin-top: 0; }
body.zs26-vyj #cast_menu > .zs26-vyj-rady {
  margin-top: 0 !important;
  border: 0;
  gap: 6px;
}
body.zs26-vyj #cast_menu > h3.zs26-vyj-nadpis { padding-top: var(--zs-odstup-md); font-size: 14px; font-weight: 600; }

/* "predchozi tyden": engine mu dava .dalsityden se sirkou 5em, tedy 68 px,
   ale text potrebuje 118. Pretekal ven z pilulky. Neni to preryv, je to
   pretečení. Namereno na Menicku 31. 8. 2026, plati i tady. */
body.zs26-vyj #prepinacDnu .dny { min-width: max-content; }
body.zs26-vyj #prepinacDnu .dalsityden { width: auto !important; white-space: nowrap; }

/* hlavicka se merila na 720 px proti 1140 px pasu dnu: sedi v #clanek, ktery ji
   nedava plnou sirku. Meritko je pas, ne text. */
body.zs26-vyj .zs26-vyj-hlavicka { width: 100%; }
body.zs26-vyj #obsah .zs26-vyj-hlavicka__hint { max-width: 30ch; }

/* pruh nastroju je jeden blok: zadny z jeho dilu si nesmi drzet vlastni margin,
   jinak mezi nimi probliskne bila a z jednoho pruhu jsou tri karty */
body.zs26-vyj #cast_menu > h3.zs26-vyj-nadpis,
body.zs26-vyj #cast_menu > p.zs26-vyj-perex,
body.zs26-vyj #cast_menu > .zs26-vyj-rady { margin-top: 0 !important; margin-bottom: 0 !important; }
body.zs26-vyj #cast_menu > .zs26-vyj-rady { margin-bottom: var(--zs-odstup-lg) !important; }
/* mezera pod textem o alergiich, at panel nema hluche misto */
body.zs26-vyj .zs26-vyj-ovladani .zs26-vyj-blok { row-gap: var(--zs-odstup-sm); }
body.zs26-vyj #obsah .zs26-vyj-pozor { margin-bottom: 0; }

/* skin drzi na potomcich #obsah max-width, hlavicka vrstvy proto merila 720 px
   proti 1140 px pasu dnu */
body.zs26-vyj .zs26-vyj-hlavicka { max-width: none !important; }
/* prazdne uzly vrstvy nesmi delat misto */
body.zs26-vyj .zs26-vyj-stav-filtru:empty,
body.zs26-vyj .zs26-vyj-perex:empty { display: none !important; }

/* ---------- den bez vypsaneho jidelnicku, Figma 600-2 uzel 600:5 ---------- */
body.zs26-vyj .zs26-vyj-prazdno {
  margin: var(--zs-odstup-base) 0 0;
  padding: var(--zs-odstup-xl) var(--zs-odstup-lg);
  background: var(--zs-barva-pozadi-sekce);
  border-radius: var(--zs-radius-karta);
  text-align: center;
}
body.zs26-vyj #obsah .zs26-vyj-prazdno__nadpis {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--zs-barva-text-nadpis);
}
body.zs26-vyj #obsah .zs26-vyj-prazdno__text {
  margin: var(--zs-odstup-sm) auto 0;
  max-width: 52ch;
  font-size: 14px;
  line-height: 1.55;
  color: var(--zs-barva-text-tlumeny);
}
body.zs26-vyj #obsah .zs26-vyj-prazdno__nenasel {
  margin: var(--zs-odstup-sm) 0 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--zs-barva-text-nadpis);
}
/* obrysove tlacitko, Figma 605:176. Ctyrnasobna trida je nutna: sablona mimo
   vrstvu maluje kazde button v #obsah pres !important (content2024.css:1015),
   a mezi !important deklaracemi rozhoduje specificita. */
body.zs26-vyj #obsah .zs26-vyj-prazdno__akce.zs26-vyj-prazdno__akce.zs26-vyj-prazdno__akce.zs26-vyj-prazdno__akce {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: var(--zs-odstup-base) 0 0 !important;
  min-height: var(--zs-vyska-tlacitko) !important;
  padding: 0 var(--zs-odstup-xl) !important;
  border: 2px solid var(--zs-barva-text-nadpis) !important;
  border-radius: var(--zs-radius-pill) !important;
  background: transparent !important;
  color: var(--zs-barva-text-nadpis) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  box-shadow: none !important;
  cursor: pointer;
}
body.zs26-vyj #obsah .zs26-vyj-prazdno__akce[disabled] { opacity: 0.55; cursor: progress; }
body.zs26-vyj #obsah .zs26-vyj-prazdno__pozn {
  margin: var(--zs-odstup-base) 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--zs-barva-text-tlumeny);
}
/* puvodni holy odstavec enginu, ktery panel nahrazuje */
body.zs26-vyj .dnesnimenu:has(.zs26-vyj-prazdno) > p { display: none; }

/* perex bloku porci ztracel odsazeni a vytekal ven ze zeleneho pruhu */
body.zs26-vyj #cast_menu > h3.zs26-vyj-nadpis,
body.zs26-vyj #cast_menu > p.zs26-vyj-perex,
body.zs26-vyj #cast_menu > .zs26-vyj-rady { padding-inline: var(--zs-odstup-base) !important; }

/* ---------- mobilni sticky lista, Figma 600-2 uzel 605:163 ----------
   Listu uz kresli sekce "mobil" vyse na uzlu #celkem_fix .nodesktop, ktery
   engine na mobilu vykresluje sam. Tady se jen vrací viditelnost: na desktopu
   je #celkem_fix skryty (castku nese souhrn), na mobilu je souhrn az pod celym
   seznamem, takze castka musi zustat na ocich.

   Pozor na dvojite listy: kdyz se fixne i #celkem_fix, vzniknou dve pres sebe
   a texty z ::before a ::after se zopakuji. Fixni je jen .nodesktop. */
@media (max-width: 699px) {
  body.zs26-vyj #prepinacDnu #celkem_fix { display: block !important; position: static !important; }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop {
    padding-bottom: calc(var(--zs-odstup-sm) + env(safe-area-inset-bottom, 0px));
    text-decoration: none;
  }
  /* castka je hlavni cislo listy, popisek jen doprovod */
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop span { font-size: 18px; font-weight: 700; }
}

/* Engine posila do listy vlastni text "Celkem: 0 Kč", takze popisek Celkem
   z ::before ho zdvojoval. Zmereno na mobilu 31. 8. 2026. */
@media (max-width: 699px) {
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop::before { content: none !important; }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop { font-size: 16px; }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop span { color: var(--zs-barva-text-nadpis); }
  body.zs26-vyj #prepinacDnu #celkem_fix .nodesktop::after { white-space: nowrap; }
}

/* Kdyz den nema jidelnicek, engine blok "Jak velke porce" vubec nekresli
   a panel nastroju zustane posledni. Bez tohohle by mel useknuty spodni roh. */
body.zs26-vyj #cast_menu:not(:has(> .zs26-vyj-rady)) .zs26-vyj-ovladani {
  border-radius: var(--zs-radius-karta);
  margin-bottom: var(--zs-odstup-lg);
}

/* ---------- ikona programu u nadpisu, 31. 8. 2026 ----------
   Marek: "pridej tam jeste ikonu muj vyber, at je velka". Tentyz obrazek ma
   program v mrizce na /objednavka.

   Ctyri deklarace jsou tu proti skinu, ne pro vzhled: hlavicka sedi v #clanek
   a 60-zaklad.css maluje #clanek img (max-width, vyska, ramecek). Ma v selektoru
   ID, takze ho pravidlo ze samych trid neprebije ani s !important, viz
   pamet skin-nad-starym-obsahem-joomly. Proto je v selektoru #obsah a hodnoty
   jsou vynucene. */
body.zs26-vyj #obsah .zs26-vyj-hlavicka__ikona {
  flex: 0 0 auto;
  display: block;
  width: auto !important;
  max-width: none !important;
  height: 76px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  align-self: center;
}
@media (max-width: 699px) {
  body.zs26-vyj #obsah .zs26-vyj-hlavicka__ikona {
    height: 52px !important;
    margin-right: var(--zs-odstup-md) !important;
  }
}

/* ================================================================
   Filtr podle slozeni, sbalovaci nastroje. 31. 8. 2026.
   Marek: "chci to mit schovavaci a chci tam vic polozek a alergenu,
   at si clovek opravdu muze zrusit co chce". Filtr od teto verze
   rozhoduje podle deklarace slozeni, ne podle nazvu jidla, a chipy
   se odvozuji z toho, co ten den v jidlech skutecne je.
   ================================================================ */

/* Sbalovaci blok. Puvodni .zs26-vyj-blok je flex RADEK (nadpis vedle chipu),
   sbalovaci verze musi byt sloupec, jinak by se panel postavil vedle nadpisu. */
body.zs26-vyj .zs26-vyj-blok--filtr,
body.zs26-vyj .zs26-vyj-blok--rada {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

/* Sablona maluje kazdy button v #obsah pres !important (content2024.css:1015),
   takze bez !important by tenhle radek byl zeleny obdelnik se 42 px paddingu.
   Viz POZNAMKY.md sekce 1. */
body.zs26-vyj #obsah .zs26-vyj-sbal {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-sm);
  width: 100%;
  margin: 0 !important;
  padding: 6px 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: inherit;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4;
  color: var(--zs-barva-text-nadpis) !important;
  text-align: left;
  cursor: pointer;
}
body.zs26-vyj .zs26-vyj-sbal__nadpis { flex: 0 0 auto; }
body.zs26-vyj .zs26-vyj-sbal__stav {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12.5px;
  font-weight: 400;
  color: var(--zs-barva-text-tlumeny);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Sipka je CSS, ne obrazek: v pruhu nastroju nema co delat dalsi request. */
body.zs26-vyj .zs26-vyj-sbal__sipka {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 120ms ease;
}
body.zs26-vyj .zs26-vyj-sbal[aria-expanded="true"] .zs26-vyj-sbal__sipka {
  transform: rotate(-135deg) translate(-2px, -2px);
}

/* Obsah. display: flex prebiji atribut hidden, proto ta druha rada. */
body.zs26-vyj .zs26-vyj-sbalene {
  display: flex;
  flex-direction: column;
  gap: var(--zs-odstup-sm);
  padding-top: var(--zs-odstup-sm);
}
body.zs26-vyj .zs26-vyj-sbalene[hidden] { display: none !important; }

body.zs26-vyj .zs26-vyj-filtry,
body.zs26-vyj .zs26-vyj-skupina__polozky {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zs-odstup-sm);
}

/* Hledani. Sablona ma na input padding 28px 31px !important a box-shadow
   !important (content2024.css:1004), bez prebiti by pole melo 108 px na vysku. */
body.zs26-vyj #obsah .zs26-vyj-hledani__pole {
  width: 100%;
  max-width: 320px;
  margin: 0 !important;
  padding: 9px 14px !important;
  font: inherit;
  font-size: 14px !important;
  line-height: 20px !important;
  color: var(--zs-barva-text-nadpis);
  background: #fff;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
body.zs26-vyj #obsah .zs26-vyj-hledani__pole:focus {
  border-color: var(--zs-barva-stav-fokus) !important;
  box-shadow: none !important;
  outline: 2px solid var(--zs-barva-stav-fokus);
  outline-offset: 1px;
}

/* Skupiny */
body.zs26-vyj .zs26-vyj-skupiny {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body.zs26-vyj .zs26-vyj-skupina {
  border-top: 1px solid var(--zs-barva-ramecek-karta);
  padding: 2px 0;
}
body.zs26-vyj .zs26-vyj-skupina:first-child { border-top: 0; }
body.zs26-vyj .zs26-vyj-skupina__hlava {
  display: flex;
  align-items: center;
  gap: var(--zs-odstup-sm);
}
body.zs26-vyj #obsah .zs26-vyj-skupina__rozbal {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
  padding: 8px 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: inherit;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--zs-barva-text-nadpis) !important;
  text-align: left;
  cursor: pointer;
}
body.zs26-vyj .zs26-vyj-skupina__pocet {
  font-size: 12px;
  font-weight: 400;
  color: var(--zs-barva-text-tlumeny);
}
/* Kolik polozek ze skupiny je zaskrtnutych. Prazdny atribut = zadna. */
body.zs26-vyj .zs26-vyj-skupina[data-zs26-vybrano]:not([data-zs26-vybrano=""]) .zs26-vyj-skupina__nazev {
  font-weight: 700;
}
body.zs26-vyj #obsah .zs26-vyj-skupina__vse {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 5px 12px !important;
  background: #fff !important;
  border: 1px solid var(--zs-barva-ramecek-pole) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font: inherit;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--zs-barva-text-tlumeny) !important;
  cursor: pointer;
}
body.zs26-vyj #obsah .zs26-vyj-skupina__vse--aktivni {
  background: var(--zs-barva-akce-tmave) !important;
  border-color: var(--zs-barva-akce-tmave) !important;
  color: var(--zs-barva-text-inverzni) !important;
}
body.zs26-vyj .zs26-vyj-skupina__polozky { padding: 0 0 var(--zs-odstup-sm); }
body.zs26-vyj .zs26-vyj-skupina__polozky[hidden] { display: none !important; }

/* Cislo u chipu rekne, kolika jidel se to dnes tyka. Bez nej clovek nevi,
   jestli si vyloucenim vezme jedno jidlo, nebo polovinu nabidky. */
body.zs26-vyj .zs26-vyj-chip__n {
  margin-left: 6px;
  font-size: 12px;
  font-weight: 400;
  opacity: 0.7;
}
/* Tecka rekne, ze to kuchyne uvadi jako alergen. Neni to slib bezpecnosti,
   proto tecka a title, ne barevny stitek pres pul chipu. */
body.zs26-vyj .zs26-vyj-chip__alergen {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 6px;
  vertical-align: 1px;
  border-radius: 50%;
  background: var(--zs-barva-stav-pozor);
}
body.zs26-vyj .zs26-vyj-chip--aktivni .zs26-vyj-chip__alergen { background: currentColor; }

body.zs26-vyj .zs26-vyj-prazdno {
  margin: 0;
  font-size: 13px;
  color: var(--zs-barva-text-tlumeny);
}

/* Jidlo bez deklarace slozeni. Filtr ho necha v nabidce, ale rekne proc. */
body.zs26-vyj .zs26-vyj-bezslozeni {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border: 1px solid var(--zs-barva-ramecek-pole);
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--zs-barva-text-tlumeny);
  white-space: nowrap;
}

@media (max-width: 700px) {
  body.zs26-vyj .zs26-vyj-sbal__stav { font-size: 12px; }
  body.zs26-vyj #obsah .zs26-vyj-hledani__pole { max-width: none; }
  body.zs26-vyj .zs26-vyj-skupina__polozky { gap: 6px; }
  body.zs26-vyj .zs26-vyj-bezslozeni { margin-left: 0; margin-top: 4px; }
}

/* Sbaleni serverem kresleneho bloku "Jak velke porce?". Vlastni tlacitko nese
   nadpis, puvodni h3 se proto skryva vzdy, perex a chipy jen kdyz je sbaleno.
   Uzly enginu se nepresouvaji ani nemazou, meni se jen atribut na #cast_menu. */
body.zs26-vyj #cast_menu > .zs26-vyj-sbal--server { padding: 10px 0 !important; }
body.zs26-vyj #cast_menu:has(> .zs26-vyj-sbal--server) > h3.zs26-vyj-nadpis { display: none !important; }
body.zs26-vyj #cast_menu[data-zs26-rada-sbaleno="1"] > p.zs26-vyj-perex,
body.zs26-vyj #cast_menu[data-zs26-rada-sbaleno="1"] > .zs26-vyj-rady { display: none !important; }

/* Doladeni po prvnim snimku, 31. 8. 2026 vecer.
   1. "vse" patri k nazvu skupiny, ne na pravy okraj. Na 720 px sirokem sloupci
      od sebe byly 680 px a necetly se jako jedna vec.
   2. Radek skupiny nemel zadnou znacku, ze se rozbaluje. Dostava tutez sipku
      jako sbalovaci blok.
   3. Serverem kresleny blok porci visel na bilem pozadi mimo zeleny pruh,
      protoze puvodni h3 se skryva a moje tlacitko jeho styl nemelo. */
body.zs26-vyj .zs26-vyj-skupina__hlava { justify-content: flex-start; }
body.zs26-vyj #obsah .zs26-vyj-skupina__rozbal { flex: 0 1 auto; }
body.zs26-vyj .zs26-vyj-skupina__rozbal .zs26-vyj-sbal__sipka {
  color: var(--zs-barva-text-tlumeny);
  transform: rotate(-45deg) translate(-1px, 1px);
}
body.zs26-vyj .zs26-vyj-skupina__rozbal[aria-expanded="true"] .zs26-vyj-sbal__sipka {
  transform: rotate(45deg) translate(-2px, -2px);
}

/* #obsah .zs26-vyj-sbal ma background: none !important (musi, sablona maluje
   kazdy button), takze zelene pozadi bez !important neprojde a radek s porcemi
   visel na bilem. Naslo se az na snimku, v DOMu to videt neni. */
body.zs26-vyj #obsah #cast_menu > .zs26-vyj-sbal--server {
  background: var(--zs-barva-pozadi-sekce) !important;
  margin: 0 !important;
  padding: var(--zs-odstup-sm) var(--zs-odstup-base) !important;
  /* width: auto srazilo radek na sirku obsahu, takze zeleny pruh koncil
     uprostred a pod nim svitila bila. Videt to bylo az na snimku. */
  width: 100%;
  box-sizing: border-box;
}
/* Kdyz jsou porce sbalene, spodni zaobleni a odstup nese moje tlacitko,
   protoze .zs26-vyj-rady je display: none a radius by se ztratil. */
body.zs26-vyj #obsah #cast_menu[data-zs26-rada-sbaleno="1"] > .zs26-vyj-sbal--server {
  border-radius: 0 0 var(--zs-radius-karta) var(--zs-radius-karta) !important;
  padding-bottom: var(--zs-odstup-base) !important;
  margin-bottom: var(--zs-odstup-lg) !important;
}
/* "vse" u dvanacti skupin se ridilo sirkou nazvu, takze pilulky stály
   na dvanacti ruznych mistech. Sloupec je pevny, at je z toho seznam. */
body.zs26-vyj #obsah .zs26-vyj-skupina__rozbal { min-width: 240px; }
@media (max-width: 700px) {
  body.zs26-vyj #obsah .zs26-vyj-skupina__rozbal { min-width: 0; flex: 1 1 auto; }
}


/* ==========================================================================
   HLAVICKA JAKO U OBJEDNAVKY PROGRAMU, 13. 9. 2026
   Marek 12. 9. 2026: "tady v hlavicce by melo byt jasne, ze to je objednavka
   Muj vyber. Tak jak mame objednavku programu, ta hlavicka by mela vypadat
   podobne, nebo mluvit k zakaznikovi stejne."

   Vzor je pas modulu 149 na /objednavka, zmereny 13. 9. 2026 na webvyvoj:
   .pas.m149 left 0, sirka 1440 (pres celou stranku), pozadi rgb(31,63,42),
   nadpis 30 px a podnadpis 15 px v barve rgb(243,253,238).
   Stejne hodnoty nese blok U5 v css/novy-2026-objednavka.css:2464.

   Pas pres celou sirku kresli pseudoprvek, ne sirka hlavicky. Tri cesty,
   ktere sem nevedly, at je nikdo nezkousi znovu:
     1. margin-inline: calc(50% - 50vw) na hlavicce. Box se nerozsiril,
        hlavicka sedi ve dvou obalech uvnitr #clanek (zmereno 13. 9. 2026,
        zustalo 1140 misto 1440).
     2. box-shadow se spreadem. Funguje, ale nahrat-vrstvu.py ho zablokuje
        a pravem: v designu nejsou stiny.
     3. z-index: -1 na pseudoprvku. #obsah ma bile pozadi a zaporna vrstva
        se kresli POD pozadi beznych bloku, takze by pas zmizel pod nim.
   Proto je pseudoprvek bez z-indexu a text nad nim drzi position: relative:
   pozicovany sourozenec pozdeji v DOMu se kresli nad pozicovanym ::before.
   Obsah zustava na 150 px a licuje s pasem dnu pod sebou, misto aby zacinal
   na 55 px jako pas na /objednavka.

   overflow-x: clip na #obsah je pojistka proti vodorovnemu rolovani: 100vw
   pocita i klasicky scrollbar (Windows), takze pas je o jeho sirku sirsi
   nez okno. Clip, ne hidden: hidden by udelal ze #obsah rolovaci plochu
   a sticky pravy sloupec souhrnu by se prestal chytat okna.

   POZOR na specificitu, je to tataz past, jakou uz popisuje
   25/css-obsah/72-jak-to-funguje.css:305 a 63-programy.css:764.
   60-zaklad.css:299 ma na odstavce v obsahu
   #obsah > .main_limit.obsah p:not(.zs26 *), tedy 1 id, 5 trid a 2 typy,
   a hlavicka vrstvy uvnitr .main_limit.obsah lezi. Pravidlo ze samych trid
   to neprebije: zmereno 13. 9. 2026, perex drzel 16 px i se zdvojenou tridou
   (1 id, 4 tridy). Resi to DRUHE ID, ne !important, stejne jako u .zs-cena
   a u nazvu jidla v postrannim panelu. Proto je v selektorech #obsah #clanek.

   Ikona programu z pasu odchazi. Je to tmave zelena kresba a na tmave zelenem
   podkladu neni videt; /objednavka zadnou ikonu nema, takze sjednoceni ji
   nepotrebuje. Zpet se pousti smazanim pravidla na __ikona.
   ========================================================================== */
body.zs26-vyj #obsah { overflow-x: clip; }
/* Marek 13. 9. 2026: "jeste je tam bily pruh, ktery tam nema byt, ma to byt
   nalepene az k headeru."

   Ten pruh je horni padding obsahove obalky: 60-zaklad.css dava
   #obsah > .main_limit.obsah padding-block var(--zs-odstup-sekce),
   coz je 64 px na 1440 (zmereno 13. 9. 2026). Dokud byla hlavicka bila,
   nebyl videt; jakmile je z ni tmavy pas, je z toho mezera mezi hlavickou
   webu a pasem. Ruší se jen horni strana, spodni odsazeni pred patickou
   zustava, a jen na teto strance.

   Zdvojena trida .obsah je kvuli specificite: zakladni pravidlo ma
   1 id a 4 tridy (:has, :not, .main_limit, .obsah), pravidlo vrstvy
   s jednim #obsah jen 3. Pata trida ho prebije bez !important. */
body.zs26-vyj #obsah > .main_limit.obsah.obsah { padding-top: 0; }

body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka {
  position: relative;
  display: block;
  margin: 0 0 var(--zs-odstup-xl);
  padding: var(--zs-odstup-lg) 0;
  background: none;
  height: auto !important;
}
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  background: var(--zs-barva-pozadi-tmave);
}
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__radek {
  position: relative;
  display: block;
  flex: none;
}
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__nadpis {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--zs-barva-text-na-tmavem);
  margin: 0;
  padding: 0;
}
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__perex {
  margin: 6px 0 0;
  max-width: 62ch;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--zs-barva-text-na-tmavem);
}
/* Uzaverka je treti radek, ne text vpravo: tlumena, ale citelna.
   Na tmave zeleni to dela snizena pruhlednost, ne seda barva, stejne jako
   .zs26-obj-duvera v pasu na /objednavka. */
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__hint {
  position: relative;
  display: block;
  flex: none;
  margin: 10px 0 0;
  padding: 0;
  max-width: none;
  font-size: 13px;
  line-height: 1.5;
  color: var(--zs-barva-text-na-tmavem);
  opacity: 0.78;
  text-align: left;
}
body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__ikona { display: none !important; }

@media (max-width: 699px) {
  body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka {
    padding-top: var(--zs-odstup-base);
    padding-bottom: var(--zs-odstup-base);
  }
  body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__nadpis { font-size: 24px; }
  body.zs26-vyj #obsah #clanek .zs26-vyj-hlavicka__perex { font-size: 14px; }
}