/* ============================================================================
   Hustá tabulka pro back office („excel-like") — sdílený vzor
   ----------------------------------------------------------------------------
   Zadání 2. 8. 2026: back office je pracovní nástroj, ne výkladní skříň. Seznamy
   a číselníky se prohlížejí desítkami řádků najednou, řadí a filtrují — dlaždice
   na to byly pomalé (jeden záznam = jedna karta = jedno rolování).

   Pravidla tohoto vzoru:
     • řádek nízký (28 px), písmo 13 px — na obrazovku se vejde ~25 řádků,
     • hlavička přilepená nahoře, řadí se klikem (šipka ukazuje směr),
     • čísla vpravo, tabulkové číslice (číslice stejně široké → sloupec sedí),
     • celý řádek je klikací, klávesnice: ↑ ↓ Home End, Enter otevře,
     • akce na konci řádku, tiché dokud na řádek nesáhneš.

   Klientská sekce (/majetek) tenhle vzor NEPOUŽÍVÁ — tam je vzdušný vizuál
   podle mockupu produktového vlastníka. Tohle je jazyk pracovní části.
   ============================================================================ */

.tabulka-obal {
    /* Rolování drží tabulka, ne stránka — hlavička tak má k čemu se přilepit. */
    overflow: auto;
    max-height: var(--tabulka-vyska, 60vh);
    border: 1px solid var(--barva-linka);
    border-radius: 10px;
    background: var(--barva-povrch);
}

.tabulka {
    width: 100%;
    border-collapse: separate;   /* separate, jinak přilepená hlavička ztratí linku */
    border-spacing: 0;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

/* --- hlavička ----------------------------------------------------------- */

.tabulka thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    /* JEDEN ODSTÍN PRO CELOU HLAVIČKU. Do 11. 8. 2026 si ho část buněk přebarvovala scoped
       pravidlem ve stránce — jenže scoped CSS nedosáhne na `<th>` z komponenty SeznamHlavicka,
       takže v jedné hlavičce byly dva odstíny. Barva patří sem, k tabulce, a nikam jinam.

       BÍLÁ, NE ŠEDÁ (11. 8. 2026): šedý pruh přes celou šířku vypadal, jako by tabulka někde
       začínala znovu — oko ho čte jako předěl, ne jako záhlaví. Hlavičku od dat oddělí SILNĚJŠÍ
       SPODNÍ LINKA, což je i jazyk velkých ERP. */
    background: var(--barva-povrch);
    text-align: left;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--barva-text-tlumeny);
    padding: 0 10px;
    height: 30px;
    white-space: nowrap;
    /* Dvojnásobná linka: hlavička se musí oddělit i bez podbarvení. */
    border-bottom: 2px solid var(--barva-linka);
}

/* Řadicí hlavička je tlačítko — klávesnice i odečítač ji tak dostanou zadarmo. */
.tabulka-radit {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    color: inherit;
    cursor: pointer;
}

.tabulka-radit:hover { color: var(--barva-text); }
.tabulka th.je-razeno .tabulka-radit { color: var(--barva-akcent-text); }

/* Šipka drží místo i když se neřadí — hlavička pak při přeřazení neposkakuje. */
.tabulka-sipka {
    font-size: 9px;
    line-height: 1;
    opacity: 0;
}

.tabulka th.je-razeno .tabulka-sipka { opacity: 1; }
.tabulka-radit:hover .tabulka-sipka { opacity: 0.45; }
.tabulka th.je-razeno .tabulka-radit:hover .tabulka-sipka { opacity: 1; }

/* --- svislé oddělení sloupců -------------------------------------------- */

/* Vlasová svislice mezi sloupci, v hlavičce i v datech. Při patnácti sloupcích se oko
   bez ní ztrácí v řádku — vodorovné linky vedou pohled správným směrem, ale nedrží ho
   ve sloupci.

   POLOPRŮHLEDNÁ, ne pevná barva: tatáž tabulka stojí na bílé (povrch) i na světle šedé
   (hlavička, součtové řádky, sudý řádek) a napevno daný odstín by se na jednom z nich
   ztratil a na druhém křičel. Je SLABŠÍ než vodorovná linka záměrně — mřížka má sloupce
   naznačit, ne tabulku rozkreslit na čtverečky.

   Poslední sloupec svislici nemá: byla by to druhá čára hned vedle okraje tabulky. */
.tabulka {
    --tabulka-svislice: rgba(89, 67, 52, 0.09);
}

.tabulka thead th:not(:last-child),
.tabulka tbody td:not(:last-child) {
    border-right: 1px solid var(--tabulka-svislice);
}

/* Rozbalený panel pod řádkem je JEDNA buňka přes celou tabulku — svislice v něm nemá co
   dělit a jen by naznačila sloupec, který tam není. */
.tabulka tbody tr.tabulka-rozsireni td {
    border-right: 0;
}

/* TŘI BACK-OFFICOVÉ TABULKY, KTERÉ `.tabulka` NEPOUŽÍVAJÍ (backlog, přístupy, přihlášení).
   Mají vlastní styl z doby před sjednocením; svislice do nich patří stejně, protože je to
   táž pracovní část. Klientská tvář (`.mjt-tb`) je SCHVÁLNĚ vynechaná — tam platí vzdušný
   vizuál podle mockupu a mřížka by ho rozbila. */
.backlog-tabulka thead th:not(:last-child),
.backlog-tabulka tbody td:not(:last-child),
.pristupy-tabulka thead th:not(:last-child),
.pristupy-tabulka tbody td:not(:last-child),
.prihl-tabulka thead th:not(:last-child),
.prihl-tabulka tbody td:not(:last-child) {
    border-right: 1px solid rgba(89, 67, 52, 0.09);
}

/* --- řádky --------------------------------------------------------------- */

.tabulka tbody td {
    padding: 0 10px;
    height: 28px;
    border-bottom: 1px solid var(--barva-linka);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* Bez plošného max-width: to by useklo i krátké sloupce („Aktivní" → „Aktiv…").
       Ořezávají se jen sloupce označené .sl-hlavni / .sl-text. */
}

.tabulka tbody tr:nth-child(even) td { background: rgba(89, 67, 52, 0.022); }

