/* Mapa sálu — mobil first. Barvy z GP proměnných webu Frídy, s fallbacky,
   aby plán fungoval i mimo šablonu (lokální testy). */
/* Proměnné plánu visely do 16. 9. 2026 na třídě `.frida-vst`, kterou ale
   **nic nevypisuje** — byl to obal starého shortcode `[frida_mapa]`, který
   odešel 15. 9. s WooCommerce. Tím se pod nohama utrhla i všechna pravidla
   sedadel níž a plán na webu se vykreslil z tlačítek motivu (pasti §92).
   Scope je proto `.frida-rozhrani` — `<main>` rezervačního rozhraní, tedy
   prvek, který na stránce opravdu je. Administrace má tytéž proměnné na `.sp`
   (`sprava.css`), takže neomezená pravidla (jeviště, mřížka, sektory) fungují
   i tam. Rozměr sedadla je sdílený, viz `plan-spolecne.css`. */
.frida-rozhrani {
  --vst-modra: var(--accent, #4e98de);
  --vst-tmava: var(--modra-tmava, #041a21);
  --vst-seda: var(--seda, #d0d0d0);
  --vst-bila: var(--base-3, #fff);
  --vst-sedadlo: 26px;          /* velikost sedadla na mobilu */

  /* Barvy stavů sedadla. Musí je znát PLÁN i LEGENDA — do 16. 9. 2026 měla
     každá svoje: legenda kreslila „Vaše sedadla" skoro černě (`--vst-tmava`),
     zatímco vybrané sedadlo v plánu svítilo zeleně. Divák se pak podle
     legendy neměl jak zorientovat. */
  /* VYBRANÉ sedadlo. Do 0.77.0 to byla zelená #1a6f48 — a **tatáž zelená je
     třetí barva v paletě cenových pásem** (`frida_sal_barvy_pasem()`).
     V sále se dvěma pásmy pak legenda ukazovala „460 Kč" a „Vaše sedadla"
     ve stejném odstínu; fajfka to sice rozlišovala, ale až na druhý pohled
     a jen u jednoho sedadla z padesáti (nahlásil Tom 16. 9. 2026).

     Frída tmavá je řešení, ne kompromis: **v paletě pásem není a být nemůže**
     (pásmo musí zůstat čitelné jako cena), takže se výběr nemá s čím splést.
     Výběr je navíc STAV, ne kategorie — a stav se má lišit jinak než dalším
     odstínem v téže řadě. Fajfka i bílý prstenec zůstávají. */
  --vst-moje: var(--modra-tmava, #041a21);
  --vst-obsazeno: #e3e6ea;
  --vst-obsazeno-obrys: #6f7784;
}

/* --- stavové hlášky --- */
.frida-vst-stav { padding: 1.5em 0; color: var(--contrast-2, #575760); }
.frida-vst-chyba {
  margin: 1em 0 0; padding: 0.75em 1em; border-radius: 4px;
  background: #fdecea; color: #8a1c13; font-size: 0.95em;
}

/* --- jeviště a legenda --- */
/* Jeviště je vlastní oblast mřížky nad prostředním sloupcem, takže sedí nad
   hlavním blokem sedadel samo od sebe. Levý okraj dorovnává sloupec s číslem
   řady, aby střed jeviště seděl na sedadlech, ne na popiscích. */
.frida-vst-jeviste {
  /* šířku si sál nastavuje sám (JS); jeviště přitom zůstává na ose sálu.
     Všechny délky jsou násobkem sedadla (viz mřížka výš) — jinak by jeviště
     v jednom prostředí vycházelo širší než hlediště a v druhém užší.
     Hodnoty odpovídají dnešní Správě při sedadle 26 px. */
  grid-area: jeviste; justify-self: center; max-width: 100%;
  margin: 0 0 calc(var(--vst-sedadlo, 26px) * 0.6923) calc(var(--vst-sedadlo, 26px) * 1.2692);
  padding: calc(var(--vst-sedadlo, 26px) * 0.2163);
  min-width: calc(var(--vst-sedadlo, 26px) * 6.9231);
  background: var(--vst-tmava); color: var(--vst-bila);
  text-align: center; letter-spacing: 0.3em;
  font-size: calc(var(--vst-sedadlo, 26px) * 0.4327);
  border-radius: 0 0 60px 60px / 0 0 24px 24px;
}
.frida-vst-legenda { display: flex; flex-wrap: wrap; gap: 0.75em 1.25em; margin-bottom: 1.25em; font-size: 0.8em; }
.frida-vst-legenda span { display: inline-flex; align-items: center; gap: 0.4em; }
.frida-vst-legenda i {
  width: 16px; height: 16px; border-radius: 3px; display: inline-block;
  background: var(--barva, var(--vst-modra)); border: 1px solid rgba(0,0,0,.15);
}
/* Legenda ukazuje přesně to, co je v plánu — stejné proměnné, včetně obrysu. */
.frida-vst-legenda i.je-obsazeno { background: var(--vst-obsazeno); border-color: var(--vst-obsazeno-obrys); }
/* Legenda musí vysvětlovat TEN SIGNÁL, ne barvu — proto i tady fajfka.
   Barva vybraného sedadla se od 0.74.0 smí opakovat v cenových pásmech,
   takže samotný zelený čtvereček by u „Vaše sedadla" mátl. */
.frida-vst-legenda i.je-vybrano {
  background: var(--vst-moje); box-shadow: inset 0 0 0 2px #fff;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: .8em; font-weight: 700; line-height: 1;
}
.frida-vst-legenda i.je-vybrano::after { content: "✓"; }

/* --- plán: vodorovný posuv u širokých sálů, sektory v mřížce okolo jeviště --- */
.frida-vst-plan-posuv { overflow-x: auto; overflow-y: hidden; padding-bottom: 0.5em; -webkit-overflow-scrolling: touch; }
.frida-vst-plan { display: inline-block; min-width: 100%; width: max-content; }

/* Mřížka 3×3 kolem jeviště (viz sal.php): prázdné buňky se vůbec nevytvářejí,
   takže se sloupce i řádky samy smrsknou na to, co sál opravdu má. */
/* ── VŠECHNY rozměry plánu jsou násobkem šířky sedadla ──────────────────
   Do 0.78.0 byly mezery v `em` (tedy podle písma toho kterého prostředí)
   a některé natvrdo v pixelech. Sedadlo je přitom na webu 30 px a v plánovači
   Správy 26 px, takže **tentýž sál vypadal v každém prostředí jinak** —
   změřeno na Studiu Y: boční blok přesahoval do hlediště na webu o 2,62 šířky
   sedadla, ve Správě o 1,60 (nahlásil Tom 16. 9. 2026).

   Řešení není srovnat velikost sedadla (tu si každé prostředí volí podle
   svého místa), ale **zbavit plán všech délek, které na sedadle nezávisí**.
   Pak je rozvržení na webu prostou podobností toho ve Správě — a po zmenšení
   na šířku kontejneru vyjde obojí stejně.

   Koeficienty jsou dnešní hodnoty Správy dělené 26 px, takže se plánovač
   nehne ani o pixel; mění se jen web, který se k němu srovná.

   Čísla neměň „od oka". Skript, který obě strany změří a porovná, a co z něj
   vyšlo, je v `docs/vzhled-web.md` §6. */
.frida-vst-mrizka {
  display: grid;
  width: max-content; margin-inline: auto;   /* užší plán stojí na středu kontejneru */
  grid-template-areas:
    ".  jeviste ."
    "jl jc      jp"
    "vl stred   vp"
    "zl zadu    zp";
  grid-template-columns: auto auto auto;
  /* bylo 0.8em 1.5em → 12 px a 22,5 px při sedadle 26 px */
  gap: calc(var(--vst-sedadlo, 26px) * 0.4615) calc(var(--vst-sedadlo, 26px) * 0.8654);
  justify-content: center;
  /* `start`, ne `center`: natočené rohové sektory mají vysoký opsaný obdélník
     a při centrování by mezi hlavním blokem a zadní tribunou zůstal pruh bílé */
  align-items: start;
}
/* bylo 1.2em → 18 px */
.frida-vst-bunka {
  display: flex; align-items: center; justify-content: center;
  gap: calc(var(--vst-sedadlo, 26px) * 0.6923);
}

/* Sektor: popisek + obal řad. Otočení po čtvrtinách se dělá směrem skládání
   (ne transformem) — rotovaný blok by si v mřížce držel původní rozměr a
   sousedy by překryl. Jemný sklon rohových sektorů transform být musí, proto
   dostane obal, kterému JS dopočítá rozměr opsaného obdélníku. */
.frida-vst-sektor { display: flex; flex-direction: column; }
.frida-vst-sektor-obal { position: relative; flex: none; }
.frida-vst-sektor-obal > .frida-vst-sektor {
  position: absolute; top: 50%; left: 50%; width: max-content; transform-origin: center;
}
.frida-vst-sektor-nazev {
  /* bylo 0.5em → 7,5 px. Písmo zůstává v `em` — na geometrii bloku nemá vliv,
     protože odsazení i šířka sloupce s číslem řady jsou pevné. */
  margin-bottom: calc(var(--vst-sedadlo, 26px) * 0.2885);
  /* Písmo taky: u úzkého sektoru (balkon o jednom sedadle) je popisek
     ŠIRŠÍ než sedadla pod ním, takže šířku bloku určuje text. Kdyby zůstal
     v `em`, rozhodovalo by o geometrii plánu písmo prostředí. */
  text-align: center; font-size: calc(var(--vst-sedadlo, 26px) * 0.5769); font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--contrast-2, #575760);
}
/* zarovnání popisků a sektorů na boku je ve sdíleném plan-spolecne.css */
.frida-vst-rady { display: flex; flex-direction: column; }
/* Klasické hlediště je klín souměrný podle osy sálu — kratší řady patří na střed,
   ne k levému okraji. Platí i pro sektory otočené na bok (kříží se osa flexu). */
.frida-vst-sektor[data-zarovnani="stred"] > .frida-vst-rady { align-items: center; }
.frida-vst-sektor[data-otoceni="90"]   > .frida-vst-rady { flex-direction: row-reverse; }
.frida-vst-sektor[data-otoceni="-90"]  > .frida-vst-rady { flex-direction: row; }
.frida-vst-sektor[data-otoceni="180"]  > .frida-vst-rady { flex-direction: column-reverse; }

/* bylo 3px a 4px natvrdo — mezera mezi sedadly musí růst se sedadlem */
.frida-vst-rada {
  display: flex; align-items: center; white-space: nowrap;
  gap: calc(var(--vst-sedadlo, 26px) * 0.1154);
  margin-bottom: calc(var(--vst-sedadlo, 26px) * 0.1538);
}
.frida-vst-sektor[data-otoceni="90"]  .frida-vst-rada,
.frida-vst-sektor[data-otoceni="-90"] .frida-vst-rada {
  flex-direction: column; margin: 0 calc(var(--vst-sedadlo, 26px) * 0.1538) 0 0;
}
.frida-vst-sektor[data-otoceni="180"] .frida-vst-rada { flex-direction: row-reverse; }

/* Číslo řady stojí na začátku řady a **posouvá se s plánem**.

   Do 0.110.17 bylo `position: sticky; left: 0`, aby zůstalo vidět i u plánu
   odsunutého do strany. Jenže zoom škáluje mřížku `transform: scale()` —
   a uvnitř škálovaného prvku si `sticky` počítá své odsazení v té škálované
   soustavě. Čísla se proto při každém přiblížení odlepila a přistála
   uprostřed plánu **přes sedadla** (hlášení Toma 21. 9. 2026; změřeno:
   při měřítku 1,3 a posunu 300 px sedělo číslo 224 px od kraje, ne na kraji).

   Sticky se sem tedy nevrátí, dokud zoom jede přes `transform` — a ten se
   nemění schválně: rotované sektory mají opsaný obdélník **změřený
   v pixelech** (`dorovnejSklony` v `plan-kresli.js`), takže škálování přes
   `--vst-sedadlo` by je rozhodilo. V pokladně plán sticky čísla nikdy neměl
   a nikomu nechyběla. */
.frida-vst-rada-cislo {
  /* bylo 2.2em z písma 0.7em → 23,1 px; padding 0.4em → 4,2 px */
  flex: 0 0 calc(var(--vst-sedadlo, 26px) * 0.8885);
  padding-right: calc(var(--vst-sedadlo, 26px) * 0.1615);
  font-size: calc(var(--vst-sedadlo, 26px) * 0.4038); color: var(--contrast-2, #575760);
  text-align: right;
}
.frida-vst-sektor[data-otoceni="90"]  .frida-vst-rada-cislo,
.frida-vst-sektor[data-otoceni="-90"] .frida-vst-rada-cislo {
  flex: 0 0 auto; position: static; text-align: center; padding: 0 0 0.2em;
}
.frida-vst-sektor[data-otoceni="180"] .frida-vst-rada-cislo {
  text-align: left; padding: 0 0 0 calc(var(--vst-sedadlo, 26px) * 0.1615);
}

/* Uličky se přestěhovaly do `plan-spolecne.css` — musí vypadat stejně na webu,
   v pokladně i v plánovači, a scope `.frida-vst` je nepustil do administrace
   (plán tam vycházel natěsno, pasti §65). */

/* Barvy sedadel NEJSOU tady, ale ve `rozhrani.css`. Tenhle soubor byl
   původně stylopis staré mapy `[frida_mapa]` a měl vlastní sadu pravidel —
   jenže `rozhrani.css` se načítá po něm, takže při stejné specificitě vyhrával
   on a pravidla tady jen mátla (16. 9. 2026 jsem podle nich opravoval barvu
   obsazeného místa a na stránce se nic nezměnilo). Odsud jsou proměnné
   `--vst-*` a rozvržení plánu, rozměr sedadla je v `plan-spolecne.css`. */

/* --- spodní lišta s výběrem --- */
.frida-vst-lista {
  position: sticky; bottom: 0; z-index: 5; margin-top: 1.5em;
  display: flex; flex-wrap: wrap; gap: 0.75em 1em; align-items: center; justify-content: space-between;
  padding: 1em; background: var(--vst-bila); border-top: 2px solid var(--vst-tmava);
  box-shadow: 0 -6px 18px rgba(0,0,0,.08);
}
.frida-vst-tlacitka { display: flex; align-items: center; gap: 1em; margin-left: auto; }
.frida-vst-cena { font-weight: 700; font-size: 1.1em; }
.frida-vst-koupit {
  border: 0; border-radius: 4px; padding: 0.7em 1.4em; cursor: pointer;
  background: var(--vst-modra); color: #fff; font: inherit; font-weight: 700; text-transform: uppercase;
}
.frida-vst-koupit:disabled { background: var(--vst-seda); cursor: not-allowed; }
.frida-vst-koupit:hover:not(:disabled) { background: var(--vst-tmava); }
.frida-vst-casovac { flex-basis: 100%; margin: 0; font-size: 0.8em; color: var(--contrast-2, #575760); }

/* --- od tabletu výš větší sedadla ---
   POZOR: plán tím nevypadá úplně stejně jako v plánovači Správy, který kreslí
   při 26 px. Ruční posuny sektorů jsou v geometrii uložené v absolutních
   pixelech, kdežto mřížka se počítá z `--vst-sedadlo`. Zkusil jsem posuny
   přepočítávat na velikost sedadla (0.77.1) a **nepomohlo to** — rozdíl se
   dokonce zvětšil, takže hlavní příčina je jinde. Změřeno a rozepsáno
   v `docs/vzhled-web.md`; nesahej na to bez měření obou stran. */
@media (min-width: 768px) {
  .frida-rozhrani { --vst-sedadlo: 30px; }
  .frida-rozhrani .frida-vst-sedadlo { font-size: 0.68em; }
}

/* --- sekce „Vstupenky" na detailu představení (obal z frida-core) --- */
.frida-vstupenky-sekce { background: var(--base-2, #f7f8f9); padding: clamp(40px, 6vw, 80px) 1.5em; }
.frida-vstupenky-inner { max-width: 1200px; margin: 0 auto; }
/* Lišta je `sticky` a musí mít neprůhledné pozadí barvy sekce. Číslo řady
   tady dřív bývalo taky — mělo bílé pozadí, aby pod ním neprosvítala sedadla
   — jenže od 0.110.17 sticky není a žádné pozadí nepotřebuje. */
.frida-vstupenky-sekce .frida-vst-lista { background: var(--base-2, #f7f8f9); }

/* --- vstupenka (stránka /vstupenka/<kod>/) --- */
.frida-vstupenka-obal { max-width: 520px; margin: 0 auto; padding: clamp(24px, 5vw, 56px) 1.25em; }
.frida-vstupenka {
  background: #fff; border-radius: 10px; padding: clamp(20px, 4vw, 36px);
  box-shadow: 0 10px 40px rgba(0,0,0,.12); text-align: center;
  border-top: 6px solid var(--stav, #041a21);
}
.frida-vstupenka-stav {
  display: inline-block; background: var(--stav, #041a21); color: #fff;
  padding: 0.35em 1em; border-radius: 999px; font-size: 0.8em;
  text-transform: uppercase; letter-spacing: .08em; font-weight: 700;
}
.frida-vstupenka-nazev { margin: 0.6em 0 0.2em; line-height: 1.1; }
.frida-vstupenka-termin { margin: 0 0 1.2em; color: var(--contrast-2, #575760); }
/* `.frida-vstupenka-misto` a `.frida-vst-mista` (starý model) odešly 22. 9. 2026 — nikdo je nekreslil. */
.frida-vstupenka-qr svg { width: min(260px, 70vw); height: auto; }
.frida-vstupenka-kod { margin: 0.8em 0 0; font-size: 0.85em; color: var(--contrast-2, #575760); }
.frida-vstupenka-pozn { margin: 0.8em 0 0; font-size: 0.9em; color: var(--contrast-2, #575760); }
.frida-vstupenka-obsluha {
  margin-top: 1.6em; padding-top: 1.2em; border-top: 2px solid #041a21;
  display: flex; flex-direction: column; gap: 0.6em; align-items: center;
}
.frida-vstupenka-btn {
  background: #1a7a2e; color: #fff; padding: 0.8em 1.6em; border-radius: 6px;
  font-weight: 700; text-transform: uppercase; text-decoration: none;
}
.frida-vstupenka-btn:hover { background: #041a21; color: #fff; }
@media print {
  .site-header, .site-footer, .frida-vstupenka-obsluha { display: none !important; }
  .frida-vstupenka { box-shadow: none; border: 1px solid #999; }
}

/* Stará přilepená lišta vstupenek (patička 3427) vede na tutéž kotvu jako plán
   sálu — na představení s vlastním prodejem by se s lištou výběru překrývala. */
body.frida-vst-aktivni .frida-cta-lista { display: none !important; }