.tabulka tbody tr.je-klikaci { cursor: pointer; }
.tabulka tbody tr.je-klikaci:hover td { background: var(--c-zelena-svetla); }

.tabulka tbody tr.je-vybrany td {
    /* Jen podbarvení — tučné písmo by v auto-layoutu rozšířilo sloupec a řádek
       by při výběru „poskočil" (viditelné na dlouhých názvech). */
    background: var(--c-zelena-svetla);
    box-shadow: inset 0 0 0 1px rgba(89, 67, 52, 0.10);
}

.tabulka tbody tr:focus-visible {
    outline: 2px solid var(--barva-akcent);
    outline-offset: -2px;
}

.tabulka tbody tr.je-tlumeny td { color: var(--barva-text-tlumeny); }

/* Ikona v řádku — malá, aby řádek zůstal nízký (dlaždice měly 48 px). */
.tabulka-ikona { display: block; width: 22px; height: 22px; object-fit: contain; }

/* --- rozbalený panel pod řádkem (formulář úpravy, ocenění, vlastnictví) --- */

.tabulka tbody tr.tabulka-rozsireni td {
    /* Formulář potřebuje dýchat — tady neplatí nízký řádek ani ořez na jeden řádek. */
    height: auto;
    padding: 0;
    white-space: normal;
    overflow: visible;
    background: var(--barva-pozadi);
}

.tabulka tbody tr.tabulka-rozsireni:hover td { background: var(--barva-pozadi); }

/* Obal bez vlastního rolování — u krátkých seskupených tabulek roluje stránka. */
.tabulka-obal-volny { max-height: none; }

.tabulka .sl-cislo { text-align: right; font-family: var(--font-cisla); }
.tabulka .sl-uzky { width: 1%; }
.tabulka .sl-hlavni { font-weight: 500; max-width: 28ch; }
/* Volný text (poznámka, adresa, popis) — ať jeden dlouhý zápis neroztáhne tabulku. */
.tabulka .sl-text { max-width: 52ch; }
.tabulka .sl-zaporne { color: var(--c-cihlova); }

/* --- jméno s podtitulkem (seznam rodin, ADR-0091) ------------------------- */

/* Podtitulek je DRUHÝ ŘÁDEK TEXTU V TÉŽE BUŇCE, ne druhý řádek tabulky: řádek zůstává jeden,
   takže se dá pořád projet klávesnicí a vybrat kliknutím kamkoli (ADR-0049). Buňka proto jako
   jediná povoluje zalomení — ořez ale zůstává na obou vnitřních řádcích, jinak by dlouhé jméno
   přeteklo do sousedního sloupce (past z CLAUDE.md). */
.tabulka td.sl-rodina {
    white-space: normal;
    height: auto;
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.tabulka .sl-rodina-jmeno,
.tabulka .sl-rodina-podtitulek {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabulka .sl-rodina-podtitulek {
    font-size: 11px;
    font-weight: 400;
    color: var(--barva-text-tlumeny);
}

/* Dovětek „+ EUR, USD" POD částkou: říká, že číslo nad ním není celý majetek rodiny. Tlumeně
   a menším písmem — je to poznámka k číslu, ne druhá hodnota. Pod, a ne za: za číslem by ho
   odsunul od pravé hrany a částky by se přestaly zarovnávat pod sebou, což je jediný důvod,
   proč sloupec s penězi stojí vpravo. */
.tabulka td.sl-majetek { line-height: 1.2; }

.tabulka .sl-majetek-castka { display: block; }

.tabulka .sl-mena-vic {
    display: block;
    font-size: 11px;
    color: var(--barva-text-tlumeny);
}

/* --- akce na řádku ------------------------------------------------------- */

.tabulka .sl-akce {
    width: 1%;
    text-align: right;
    padding-right: 8px;
}

.tabulka-akce {
    padding: 2px 7px;
    border: 1px solid var(--barva-linka);
    border-radius: 6px;
    background: var(--barva-povrch);
    color: var(--barva-text-tlumeny);
    font-size: 11.5px;
    line-height: 1.5;
    cursor: pointer;
    /* Tiché, dokud na řádek nesáhneš — jinak řádek vypadá jako panel s tlačítky. */
    opacity: 0;
    transition: opacity 120ms ease, color 120ms ease, border-color 120ms ease;
}

.tabulka tbody tr:hover .tabulka-akce,
.tabulka tbody tr:focus-within .tabulka-akce { opacity: 1; }

.tabulka-akce:hover:not(:disabled) {
    color: var(--barva-text);
    border-color: var(--c-seda);
}

.tabulka-akce:focus-visible { opacity: 1; outline: 2px solid var(--barva-akcent); }
.tabulka-akce:disabled { cursor: default; }
.tabulka-akce-smazat:hover:not(:disabled) { color: var(--c-cihlova); border-color: var(--c-cihlova); }

/* Dotyk nemá hover — tam ať jsou akce vidět rovnou. */
@media (hover: none) {
    .tabulka-akce { opacity: 1; }
}

/* --- lišta nad tabulkou (hledání, přepínače, počet) ---------------------- */

.tabulka-listva {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
    /* Odsazení VE VŠECH SMĚRECH. Karta pod tabulkou má padding 0 (tabulka má sahat až ke
       svému okraji), takže lišta i stránkovač doléhaly na hranu bílé plochy — vodorovně
       i svisle. Napoprvé jsem dal jen `padding-inline` a hledání pořád viselo na horní
       hraně; svislý směr se sem musí napsat taky.
       Vlevo 10 px = stejně jako buňky tabulky, aby svislá linka textu seděla; mezeru
       k tabulce dělá `margin-bottom`, ne padding. */
    padding: 10px 10px 0;
}

.tabulka-listva .tabulka-pocet {
    margin-left: auto;
    font-size: 12px;
    color: var(--barva-text-tlumeny);
    font-variant-numeric: tabular-nums;
}

/* Údaj vedle počtu (např. „+ 1 archivovaných") — týž tlumený text jako počet, ne tlačítko.
   Je to informace o rozsahu seznamu; zapíná se to ve filtru sloupce. */
.tabulka-pocet-doplnek {
    font-size: 12px;
    color: var(--barva-text-tlumeny);
    font-variant-numeric: tabular-nums;
}

.tabulka-prazdno {
    padding: 14px 10px;
    font-size: 13px;
    color: var(--barva-text-tlumeny);
}

/* --- souhrnný řádek ------------------------------------------------------ */

.tabulka tfoot td {
    position: sticky;
    bottom: 0;
    background: var(--barva-pozadi);
    height: 30px;
    padding: 0 10px;
    font-weight: 700;
    border-top: 1px solid var(--c-seda);
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    .tabulka-akce { transition: none; }
}

/* --- odznak „mimo mandát" (ADR-0050) ------------------------------------- */

/* Soukromá rodina zaměstnance mezi klienty firmy — musí být poznat na první pohled.
   Tlumený, ne poplašný: není to chyba, jen jiná kategorie. */
.odznak-mimo-mandat,
.odznak-ukazkova {
    margin-left: 6px;
    padding: 1px 6px;
    border: 1px solid var(--c-seda);
    border-radius: 999px;
    background: var(--barva-pozadi);
    color: var(--barva-text-tlumeny);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Ukázková (fiktivní) rodina — vymyšlená data pro předvádění a školení. Odlišená od „mimo
   mandát" ostřeji: tohle není jiná kategorie klienta, tohle NENÍ klient. Cihlová, ne zelená —
   ať se to nedá přehlédnout ani na projektoru. */
.odznak-ukazkova {
    border-color: var(--c-cihlova);
    color: var(--c-cihlova);
    background: rgba(166, 70, 46, .07);
}

/* --- řádkový formulář uvnitř husté tabulky (SPEC portfolia §3.2, ADR-0049) ---

   Zápisová cesta v back office je ŘÁDEK přes celou šířku, ne modální okno („no popups").
   Slovník je global, ne scoped: mluví jím víc komponent (formulář titulu, rychlé přecenění)
   a scoped styl jedné z nich by na druhou nedosáhl — právě tahle past už jednou nechala
   vnořenou tabulku bez odsazení (ADR-0056 §důsledky). */

.poz-form-mriz {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}

/* Pole se skládají vedle sebe a zalomí se sama. Pevný počet sloupců by u druhu s pěti poli
   nechal půl řádku prázdné a u druhu s dvanácti by pole rozdrtil. */
.poz-pole {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 9rem;
    min-width: 0;
}

.poz-pole-uzke { flex: 0 1 7rem; }
.poz-pole-siroke { flex: 2 1 15rem; }

.poz-popisek {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--barva-text-tlumeny);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Čísla tabulkovými číslicemi a doprava — stejně jako v tabulce, ať se to čte jako táž věc. */
.poz-cislo {
    font-family: var(--font-cisla);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

/* Zamčené protější cenové pole zešedne, ale nezmizí — má být vidět, že ta možnost existuje. */
.poz-form-mriz .pole:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.poz-form-chyby {
    margin: 8px 0 0;
    padding-left: 1.1rem;
    font-size: 0.76rem;
    line-height: 1.55;
    color: var(--c-cihlova, #A6462E);
}

.poz-form-akce {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* ============================================================================
   STRÁNKOVANÝ SEZNAM (ADR-0065, SPEC §7.2–7.5)
   ----------------------------------------------------------------------------
   Od chvíle, kdy se filtruje a řadí v databázi, potřebuje tabulka tři věci
   navíc: druhý řádek hlavičky s filtry, počitadlo „nalezeno" a stránkovač.

   Zásada, která tenhle blok drží pohromadě: čísla nad tabulkou i pod ní se
   VŽDY vztahují k CELÉMU výběru, ne k viditelné stránce. Proto jsou popsaná
   slovy („z 1 240 nalezených"), ne jen číslem — číslo samo by se dalo přečíst
   jako počet řádků na obrazovce.
   ============================================================================ */

/* --- autofiltr: nabídka hodnot v hlavičce sloupce ------------------------ */
/*
   Nahradilo DRUHÝ ŘÁDEK HLAVIČKY s filtry (do 11. 8. 2026 `tr.tabulka-filtry` + jedno pole
   nebo rozbalovátko na sloupec). Ten bral řádek na každé tabulce, u nefiltrovaných sloupců
   nenesl žádnou informaci a uměl jen JEDNU hodnotu na sloupec. Viz SPEC-autofiltr-hlavicky.
*/

/* POZOR na selektory: nálevka visí i v tabulce Přístupů, která `.tabulka` NENÍ (má vlastní
   `.pristupy-tabulka`). Pravidla se proto vážou na `th.ma-filtr` a `.tab-filtr*`, ne na
   `.tabulka th …` — jinak by tam nálevka zůstala trvale průhledná a filtr by nešel otevřít. */

/* Buňka s nálevkou nesmí mít řadicí tlačítko přes celou šířku — nálevka by neměla kam. */
th.ma-filtr { position: relative; }
th.ma-filtr .tabulka-radit { width: auto; padding-right: 16px; }

.tab-filtr-nalevka {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: none;
    color: var(--barva-text-tlumeny);
    cursor: pointer;
}

.tab-filtr-ikona { width: 10px; height: 10px; }

/* Nálevka se ukazuje až při najetí nebo fokusu — jinak by v každé hlavičce svítila ikona,
   která většinu času k ničemu není. U FILTROVANÉHO sloupce je vidět VŽDYCKY (níž). */
.tab-filtr-nalevka { opacity: 0; }
th.ma-filtr:hover .tab-filtr-nalevka,
th.ma-filtr:focus-within .tab-filtr-nalevka { opacity: 0.55; }
.tab-filtr-nalevka:hover { opacity: 1; color: var(--barva-text); }
.tab-filtr-nalevka:focus-visible { opacity: 1; outline: 2px solid var(--barva-text); outline-offset: 1px; }

/* Že sloupec zužuje výběr, musí být poznat BEZ otevírání nabídky — jinak se hledá, proč
   seznam „nemá data", a přitom v něm jen zůstal filtr z minula. Signál nese VÝPLŇ, ne
   zelený obrys (trvalé přání, 11. 8. 2026). */
th.je-filtrovano .tab-filtr-nalevka {
    opacity: 1;
    color: var(--barva-text);
    background: var(--c-zelena-svetla);
}

/* --- vysunutá nabídka hodnot --- */

/* Panel je `popover` → kreslí se v horní vrstvě prohlížeče, mimo dosah `overflow` obalu
   tabulky i mimo pořadí vrstev stránky. Souřadnice mu dopočítá `js/tabulka.js` při otevření
   (bez toho by prvek v horní vrstvě přistál uprostřed obrazovky). Proto `position: fixed`
   a nulované výchozí okraje, které si popover jinak nastavuje sám. */
.tab-filtr-panel {
    position: fixed;
    inset: auto;
    margin: 0;
    min-width: 150px;
    max-width: 260px;
    /* Delší číselník roluje UVNITŘ panelu, ať se nabídka nikdy neuřízne — uříznutá nabídka
       vypadá jako chybějící hodnoty (a přesně tím tenhle panel jednou začal). */
    max-height: 280px;
    overflow-y: auto;
    padding: 6px;
    background: var(--barva-povrch);
    border: 1px solid var(--barva-linka);
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.13);
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    color: var(--barva-text);
    cursor: default;
}

.tab-filtr-hodnoty { list-style: none; margin: 0; padding: 0; }

.tab-filtr-volba {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 4px 6px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 1.3;
    white-space: normal;
    cursor: pointer;
}

.tab-filtr-volba:hover { background: var(--barva-pozadi); }
.tab-filtr-volba input { margin: 0; flex: none; cursor: pointer; }

/* Textová podoba filtru — sloupec bez uzavřeného číselníku (v deníku „čeho se to týká"). */
.tab-filtr-text {
    width: 100%;
    min-width: 0;
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--barva-linka);
    border-radius: 5px;
    background: var(--barva-povrch);
    color: var(--barva-text);
    font: inherit;
    font-size: 12px;
    text-transform: none;
    letter-spacing: 0;
}

/* Fokusový prstenec NENÍ zelený (trvalé přání) — zelený obrys kolem prvku čte oko jako
   ozdobu, ne jako „tady je kurzor". */
.tab-filtr-text:focus-visible { outline: 2px solid var(--barva-text); outline-offset: -1px; }

.tab-filtr-zrusit {
    width: 100%;
    margin-top: 5px;
    padding: 4px 6px;
    border: 0;
    border-top: 1px solid var(--barva-linka);
    border-radius: 0 0 5px 5px;
    background: none;
    color: var(--barva-text-tlumeny);
    font: inherit;
    font-size: 11.5px;
    text-align: left;
    cursor: pointer;
}

.tab-filtr-zrusit:hover { color: var(--barva-text); background: var(--barva-pozadi); }
.tab-filtr-zrusit:focus-visible { outline: 2px solid var(--barva-text); outline-offset: -2px; }

/* --- lišta nad tabulkou: hledání + počet nalezených ---------------------- */

.tabulka-hledani {
    flex: 0 1 260px;
    min-width: 140px;
    height: 26px;
    padding: 0 9px;
    border: 1px solid var(--barva-linka);
    border-radius: 7px;
    background: var(--barva-povrch);
    color: var(--barva-text);
    font: inherit;
    font-size: 12.5px;
}

.tabulka-hledani:focus-visible { outline: 2px solid var(--barva-akcent); outline-offset: -1px; }

/* Zrušení všech filtrů naráz. Nesvítí, dokud je co rušit. */
.tabulka-zrusit-filtry {
    padding: 2px 8px;
    border: 1px solid var(--barva-linka);
    border-radius: 6px;
    background: var(--barva-povrch);
    color: var(--barva-text-tlumeny);
    font-size: 11.5px;
    cursor: pointer;
}

.tabulka-zrusit-filtry:hover { color: var(--barva-text); border-color: var(--c-seda); }

/* --- stránkovač ---------------------------------------------------------- */

.tabulka-strankovac {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
    /* Stejné odsazení jako lišta nad tabulkou, jen zrcadlově — viz .tabulka-listva.
       Mezeru k tabulce dělá `margin-top`, odsazení od spodní hrany karty `padding-bottom`. */
    padding: 0 10px 10px;
    font-size: 12px;
    color: var(--barva-text-tlumeny);
    font-variant-numeric: tabular-nums;
}

.tabulka-strankovac-rozsah { margin-right: auto; }

/* Zvýrazněné číslo je jediná věc, kterou v pruhu člověk hledá očima. */
.tabulka-strankovac-rozsah strong { color: var(--barva-text); font-weight: 600; }

.tabulka-krok {
    min-width: 28px;
    height: 26px;
    padding: 0 9px;
    border: 1px solid var(--barva-linka);
    border-radius: 7px;
    background: var(--barva-povrch);
    color: var(--barva-text);
    font: inherit;
    font-size: 12px;
    line-height: 1;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.tabulka-krok:hover:not(:disabled):not([aria-disabled="true"]) {
    border-color: var(--c-seda);
    background: var(--c-zelena-svetla);
}

.tabulka-krok:focus-visible { outline: 2px solid var(--barva-akcent); outline-offset: 1px; }

/* Krok na kraji NEMIZÍ, jen zešedne — mizející tlačítko posouvá zbytek lišty
   a člověk pak trefí jiné, než na které mířil. */
.tabulka-krok:disabled,
.tabulka-krok[aria-disabled="true"] {
    opacity: 0.4;
    cursor: default;
    pointer-events: none;
}

.tabulka-strankovac-velikost {
    height: 26px;
    padding: 0 6px;
    border: 1px solid var(--barva-linka);
    border-radius: 7px;
    background: var(--barva-povrch);
    color: var(--barva-text);
    font: inherit;
    font-size: 12px;
}

/* --- součtový pruh NAD stránkovaným seznamem ------------------------------ */

/* Součet stojí NAD tabulkou, ne v `tfoot`: tabulka se roluje, takže patička visela
   až za posledním řádkem a u tří set položek ji nikdo neuviděl. Mimo mřížku navíc
   nezávisí na tom, které sloupce jsou zapnuté, a při vodorovném rolování neuteče.

   Součet MUSÍ říct, že platí přes celý výběr — jinak vypadá jako součet toho,
   co je vidět, a začne lhát (SPEC §7.4). */
.tabulka-souhrn {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 14px;
    margin: 0 0 8px;
    /* Vlevo 10 px = stejně jako buňky tabulky, ať svislá linka textu sedí (týž důvod
       jako u `.tabulka-listva`, a odsazení se píše ve VŠECH směrech). */
    padding: 7px 10px;
    border-top: 1px solid var(--barva-linka);
    border-bottom: 1px solid var(--barva-linka);
}

.tabulka-souhrn .souhrn-popis {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--barva-text-tlumeny);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Jedna částka na měnu, vedle sebe. Sečíst je dohromady by dalo číslo, které vypadá
   jako součet majetku a není jím — kurz do součtu nepatří (týž princip jako rozvaha). */
.tabulka-souhrn .souhrn-castka {
    font-size: 13px;
    font-weight: 600;
    color: var(--barva-text);
    font-variant-numeric: tabular-nums;
}

/* --- prázdný výsledek hledání -------------------------------------------- */

.tabulka-bez-nalezu {
    padding: 18px 10px;
    font-size: 13px;
    color: var(--barva-text-tlumeny);
    text-align: center;
}

.tabulka-bez-nalezu button {
    margin-left: 6px;
    border: 0;
    background: none;
    color: var(--barva-akcent-text);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
}

/* --- přetahování sloupců za hlavičku -------------------------------------- */

th[data-sloupec] { cursor: grab; }
th[data-sloupec]:active { cursor: grabbing; }

/* Táhnutý sloupec zůstane vidět (jen zesvětlá) — zmizelý sloupec by vypadal, že se smazal. */
th.je-tazeny { opacity: 0.45; }

/* Kam se sloupec pustí. Svislá linka, ne rámeček: rámeček kolem buňky se čte jako výběr
   a pruh přesně říká „sem to půjde". */
th.je-cil { box-shadow: inset 3px 0 0 0 var(--barva-text); }

/* Nastavení sloupců na konci hlavičky (vzor Excel / Business Central). Tiché jako akce
   na řádku — objeví se při najetí na hlavičku, ať v klidu nekřičí. */
.tabulka-nastaveni {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: none;
    color: var(--barva-text-tlumeny);
    cursor: pointer;
    /* VIDĚT VŽDYCKY. Do 12. 8. 2026 se ukazovalo až po najetí myší na hlavičku — jenže
       ovládání, které se musí najít omakem, není ovládání. U diskety je to navíc přímo
       škodlivé: neuložená podoba tabulky je stav, o kterém se má člověk dozvědět sám
       od sebe, ne když náhodou přejede přes záhlaví. */
    opacity: 0.6;
    transition: opacity 120ms ease, color 120ms ease;
}

.tabulka-nastaveni svg { width: 14px; height: 14px; }
.tabulka-nastaveni:hover:not(:disabled) { opacity: 1; color: var(--barva-text); }
.tabulka-nastaveni:focus-visible { opacity: 1; outline: 2px solid var(--barva-text); outline-offset: 1px; }

/* DISKETA, když je co uložit. Musí být vidět BEZ najetí myší: schovaná pod hover by znamenala,
   že se člověk o neuložené podobě dozví, jen když náhodou přejede přes hlavičku — a rozdělanou
   práci ztratí odchodem ze stránky, aniž by věděl, že nějaká byla. */
.tabulka-nastaveni.je-neulozeno { opacity: 1; color: var(--barva-text); }
/* Uložený stav se nezdůrazňuje — ikona zůstane vidět (aby bylo poznat, kde se ukládá),
   ale tiše: „nic k uložení" není zpráva, kterou by měl někdo číst. */
.tabulka-nastaveni:disabled { cursor: default; opacity: 0.45; }

/* --- pružná tabulka: šířky sloupců z `colgroup` --------------------------- */

/* `fixed` = šířky určuje `colgroup`, ne obsah. Bez toho si je rozdá prohlížeč podle nejdelší
   buňky a tabulka přeteče za okraj — přesně to vodorovné rolování, kterého se máme zbavit.
   Váhy dávají dohromady 100 %, takže se tabulka do své šířky VŽDYCKY vejde. */
.tabulka-pruzna {
    table-layout: fixed;
    width: 100%;
}

/* Když se šířky určují předem, musí se dlouhý text uříznout — jinak by rozpáral buňku
   a řádky by se rozešly na výšku. Plné znění nese `title` na buňce.

   PLATÍ I NA HLAVIČKU: v pevném rozvržení může být sloupec užší než jeho popisek, a ten
   se pak rozléval do sousední buňky, kde ho přebarvilo její pozadí („MĚNA" → „MĚN/").
   Ořezat ho jde jenom díky tomu, že úchyt na šířku sedí CELÝ uvnitř své buňky — dokud
   přečníval ven, `overflow: hidden` by ho uřízlo a nebylo by za co chytit. */
.tabulka-pruzna td,
.tabulka-pruzna th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Řadicí tlačítko vyplňuje buňku, takže tři tečky musí umět i ono — jinak by se ořez
   projevil až na obalu a popisek by se uťal natvrdo uprostřed písmene. */
.tabulka-pruzna thead .tabulka-radit {
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* Ořezy podle obsahu tady neplatí — o šířce rozhoduje `colgroup`. Zůstat by mohly jedině
   jako past: `max-width: 28ch` vedle váhy 230 vypadá jako dvě různá pravidla o téže věci. */
.tabulka-pruzna .sl-hlavni,
.tabulka-pruzna .sl-text,
.tabulka-pruzna .sl-uzky,
.tabulka-pruzna .sl-akce { max-width: none; width: auto; }

/* Sloupce s prvky pevné velikosti (ikona, tlačítka) dýchají míň — deset pixelů odsazení
   z každé strany je u dvaadvacetipixelového obrázku skoro polovina sloupce. */
.tabulka-pruzna tbody td:first-child,
.tabulka-pruzna thead th:first-child { padding-inline: 5px; }
.tabulka-pruzna .sl-akce { padding-inline: 4px; }

/* --- úchyt na šířku sloupce ---------------------------------------------- */

/* Sedí na PRAVÉ hraně buňky a bere šířku sousedovi vpravo. Široký 7 px, ale opticky je to
   jen linka: menší cíl se myší netrefí (Fittsův zákon), širší by překrýval text hlavičky.

   CELÝ UVNITŘ SVÉ BUŇKY (`right: 0`, ne záporná hodnota). Když přečníval 3 px ven, překryla
   ho SOUSEDNÍ hlavička: všechny `th` jsou `sticky` se stejným `z-index`, takže vyhrává ta
   pozdější v pořadí. `elementFromPoint` v místě úchytu vracel sousední buňku a `mousedown`
   se k úchytu vůbec nedostal — tažení nedělalo nic a v DOM přitom vypadalo v pořádku. */
.sl-tah {
    position: absolute;
    top: 0;
    right: 0;
    width: 7px;
    height: 100%;
    cursor: col-resize;
    /* Nad nálevkou filtru i nad řadicím tlačítkem: obojí bydlí u pravé hrany. */
    z-index: 3;
    user-select: none;
}

/* Linka se ukáže až pod myší — jinak by hlavička měla svislých linek dvakrát tolik
   než tabulka sloupců. */
.sl-tah::after {
    content: "";
    position: absolute;
    top: 20%;
    bottom: 20%;
    right: 3px;
    width: 1px;
    background: var(--barva-text-tlumeny);
    opacity: 0;
    transition: opacity 120ms ease;
}

.sl-tah:hover::after { opacity: 0.7; }

/* Hlavička musí být `relative`, jinak by se úchyt umístil podle tabulky a všechny by
   se slily na jednu hranu. */
.tabulka-pruzna thead th { position: sticky; }

/* Během tažení nesmí kurzor blikat podle toho, nad čím zrovna je, a nesmí se označovat text. */
body.tahne-se-sloupec { cursor: col-resize; user-select: none; }
body.tahne-se-sloupec .sl-tah::after { opacity: 1; }

/* Popisek hlavičky BEZ řadicího tlačítka (sloupec, který se neřadí, ale filtruje). Odsazení
   vpravo dělá u ostatních `.tabulka-radit`; tady ho musí nést popisek sám, jinak do něj vleze
   nálevka filtru. */
th.ma-filtr .tabulka-popisek { display: inline-block; padding-right: 16px; }

/* --- akce na řádku: dvě ikony a nabídka (11. 8. 2026) --------------------- */
/*
   Sedm textových tlačítek schovaných do najetí myší se nedalo použít: bez myši (klávesnice,
   dotyk) na ně nešlo dosáhnout vůbec a s myší to bylo čtení sedmi slov v úzkém sloupci.
   Zbyly dvě ikony a ty jsou vidět VŽDYCKY — na rozdíl od `.tabulka-akce`, které se schovává
   schválně (u jedné akce to dává smysl, u sedmi ne).
*/
.tabulka .sl-akce .tabulka-akce.je-ikona {
    opacity: 1;
    width: 22px;
    padding: 0;
    text-align: center;
    font-size: 13px;
    line-height: 1.3;
}

/* Nabídka „⋯" jede na TÉŽE vrstvě jako filtr v hlavičce: `popover` se kreslí v horní vrstvě
   prohlížeče, takže ji neuřízne `overflow` obalu tabulky ani nepřekryje stránkovač — přesně
   na tom ztroskotal první pokus s filtry. Esc a klepnutí mimo řeší prohlížeč. */
.radek-nabidka {
    position: fixed;
    inset: auto;
    margin: 0;
    min-width: 170px;
    padding: 5px;
    background: var(--barva-povrch);
    border: 1px solid var(--barva-linka);
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.13);
    gap: 1px;
}

/* DISPLAY AŽ V OTEVŘENÉM STAVU. Prohlížeč skrývá zavřený popover pravidlem
   `[popover]:not(:popover-open) { display: none }` — jenže autorské `display: flex` ho přebije
   a všechny nabídky se pak kreslí najednou přes tabulku (stalo se 11. 8. 2026; v DOM přitom byla
   otevřená jen jedna, takže to bylo vidět jedině na obrazovce). Filtr v hlavičce tuhle past
   minul jen proto, že si `display` nenastavuje vůbec. */
.radek-nabidka:popover-open {
    display: flex;
    flex-direction: column;
}

.radek-nabidka button {
    text-align: left;
    padding: 5px 9px;
    border: 0;
    border-radius: 5px;
    background: none;
    color: var(--barva-text);
    font: inherit;
    font-size: 12.5px;
    cursor: pointer;
    white-space: nowrap;
}

.radek-nabidka button:hover:not(:disabled) { background: var(--barva-pozadi); }
.radek-nabidka button:focus-visible { outline: 2px solid var(--barva-text); outline-offset: -2px; }
.radek-nabidka button:disabled { color: var(--barva-text-tlumeny); cursor: default; }

/* Odebrání se odděluje linkou a barvou — nesmí se splést s ostatními položkami nabídky. */
.radek-nabidka button.je-nicive {
    margin-top: 4px;
    border-top: 1px solid var(--barva-linka);
    border-radius: 0 0 5px 5px;
    color: var(--c-cihlova);
}

/* --- ocenění přímo v buňce (11. 8. 2026) ---------------------------------- */
/*
   Nejčastější úkon správy majetku. Buňka vypadá jako text, dokud se na ni neklepne — tabulka
   se tím nemění v mřížku polí, ale číslo je na dosah jedním kliknutím místo tří.
*/
/*
   MUSÍ BÝT POZNAT, ŽE SE DO TOHO DÁ PSÁT. Napoprvé byla buňka průhledná bez rámu i podtržení,
   tedy k nerozeznání od textu — uživatel tu možnost nenašel a nahlásil, že tam není. Skrytá
   funkce je totéž co žádná.
   Značka je ale JEMNÁ: tabulka nemá vypadat jako mřížka polí. Čárkované podtržení je zavedený
   způsob, jak říct „tenhle údaj se dá přepsat", a při najetí se z něj stane pole.
*/
/* Vyšší specificita než `.mck button { cursor: pointer }` — bez ní zůstal kurzor „klikni",
   ačkoli tady se píše. */
.tabulka .bunka-spust {
    /* ŠÍŘKA PODLE ČÍSLA, ne přes celou buňku: podtržení přes celou šířku se četlo jako čára
       oddělující sloupce, ne jako značka „tenhle údaj se dá přepsat". */
    display: inline-block;
    width: auto;
    padding: 0 4px;
    border: 0;
    border-bottom: 1px dashed var(--c-seda, #9a9284);
    border-radius: 3px 3px 0 0;
    background: none;
    color: inherit;
    font: inherit;
    font-variant-numeric: tabular-nums;
    text-align: right;
    /* Kurzor říká „tady se píše", ne „tady se kliká" — a musí přebít `cursor: pointer`,
       které má celý klikací řádek. */
    cursor: text;
}

.tabulka .bunka-spust:hover {
    background: var(--barva-povrch);
    border-bottom-style: solid;
    box-shadow: inset 0 0 0 1px var(--c-zelena-tmava);
    border-radius: 4px;
}

.tabulka .bunka-spust:focus-visible { outline: 2px solid var(--barva-text); outline-offset: -1px; }

/* Řádek s rozepsanou hodnotou nesmí zvýšit ŘÁDEK TABULKY — jinak při každém kliknutí do buňky
   poskočí zbytek seznamu, což je přesně ta vada, kvůli které se rozbalovací formuláře stěhovaly
   do panelu. */
.tabulka td.sl-cislo.je-editovana { padding: 0 6px; }

.bunka-uprava {
    display: flex;
    align-items: center;
    gap: 3px;
    justify-content: flex-end;
}

.bunka-uprava .zpole { flex: 0 1 120px; min-width: 0; }
.bunka-uprava .spis-vstup {
    height: 22px;
    padding: 0 6px;
    font-size: 12.5px;
    text-align: right;
    border: 1px solid var(--c-zelena-tmava);
    border-radius: 4px;
}

.bunka-uprava .tabulka-akce.je-ikona { opacity: 1; height: 22px; }


/* Disketa v otevřené buňce — malá, hned za polem. Ukládá i odchod z pole, ale bez viditelného
   tlačítka není poznat, že se přepis někam uloží (a Enter se na to spolehnout nedá). */
.bunka-uprava { display: flex; align-items: center; gap: 4px; }

.bunka-ulozit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--barva-linka);
    border-radius: 5px;
    background: var(--barva-povrch);
    color: var(--barva-text-tlumeny);
    cursor: pointer;
}

.bunka-ulozit svg { width: 13px; height: 13px; }
.bunka-ulozit:hover { color: var(--barva-text); border-color: var(--c-seda); }
.bunka-ulozit:focus-visible { outline: 2px solid var(--barva-text); outline-offset: 1px; }

/* --- UDĚLENÍ PŘÍSTUPŮ (audit, ADR-0088 E3) ------------------------------------------------
   Sloupce jsou v globálním CSS, protože tabulka jede na `.pristupy-tabulka` (svislé linky) —
   scoped CSS komponenty by na ně nedosáhlo bez `::deep` a hlídá to ScopedCssDosahTests. */
.udel-uvod { margin: 0 0 10px; max-width: 70ch; }
.udel-ucet { display: block; }
.udel-jmeno { display: block; color: var(--text-mute); font-size: 11px; }
.udel-prava { font-size: 11.5px; color: var(--text-dim); }
.udel-cas { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* NEPOUŽITÉ UDĚLENÍ SE ZVÝRAZŇUJE — je to nález, ne řádek jako každý jiný (DORA, ADR-0001). */
.udel-tabulka tr.udel-nepouzite { background: rgba(180, 120, 20, 0.06); }
.udel-nikdy { color: #7a5310; font-weight: 600; }

/* --- PILULKA STAVU / VZTAHU (přístupy k rodině + audit udělení, ADR-0088) -----------------
   Globálně, protože ji používají dvě různé komponenty; scoped CSS by na jednu z nich nedosáhlo. */
.pristupy-pil {
    display: inline-block;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(89, 67, 52, 0.08);
    color: var(--text-dim);
    font-size: 10.5px;
    line-height: 16px;
    white-space: nowrap;
}

.pristupy-pil.je-ok { background: rgba(95, 110, 0, 0.14); color: #4a5600; }
.pristupy-pil.je-clen { background: rgba(60, 110, 120, 0.14); color: #2f5c66; }
.pristupy-pil.je-ceka { background: rgba(180, 120, 20, 0.16); color: #7a5310; }
.pristupy-pil.je-bez { background: rgba(89, 67, 52, 0.07); }

/* ============================================================================
   VZDUŠNÁ VARIANTA `.tabulka.je-vzdusna` — podoba tabulky z návrhu (`.tb`)
   ----------------------------------------------------------------------------
   Zadání 25. 8. 2026 (uživatel): seznam rodin má ladit s mockupem 1:1, ale
   funkčnost zůstává naše (úprava v místě, náhled klienta, archivace, mazání).

   PROČ VARIANTA, A NE PŘEPIS `.tabulka`. Návrh má v celém back office jediný
   styl tabulky, a je vzdušný — hustá „excel like" mřížka z ADR-0049 je čistě
   naše. Přepsat ji plošně by ale změnilo i tabulky, které se návrhem neřídí
   (členové a rozhodnutí ve spisu, majetek, Přístupy, Přihlášení, deník změn),
   a to zadáním není. Varianta drží obojí a dá se dalším obrazovkám přidat
   po jedné, až se na nich rozhodne.

   Co se proti husté podobě mění (čísla jsou z běžícího návrhu, ne z oka):
     • písmo 13 → 14 px, hlavička 10,5 px KAPITÁLKY → 13 px normálním písmem,
     • řádek 28 px pevně → odsazení 7/10,5 px a výška podle obsahu (~57 px),
     • pryč zebra a svislé linky mezi sloupci — návrh vede oko jen vodorovně,
     • linka pod řádkem `--cream-200`, pod hlavičkou vlasová (ne dvojitá),
     • poslední řádek linku nemá (jinak je dvojitá s okrajem karty).

   Ukotvená hlavička a rolování uvnitř zůstávají: návrh ukazuje osm řádků,
   my počítáme se stovkami rodin.
   ============================================================================ */

.tabulka.je-vzdusna {
    font-size: 14px;
    color: var(--brown-600);
    /* ŘÁDKOVÁNÍ JAKO POMĚR, ne hotová výška zděděná z okolí (týž důvod jako u karet
       boardu): 1,55 se přepočítá podle velikosti písma každého prvku, takže podtitulek
       u jména i pilulka stavu sedí na stejné číslo jako v návrhu. Bez něj měl řádek
       51,4 px místo 56,8 a vypadal jen „skoro" jako návrh. */
    line-height: 1.55;
}

.tabulka.je-vzdusna thead th {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
    color: var(--brown-400);
    padding: 7px 10.5px;
    height: auto;
    border-bottom: 1px solid var(--border-hairline);
}

.tabulka.je-vzdusna tbody td {
    padding: 7px 10.5px;
    height: auto;
    border-bottom: 1px solid var(--cream-200);
}

/* Zebra i svislice patří husté mřížce; návrh je nemá. Vypínají se tady, ne v CSS
   stránky — jinak by je každá další vzdušná tabulka musela vypínat znovu. */
.tabulka.je-vzdusna tbody tr:nth-child(even) td { background: none; }

.tabulka.je-vzdusna thead th:not(:last-child),
.tabulka.je-vzdusna tbody td:not(:last-child) { border-right: 0; }

.tabulka.je-vzdusna tbody tr:last-child td { border-bottom: 0; }

.tabulka.je-vzdusna tbody tr.je-klikaci:hover td { background: var(--cream-50); }

/* --- buňky --------------------------------------------------------------- */

/* Jméno a podtitulek (návrh `.tt2` + `.muted`). Odsazení dává řádek, takže si ho
   buňka na rozdíl od husté podoby nezmenšuje. */
/* ŘÁDKOVÁNÍ SE TU OPAKUJE JMENOVITĚ. Hustá podoba dává těmhle dvěma buňkám vlastní
   `line-height: 1.2` (aby se dvouřádkový obsah vešel do 28px řádku) a to je selektor
   o stupeň silnější než `.tabulka.je-vzdusna` — bez tohohle si buňky 1,2 nechaly
   a řádek měl 47 px místo 57. Jediný způsob, jak se to pozná, je změřit řádek. */
.tabulka.je-vzdusna td.sl-rodina,
.tabulka.je-vzdusna td.sl-majetek {
    line-height: 1.55;
}

.tabulka.je-vzdusna td.sl-rodina {
    padding-top: 7px;
    padding-bottom: 7px;
}

/* Váhu nese JEN jméno (návrh `.tt2`); buňka kolem něj je běžný text. Hustá tabulka
   dává `.sl-hlavni` 500, což vedle 600 jména vypadalo jako třetí stupeň navíc. */
.tabulka.je-vzdusna td.sl-hlavni { font-weight: 400; }

.tabulka.je-vzdusna .sl-rodina-jmeno {
    font-size: 14px;
    font-weight: 600;
    color: var(--brown-700);
}

.tabulka.je-vzdusna .sl-rodina-podtitulek { font-size: 13px; }

/* JMÉNU SE DÁ MÍSTO. V návrhu je sloupec s názvem ten pružný a zabírá skoro třetinu
   tabulky; u nás si volný prostor bral text poznámky, takže se jméno smrsklo na šířku
   nejdelšího slova a nad ním se lámala hlavička. Minimum, ne pevná šířka — poznámka
   pak dostane zbytek. */
.tabulka.je-vzdusna th.sl-hlavni,
.tabulka.je-vzdusna td.sl-hlavni { min-width: 220px; }

/* A ZAPLATÍ TO POZNÁMKA, ne šířka obrazovky. Sloupec volného textu se v husté tabulce
   ořezává až na 52 znacích; při 14px písmu to je ~380 px, takže se devět sloupců
   i s vyhrazenými 220 px pro jméno přestalo na 1440 px vejít a tabulka jela do strany.
   Poznámka se krátí třemi tečkami a celá stojí v titulku, takže se tím nic neztrácí —
   kdežto jméno je to, podle čeho se v seznamu hledá. Změřeno na 1920/1440/1280. */
.tabulka.je-vzdusna td.sl-text { max-width: 38ch; }

/* Ikony akcí povyrostou s tabulkou: 24px čtvereček s 13px značkou byl stavěný pro
   28px řádek husté tabulky a v 57px řádku vypadal jako drobek u kraje. */
.tabulka.je-vzdusna .tabulka-akce.je-ikona { width: 28px; font-size: 15px; }

/* ČÍSLO JE VLEVO A TUČNĚ (návrh `.num`), ne vpravo jako v husté tabulce. Pravá
   hrana je tam kvůli porovnávání řádů okem pod sebou — jenže částky se píšou
   zkráceně („412,6 mil. Kč"), takže se číslice stejně nesrovnají a zarovnání
   nic nenese. Váha 700 a tmavší odstín říkají „tohle je to číslo" líp. */
.tabulka.je-vzdusna .sl-cislo {
    text-align: left;
    font-family: var(--font-cisla);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--brown-700);
}

.tabulka.je-vzdusna .sl-mena-vic { font-size: 12px; font-weight: 400; }

/* Člověk = kolečko s iniciálami a jméno vedle (návrh `.lp` + `.mini`). */
.tabulka.je-vzdusna .sl-clovek {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--brown-500);
}

/* Nikdo nepřiřazen: kolečko zůstává, jen prázdné a čárkované (návrh `.mini.none`).
   Vynechat ho by rozhodilo svislici jmen ve sloupci. */
.tabulka.je-vzdusna .sl-clovek .ava.je-prazdna {
    background: none;
    border: 1px dashed var(--border-hairline);
    /* Otazník, který `Iniciraly.Z("")` vrací místo prázdna, se tu schovává: „kdo?"
       říká slovo vedle kolečka a v čárkovaném kroužku by vypadal jako chyba načtení.
       Průhledná barva, ne skrytí prvku — kroužek musí držet šířku, jinak se jména
       ve sloupci rozjedou. */
    color: transparent;
}

/* Pilulka v řádku má rozměry z návrhu (`.bal`); `.pilulka` sama je stavěná pro
   hustou tabulku, kde by 13px rozrazilo 28px řádek. */
.tabulka.je-vzdusna .pilulka {
    gap: 7px;
    padding: 4.5px 13px;
    font-size: 13px;
    /* Také jmenovitě: `.pilulka` si nese 1.4 z cimpel.css a dědění ho nepřebije. */
    line-height: 1.55;
}

/* Iniciály v kolečku jsou v návrhu o stupeň tučnější než jinde (`.mini` má 700) —
   na 26 px kroužku je to rozdíl mezi „písmena" a „značka". */
.tabulka.je-vzdusna .sl-clovek .ava { font-weight: 700; }