/* =========================================================================
   PLANBOZP – doplňky nad převzatým vzhledem

   Stylopisy z rizikabozp.online pokrývají skořápku a většinu prvků. Tady
   jsou jen věci, které planbozp má navíc nebo jinak – hlavně proto, že
   vytěžování údajů z dokumentů a jejich ověřování na rizikabozp není.

   Pravidlo: co jde postavit z jejich tříd, se odsud nepřidává. Tenhle
   soubor má zůstat malý, jinak se vzhled obou aplikací zase rozejde.
   ========================================================================= */

/* ----------------------------------------------------- formulářová pole

   `.pole` bydlí v `builder.css`, jenže ten se načítá jen uvnitř zakázky.
   Přihlášení, účet, nový zákazník ani správa uživatelů ho nemají, a kvůli
   dvěma třídám by se nevyplatilo tahat dvě stě kilobajtů cizího stylu.
   Rizikabozp řeší totéž stejně – viz komentář nahoře v `ucet.css`.

   HODNOTY SE SCHVÁLNĚ SHODUJÍ s `builder.css`. Pole má vypadat všude
   stejně, ať se vyplňuje zakázka nebo heslo. */

.pole { margin: 0; }
.pole + .pole, .pole-radek + .pole, .pole + .pole-radek,
.pole-radek + .pole-radek { margin-top: 14px; }
/* Uvnitř řádku dělá mezeru mřížka. Bez tohohle dostalo i pole v DRUHÉM
   sloupci horní okraj pro pole pod sebou a celý pravý sloupec sjel o 14 px
   níž než levý (IČO vedle DIČ, telefon vedle jména). */
.pole-radek > .pole + .pole { margin-top: 0; }

.pole > label, .pole-popis {
    display: block;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #4E5A70;
}
.pole > label b, .pole-popis b { color: var(--modra); font-weight: 800; }

/* Oproti `builder.css` je tu navíc `password`: hesla se mění mimo zakázku,
   takže je jejich stylopis nikdy nepotkal. */
.pole input[type="text"], .pole input[type="email"], .pole input[type="date"],
.pole input[type="number"], .pole input[type="password"],
.pole input:not([type]), .pole textarea {
    display: block;
    width: 100%;
    height: 34px;
    padding: 0 11px;
    border: 1px solid #DCDFE6;
    border-radius: 6px;
    background: #fff;
    font: inherit;
    font-size: 14px;
    color: var(--tmava);
}
.pole textarea { height: auto; padding: 6px 11px; line-height: 1.4; resize: vertical; }
.pole input:focus, .pole textarea:focus, .pole select:focus {
    outline: none;
    border-color: var(--modra);
    box-shadow: 0 0 0 3px rgba(12, 86, 181, .16);
}
.pole input::placeholder, .pole textarea::placeholder { color: #A6AEBC; }
.pole select { display: block; width: 100%; }
.pole-hint {
    display: block;
    margin: 4px 0 0;
    font-style: normal;
    font-size: 12px;
    color: var(--sedy);
}

.pole-radek { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.pole-akce { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

@media (max-width: 620px) {
    .pole-radek { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------ ikony v tlačítkách

   Tatáž úvaha jako u polí: velikost ikony v tlačítku je v `builder.css`,
   ale tlačítka s ikonou stojí i v přehledu zakázek a ve správě. Bez
   rozměru se SVG roztáhne na celou šířku tlačítka – přesně to byl ten
   šedý čtverec místo koše. */

.tlacitko-hlavni > svg, .tlacitko-lem > svg { width: 17px; height: 17px; flex: none; }
.tlacitko-lem--drobne { height: 30px; padding: 0 8px; gap: 0; }
.tlacitko-lem--smazat { border-color: #F2BFC2; color: #A31F26; }
.tlacitko-lem--smazat > svg { width: 15px; height: 15px; }

/* Ikona v buňce tabulky – u druhu dokumentu. */
.tabulka td > svg { width: 16px; height: 16px; color: var(--sedy); }

/* Řádek se štítky a mazáním na kartách zákazníků a firem. Přehled zakázek
   má vlastní v `zakazky.css` (tlačítka těsně u sebe) a nad ním patičku
   `.zak-pata`. */
.zak-akce { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.zak-akce form { margin: 0; }

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

   Rizikabozp má v kartě prostý `<h2>` a pod ním `.karta-popis`. Tady má
   část karet vpravo ještě akci (spustit migrace, navrhnout text, export),
   a pro takový řádek u nich pojmenovaná třída není – každé místo si ji
   dělá samo (`podklady-hlava`, `plan-tabulka-hlava`, `admin-hlava`).
   Tohle je totéž jednou pro všechny karty aplikace. */

.karta-hlava {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.karta-hlava h2 { margin: 0; }
.karta-hlava > div > p { margin: 2px 0 0; font-size: 12.5px; color: var(--sedy); }
.karta-hlava form { margin: 0; }
.karta-telo { margin-top: 14px; }

/* ------------------------------------------------------ tabulky ve správě */

/* Sloupce, které se nemají roztahovat podle obsahu. */
.c-role   { width: 170px; }
.c-stav   { width: 130px; }
.c-poradi { width: 54px; }
.c-volba  { width: 96px; }
.c-zdroj  { width: 30%; }
.c-akce   { width: 1%; white-space: nowrap; text-align: right; }
.tabulka .c-akce form { display: inline-block; margin: 0; }

/* Vyběrátko přímo v řádku tabulky – nižší než samostatné pole. */
.f-mini { height: 30px; padding: 0 30px 0 9px; font-size: 13px; }

/* Výběr a jeho tlačítko na jednom řádku v tabulce. */
.radek-volba { display: flex; align-items: center; gap: 7px; }
/* „Z ARES" se do dvou řádků lámat nemá — v užším sloupci se to stalo. */
.radek-volba .tlacitko-lem { white-space: nowrap; }

/* Doplňující řádek pod obsahem buňky nebo karty. */
.meta { display: block; margin-top: 3px; font-size: 12.5px; font-style: normal; color: var(--sedy); }

/* ------------------------------------------------------- části plánu (4. krok)

   Seznam částí plánu vlevo. Stavěné podle `.seznam-pozornost` z jejich
   dashboardu – tentýž tvar řádku, jen s odznakem místo popisku. */

.sekce { display: block; padding: 10px 12px; border-radius: 10px; }
.sekce:hover { background: #F4F7FD; }
.sekce.is-here { background: #EEF4FF; }
.sekce__radek {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.sekce__nazev { font-size: 14px; font-weight: 700; color: var(--tmava); }
.sekce.is-here .sekce__nazev { color: var(--modra); }

/* Textové pole na celou část plánu – tam se píše odstavec, ne jméno. */
.vysoky { min-height: 320px; }

/* ------------------------------------------ závěry posouzení (3. krok)

   Sedí v `.dlazdice`, ale dlaždice tu nese větu, ne číslo: závěr se bez
   odůvodnění a bez předpisu nedá přečíst. */

.dlazdice-polozka .stat__nadpis {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sedy);
}
.dlazdice-polozka .stat__predpis { color: var(--sedy); font-size: 12px; }

/* ---------------------------------------------------- výpis chyby v panelu

   Zásobník volání je jediné místo v aplikaci, kde se ukazuje surový text
   ze serveru. Nesmí roztáhnout stránku do strany – posouvá se uvnitř
   svého rámečku. */

.admin-rozbal-obsah pre {
    margin: 0;
    max-height: 320px;
    overflow: auto;
    font: 400 12px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    color: var(--telo);
}

/* ------------------------------------------------- jednorázové heslo

   Vygenerované heslo je vidět jednou a musí se z obrazovky přečíst do
   telefonu. Proto strojové písmo, velká velikost a prostrkání – aby se
   v něm nespletlo l s I. */

.karta--heslo { margin-top: 16px; border-color: #F2DCB4; background: #FFFBF2; }
.heslo-kod { margin: 12px 0 0; }
.heslo-kod code {
    display: inline-block;
    padding: 10px 16px;
    border: 1px solid #EADCC0;
    border-radius: 9px;
    background: #fff;
    font: 700 19px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: .09em;
    color: var(--tmava);
    user-select: all;
}

/* --------------------------------------------- poradce, který se chystá

   Rizikabozp otevírá okno poradce skriptem a bublinu přitom schová.
   Planbozp ho má zatím jen jako oznámení, že se připravuje, takže ho
   otevírá `<details>` — a bublina musí zůstat vidět, jinak by nešlo
   zavřít. Okno proto stojí NAD ní (`column-reverse`).

   Až poradce obživne, tenhle blok zmizí i s třídou `poradce--chysta`. */

/* Dvě třídy SCHVÁLNĚ: `poradce.css` se načítá až po tomhle souboru,
   takže samotné `.poradce--chysta` by prohrálo s `.poradce` a bublina
   by skončila nad oknem místo pod ním. */
.poradce.poradce--chysta { flex-direction: column-reverse; }
.poradce--chysta > summary { list-style: none; cursor: pointer; }
.poradce--chysta > summary::-webkit-details-marker { display: none; }
/* Okno připravovaného poradce je jen vzkaz — nemusí být vysoké jako chat. */
.poradce--chysta .poradce-okno { height: auto; max-height: none; }
.poradce--chysta .poradce-zpravy { gap: 10px; }
.poradce--chysta .poradce-patka { display: flex; gap: 8px; }

/* Odkaz na celý kalendář pod výpisem v panelu. */
.kalendar-vice { margin: 8px 0 0; padding: 0 2px; }
.kalendar-vice a { font-size: 12.5px; font-weight: 700; color: var(--modra); }
.kalendar-vice a:hover { text-decoration: underline; }

/* -------------------------------------------- značka u pilulky kalendáře

   Rizikabozp má v pilulce jen datum — nic jim tam nepřibývá, protože
   termíny hlídá kalendář sám. Planbozp přidává malé číslo, když něco
   čeká do čtrnácti dnů: bez něj by se člověk musel rozbalit pokaždé,
   aby zjistil, že nic nehoří. */

.lista-znacka {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #FDE68A;
    color: #7C4A03;
    font-size: 11px;
    font-weight: 800;
}

/* ----------------------------------------------- termíny na stránce

   `.kalendar-seznam` je z rizikabozp a počítá s panelem v liště: samé
   odkazy pod sebou, výška omezená rolováním. Na stránce kalendáře má
   navíc tlačítka u každého termínu a rolovat nemusí — je na to místo. */

.kalendar-seznam--stranka { max-height: none; margin-top: 14px; }
.kalendar-seznam--stranka li {
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid var(--lem);
}
.kalendar-seznam--stranka li:last-child { border-bottom: 0; }
.kalendar-seznam--stranka a { flex: 1 1 auto; min-width: 0; }
/* Na stránce je řádek široký, takže se popis nemusí krátit na jeden řádek
   jako v úzkém panelu. */
.kalendar-seznam--stranka em { white-space: normal; }

.termin-akce { flex: none; display: flex; align-items: center; gap: 6px; }
.termin-akce form { margin: 0; }

/* Mřížka měsíce na stránce stojí v kartě, ne v panelu — panel si šířku
   nese sám (`nabidka-panel--kalendar`), tady ji musí dát karta. */
.kalendar-stranka { margin-top: 12px; }

@media (max-width: 620px) {
    /* Tlačítka pod termín, ne vedle: na 390 px by z popisu zbyla dvě slova. */
    .kalendar-seznam--stranka li { flex-wrap: wrap; }
    .termin-akce { width: 100%; justify-content: flex-end; }
}

/* ------------------------------------------------- termín podle zákona

   Rizikabozp má dva druhy termínů (přezkoumání a opatření) a pro každý
   barvu. Planbozp má navíc lhůtu podle § 15 — ta se nesmí splést
   s běžným termínem, protože po ní se nedá nic dohnat. */

.kalendar-znak--oznameni { background: #FDF1DF; color: #8A5207; }

/* ------------------------------------------------------ logo kanceláře

   Náhled toho, co vyjde v hlavičce plánu. Šachovnice pod obrázkem kvůli
   průhlednému PNG — na bílé kartě by nebylo poznat, kde logo končí. */

.logo-nahled {
    margin: 14px 0 0;
    padding: 14px;
    border: 1px solid var(--lem-karta);
    border-radius: 10px;
    background:
        repeating-conic-gradient(#F3F5F9 0% 25%, #fff 0% 50%) 50% / 16px 16px;
    text-align: center;
}
.logo-nahled img { max-width: 100%; max-height: 90px; }

/* -------------------------------------------------- odkaz do nápovědy

   Drobný, ale ne šedý: je to nabídka, ne poznámka pod čarou. Stojí za
   větou, kterou vysvětluje, tak ať se pozná, že jde kliknout. */

.napoveda-odkaz { font-size: 12.5px; font-weight: 700; color: var(--modra); }
.napoveda-odkaz::before { content: '? '; font-weight: 800; }
.napoveda-odkaz:hover { text-decoration: underline; }
.napoveda-radek { margin: 16px 0 0; }

/* ------------------------------------------------------- značka chyby

   Krátký kód, který člověk pošle správci. Musí jít přečíst do telefonu
   stejně jako jednorázové heslo, jen je kratší. */

.chybova-znacka { margin: 14px 0 0; }
.chybova-znacka code {
    display: inline-block;
    padding: 9px 16px;
    border: 1px solid var(--lem-karta);
    border-radius: 9px;
    background: #F4F8FC;
    font: 700 17px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: .12em;
    color: var(--tmava);
    user-select: all;
}

/* --------------------------------------------------------- nápověda

   Dvojice pojem a vysvětlení. Stejná stavba jako dřívější `.profil-karta dl`,
   jen bez karty kolem — v rozbalené radě už jeden rámeček je. */

.napoveda-body { display: grid; gap: 12px; margin: 12px 0 0; }
.napoveda-body > div { display: flex; align-items: baseline; gap: 14px; }
.napoveda-body dt {
    flex: none;
    width: 168px;
    font-size: 13px;
    font-weight: 800;
    color: var(--tmava);
}
.napoveda-body dd { margin: 0; font-size: 14px; color: var(--telo); }

@media (max-width: 620px) {
    .napoveda-body > div { flex-direction: column; gap: 2px; }
    .napoveda-body dt { width: auto; }
}

/* ================================================================ telefon

   Převzaté stylopisy mají svůj mobil vyřešený (dotykové cíle, písmo 16 px
   v polích, panel do hamburgeru). Tady jsou jen vlastní komponenty —
   všechno, co je výš v tomhle souboru a na úzkém displeji by se rozsypalo.

   Zlom 620 px je jejich, ať se nikde nepřepíná o pár pixelů dřív nebo
   později než zbytek aplikace. */

@media (max-width: 620px) {
    /* Hlavička karty: nadpis a akce pod sebe. Tlačítko si drží svou
       šířku — roztažené přes celou kartu vypadá jako hlavní akce
       obrazovky, i když je to jen „Zavřít" nad formulářem. */
    .karta-hlava { flex-direction: column; align-items: flex-start; gap: 10px; }

    /* Nástrojová lišta přehledu: hledání a tlačítko pod sebe. Vedle sebe
       zbyla na pole třetina šířky a z popisku byl „Hledat podle r". */
    .zak-hledani { flex-wrap: wrap; }
    .zak-hledani-pole { flex: 1 1 100%; }
    .zak-hledani .tlacitko-hlavni { flex: 1 1 100%; }

    .pole-akce { flex-direction: column-reverse; }
    .pole-akce .tlacitko-lem,
    .pole-akce .tlacitko-hlavni { width: 100%; }
    /* Tlačítko ve vlastním formuláři (Stáhnout PDF): přes celou šířku se
       roztáhne jen tehdy, když se roztáhne i formulář kolem něj. */
    .pole-akce > form { width: 100%; margin: 0; }
    /* V kartě exportu je blok s akcemi položka flexu vedle popisu a po
       zalomení zůstal úzký podle tlačítek. */
    .export-karta > .pole-akce { flex: 1 1 100%; }

    /* Vyběrátko a jeho tlačítko pod sebe. Vedle sebe zbyde na vyběrátko
       tak málo, že z „Správce kanceláře" je „Sp…". */
    .radek-volba { flex-wrap: wrap; }
    .radek-volba select,
    .radek-volba input { flex: 1 1 100%; }
    /* IČO má osm číslic, s „Z ARES" se na řádek vejde. Pod sebou po
       tlačítku zůstávala díra a vypadalo to, že k poli nepatří. */
    .radek-volba input[inputmode="numeric"] { flex: 1 1 0; min-width: 0; }

    .dlazdice--zavery { grid-template-columns: minmax(0, 1fr); }

    /* Heslo se z obrazovky opisuje do telefonu, tak ať se vejde celé. */
    .heslo-kod code { font-size: 16px; letter-spacing: .06em; word-break: break-all; }
}

/* ------------------------------------------------------------ hlášky */

.msg { padding: 12px 16px; border-radius: 10px; font-size: 14px; margin-bottom: 16px; }
.msg--ok  { background: #E9F7F1; color: #0B6B4C; }
.msg--err { background: #FDF1F0; color: #A3312A; }

/* --------------------------------------------- ukazatel připravenosti */

.pruh-prubeh { height: 8px; border-radius: 8px; background: var(--lem); overflow: hidden; }
.pruh-prubeh i { display: block; width: 0; height: 100%;
                 background: linear-gradient(90deg, var(--modra), var(--zelena)); }

.dlazdice-cislo { display: block; font-size: 38px; font-weight: 800;
                  line-height: 1; color: var(--modra); }

/* ------------------------------------------- kontroly a překážky exportu */

.kontrola { display: flex; gap: 10px; padding: 8px 0;
            border-bottom: 1px solid var(--lem); font-size: 13px; }
.kontrola:last-child { border-bottom: 0; }
.kontrola__znak { flex: 0 0 14px; font-weight: 800; }
.kontrola--ok    .kontrola__znak { color: var(--zelena); }
.kontrola--chyba .kontrola__znak { color: #C0392B; }
.kontrola--varov .kontrola__znak { color: var(--zluta); }

.prekazka { display: grid; grid-template-columns: 26px 1fr auto; gap: 12px;
            align-items: center; padding: 16px 0; border-bottom: 1px solid var(--lem); }
.prekazka:last-child { border-bottom: 0; }
.prekazka__znak { font-size: 17px; color: #C0392B; }
.prekazka--varov .prekazka__znak { color: var(--zluta); }
.prekazka b { font-size: 14px; }
.prekazka p { margin: 3px 0 0; color: var(--telo); font-size: 12.5px; }

.export-karta { display: flex; justify-content: space-between; align-items: center;
                gap: 24px; flex-wrap: wrap; }
.export-karta small { color: var(--sedy); font-size: 11px; font-weight: 800;
                      letter-spacing: .06em; }

/* ------------------------------------------------------ zóna na nahrání

   Opsané z `builder.css` (`label.nahrat` a spol.), protože kancelář
   builder nenačítá. Na obrazovkách zakázky se builder načte až po tomhle
   souboru se stejnými hodnotami, takže se tam nic nemění. */

label.nahrat {
    position: relative;
    margin-bottom: 0;
    font-size: 13.5px;
    font-weight: 400;
    letter-spacing: normal;
    text-transform: none;
    color: var(--telo);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 17px 14px;
    border: 1.5px dashed #C3D0E8;
    border-radius: 10px;
    background: #FBFCFE;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}
.nahrat:hover, .nahrat:focus-within { border-color: var(--modra); background: #F6F9FE; }
.nahrat-znak {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-bottom: 3px;
    border-radius: 50%;
    background: #EEF3FC;
    color: var(--modra);
}
.nahrat-znak svg { width: 19px; height: 19px; }
label.nahrat b { font-size: 13.5px; font-weight: 700; color: var(--tmava); }
.nahrat span { font-size: 12px; color: var(--sedy); }
.nahrat input[type="file"] {
    max-width: 100%;
    margin-top: 7px;
    font: inherit;
    font-size: 12px;
    color: var(--telo);
    cursor: pointer;
}
.ma-skript .nahrat input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
}
label.nahrat--nad { border-color: var(--modra); background: #EEF3FC; }
.nahrat--logo { min-height: 128px; justify-content: center; }

.se-skriptem,
.nahravam { display: none; }
.ma-skript .bez-skriptu { display: none; }
.ma-skript .se-skriptem { display: block; }
.nahrava-se .se-skriptem { display: none; }
.nahrava-se .nahravam { display: block; color: var(--modra); font-weight: 600; }
.nahrava-se .nahrat { pointer-events: none; opacity: .55; }

/* Iniciály v kulatém znaku. `<i>` je jinak kurzíva a monogram vypadal
   nakřivo; hodnoty jako `.zak-monogram` v přehledu. */
.znak--monogram {
    font-size: 12.5px;
    font-weight: 800;
    font-style: normal;
    letter-spacing: .02em;
}

/* ------------------------------------------- závěry posouzení (3. krok)

   Tři dlaždice se závěrem: co se posuzuje, odznak, proč a podle čeho.
   Stály v mřížce dashboardu (čtyři sloupce, výška 90 px, číslo vedle
   ikony) a text z nich přetékal přes sousední karty. */

.dlazdice--zavery { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.dlazdice-polozka--zaver {
    display: grid;
    align-content: start;
    justify-items: start;
    gap: 8px;
    height: auto;
    padding: 16px 17px;
}
.dlazdice-polozka--zaver .stat__nadpis {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--sedy);
}
.dlazdice-polozka--zaver p { margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--telo); }
.dlazdice-polozka--zaver .stat__predpis { font-size: 12px; color: var(--sedy); }

/* Ano / Ne / Neurčeno v tabulce přílohy č. 5. `.volby` je v builderu
   mřížka velkých voleb na tři stejné sloupce — v buňce široké 96 px
   z „Neurčeno" zbylo „Neur". */
.c-volba { width: 250px; }
.c-volba .volby { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.c-volba label { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
@media (max-width: 620px) {
    /* Na telefonu by vedle sebe sebraly kategorii skoro celou šířku.
       A bez posuvu: převzatá tabulka má `min-width: 420px`, takže volby,
       kvůli kterým tabulka je, zůstávaly schované za pravým okrajem. */
    .tabulka--priloha5 { min-width: 0; }
    .tabulka--priloha5 .c-poradi { width: 26px; }
    .c-volba { width: 112px; }
    .c-volba .volby { flex-direction: column; gap: 2px; }
}

/* Ikona uprostřed věty (u situačního výkresu). Bez rozměru se SVG
   roztáhlo na šířku karty. */
.karta-popis > svg { display: inline-block; width: 1.2em; height: 1.2em; vertical-align: -.25em; }

/* Tlačítko uvnitř zóny na nahrání je `span` a `.nahrat span` z builderu
   mu bralo barvu i velikost — bílý text na přechodu zešedl. */
.nahrat span.tlacitko-hlavni { margin-top: 8px; font-size: 13.5px; color: #fff; }

/* Číselné sloupce ve správě: `.admin-cislo` zarovnává doprava, jenže
   `.tabulka th` z převzatého stylu je silnější a nadpis zůstával vlevo —
   „3" stálo daleko od „Podklady". */
.tabulka th.admin-cislo { text-align: right; }

/* Tabulky v poloviční mřížce správy (náklady po modelech a měsících).
   Převzaté `min-width: 420px` je širší než karta, takže sloupec „Odhad"
   končil uříznutý za okrajem, i když se čísla vejdou. */
.admin-mrizka .tabulka { min-width: 0; }

/* Stav a jistota u vytěžené hodnoty. Podle délky řádku se odznak
   „98 %" jednou vešel vedle „Ověřeno" a jindy spadl pod něj, takže sloupec
   zubatěl. Na širokém displeji na to místo je. */
@media (min-width: 1200px) {
    .vyt-odznaky { white-space: nowrap; }
}

/* --------------------------------------------- jen ke čtení a zamčený plán

   Třídu dává tělu `pba_head()`. Schovává se ovládání, které by nic
   neudělalo; obsah formulářů (texty částí, posouzení, vytěžené hodnoty)
   zůstává vidět, jen se do polí nedá klepnout. Formulář, který smí i účet
   jen ke čtení (stažení PDF, změna hesla, jazyk), nese `i-jen-cteni`. */

.jen-cteni form[method="post"]:not(.i-jen-cteni) button,
.jen-cteni form[method="post"]:not(.i-jen-cteni) input[type="submit"],
.jen-cteni .nahrat,
.jen-cteni [data-zapis] { display: none !important; }

.jen-cteni form[method="post"]:not(.i-jen-cteni) input:not([type="hidden"]),
.jen-cteni form[method="post"]:not(.i-jen-cteni) textarea,
.jen-cteni form[method="post"]:not(.i-jen-cteni) select {
    pointer-events: none;
    background-color: #F7F8FB;
}

/* ----------------------------------------- tabulky účtů jako karty na mobilu

   Členové v kanceláři a účty ve Správě mají pět sloupců s tlačítky. Na
   telefonu se posouvaly do strany a stav s akcemi zůstával za okrajem.
   Pod zlomem 620 px je z každého řádku karta: popisek sloupce nese buňka
   sama (`data-popisek`), hlavička tabulky se schová. */

@media (max-width: 620px) {
    .tabulka.tabulka--karty { min-width: 0; margin-top: 6px; }
    .tabulka.tabulka--karty thead { display: none; }
    .tabulka.tabulka--karty,
    .tabulka.tabulka--karty tbody,
    .tabulka.tabulka--karty tr,
    .tabulka.tabulka--karty td { display: block; width: auto; }
    .tabulka.tabulka--karty tr {
        margin-top: 10px;
        padding: 12px 14px;
        border: 1px solid var(--lem-karta);
        border-radius: 12px;
        background: #fff;
    }
    .tabulka.tabulka--karty td {
        padding: 5px 0;
        border: 0;
        text-align: left;
        white-space: normal;
    }
    .tabulka.tabulka--karty td[data-popisek]::before {
        content: attr(data-popisek);
        display: block;
        margin-bottom: 2px;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .07em;
        text-transform: uppercase;
        color: var(--sedy);
    }
    .tabulka.tabulka--karty td.admin-akce {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        padding-top: 10px;
    }
    .tabulka.tabulka--karty td.admin-akce form { margin: 0; }
}

/* Dlaždice Zákazníků v panelu kanceláře vede do adresáře. */
a.admin-kpi-polozka--odkaz { display: block; color: inherit; transition: border-color .15s ease; }
a.admin-kpi-polozka--odkaz:hover { border-color: #C6D6EE; }
a.admin-kpi-polozka--odkaz .admin-kpi-pod { color: var(--modra); font-weight: 700; }

/* ------------------------------------------------------ drobné doplňky */

.pod { margin-top: 18px; }

/* Starší čtení téhož údaje. Zůstává vidět kvůli dohledání, ale nemá
   vypadat rovnocenně s tím, co do plánu opravdu půjde. */
.tabulka tr.tabulka-tise td { opacity: .5; }
.tabulka tr.tabulka-tise:hover td { opacity: 1; }

/* Nahrávání podkladů – zvýraznění, když se nad plochu táhne soubor. */
.nahrat.nahrava-se { border-color: var(--modra); background: #EFF5FF; }

/* ------------------------------------------- nový zákazník v nové zakázce

   `.rada` z `aplikace.css` je jejich rozbalovací blok s modrým podkladem –
   sedí sem beze změny. Chybí mu jen tělo pro formulář: `.rada-text` má
   odsazení pro odstavec textu, ne pro dvousloupcová pole. */

.zak-novy { margin: 14px 0 0; }
.zak-novy-telo { padding: 2px 18px 18px; }
.zak-novy-telo .karta-popis { margin: 16px 0 8px; }
/* Rozbalený blok stojí uvnitř formuláře hned nad hlavním tlačítkem. */
.zak-novy + .tlacitko-hlavni { margin-top: 20px; }

/* ------------------------------------------------- průběh vytěžení (2. krok)

   Dokud vytěžení běželo, stránka ukazovala jen dva odstavce a zbytek
   obrazovky byl bílý. Tady je seznam souborů: hotové, ten, co se zrovna
   čte, a ty, co čekají — tvar řádku je stejný jako u `.pokracovat`.

   Přejezd světla po čteném řádku je TATÁŽ animace, kterou má rizikabozp
   u návrhů z modelu (`ai-prejezd` v `builder.css`). Ten se na této
   stránce načítá, protože je to obrazovka uvnitř zakázky. */

.vyt-soubory { margin: 18px 0 0; padding: 0; list-style: none; }

.vyt-soubor {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 11px 13px;
    border: 1px solid var(--lem);
    border-radius: 10px;
    background: #fff;
}
.vyt-soubor + .vyt-soubor { margin-top: 8px; }
.vyt-soubor b { display: block; font-size: 14px; color: var(--tmava); }
.vyt-soubor em {
    display: block;
    margin-top: 2px;
    font-size: 12.5px;
    font-style: normal;
    color: var(--sedy);
}
.vyt-znak {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #F1F4F9;
    color: var(--sedy);
}
.vyt-znak svg { width: 16px; height: 16px; }

.vyt-soubor--hotovo .vyt-znak { background: #E4F5EE; color: var(--zelena); }
.vyt-soubor--hotovo em        { color: var(--zelena); }
.vyt-soubor--chyba  .vyt-znak { background: #FBE9E7; color: #C0392B; }
.vyt-soubor--chyba  em        { color: #C0392B; }

.vyt-soubor--ctu {
    border-color: #C9D9F5;
    background-image: linear-gradient(100deg,
        #fff 0%, #fff 35%, #EEF3FC 50%, #fff 65%, #fff 100%);
    background-size: 220% 100%;
    animation: ai-prejezd 1.2s linear infinite;
}
.vyt-soubor--ctu .vyt-znak { background: #E3EDFC; color: var(--modra); }
.vyt-soubor--ctu em        { color: var(--modra); font-weight: 600; }

/* Kdo si vypnul animace, dostane statické zvýraznění — pořád je vidět,
   že se na řádku pracuje, jen to neposkakuje. */
@media (prefers-reduced-motion: reduce) {
    .vyt-soubor--ctu { animation: none; background-image: none; background-color: #F2F6FD; }
}

/* Ukazatel postupu stojí mezi popisem a seznamem. */
.vyt-prubeh .ukazatel { margin: 16px 0 0; }

/* ----------------------------------------------- nálezy během vytěžení -- */

.vyt-nalezy { margin: 0; padding: 0; list-style: none; }
.vyt-nalez {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 0;
    border-bottom: 1px solid var(--lem);
}
.vyt-nalez:last-child { border-bottom: 0; }
.vyt-nalez small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sedy);
}
.vyt-nalez b { display: block; margin-top: 2px; font-size: 14px; color: var(--tmava); }

/* Výčet toho, co se bude hledat. Prostý seznam, ne tabulka — je to
   vodítko před spuštěním, ne výsledek. */
.vyt-seznam { margin: 16px 0 0; padding: 0; list-style: none; }
.vyt-seznam li {
    padding: 7px 0 7px 18px;
    border-bottom: 1px solid var(--lem);
    font-size: 13.5px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='2.5' fill='%238A93A5'/%3E%3C/svg%3E") left 10px no-repeat;
}
.vyt-seznam li:last-child { border-bottom: 0; }

/* ------------------------------------------------ kontrola vytěžených údajů

   Řádek na údaj, stav poznat podle barvy kolečka vlevo. Barvy jsou tytéž
   jako u souborů během vytěžení: zelená hotovo, modrá čeká na člověka,
   oranžová ke kontrole, šedá nic. */

.vyt-souhrn .ukazatel { margin: 16px 0 0; }
.vyt-legenda {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin: 13px 0 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
}
.vyt-legenda li { display: flex; align-items: center; gap: 7px; }
.vyt-tecka { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #C2CBDC; }
.vyt-tecka--potvrzeno    { background: var(--zelena); }
.vyt-tecka--nalezeno     { background: var(--modra); }
.vyt-tecka--zkontrolovat { background: #E39B2A; }

.vyt-souhrn-pata {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px 16px;
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid var(--lem);
    font-size: 13px;
}
.vyt-souhrn-pata a:not(.tlacitko-lem) { color: var(--modra); }

.vyt-udaje { margin: 6px 0 0; padding: 0; list-style: none; }
.vyt-udaj {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 13px;
    padding: 13px 0;
    border-bottom: 1px solid var(--lem);
}
.vyt-udaj:last-child { border-bottom: 0; }
/* Po skoku z formuláře (#u-klic) nesmí řádek zmizet pod horní lištou. */
.vyt-udaj { scroll-margin-top: 90px; }
.vyt-udaj .vyt-znak { margin-top: 2px; }

.vyt-udaj--potvrzeno    .vyt-znak { background: #E4F5EE; color: var(--zelena); }
.vyt-udaj--nalezeno     .vyt-znak { background: #E3EDFC; color: var(--modra); }
.vyt-udaj--zkontrolovat .vyt-znak { background: #FDF1DF; color: #A86400; }
.vyt-udaj--zkontrolovat em        { color: #A86400; }
.vyt-udaj--potvrzeno    em        { color: #0B6B4C; }

.vyt-udaj-telo { min-width: 0; }
.vyt-udaj-telo > small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sedy);
}
.vyt-udaj-telo > b {
    display: block;
    margin-top: 2px;
    font-size: 15px;
    color: var(--tmava);
    overflow-wrap: anywhere;
}
.vyt-udaj-telo > b.vyt-udaj-nic { font-weight: 500; color: var(--sedy); }
.vyt-udaj-telo em {
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    font-style: normal;
    color: var(--telo);
}
.vyt-udaj-telo q {
    display: block;
    margin-top: 6px;
    padding-left: 10px;
    border-left: 2px solid var(--lem-karta);
    font-size: 12.5px;
    color: var(--sedy);
    overflow-wrap: anywhere;
}

/* Rozbalovátka pod hodnotou vypadají jako odkazy — jsou to vedlejší
   cesty, hlavní akce je Potvrdit vpravo. */
.vyt-dalsi, .vyt-oprava { display: inline-block; margin: 7px 16px 0 0; vertical-align: top; }
.vyt-dalsi[open], .vyt-oprava[open] { display: block; margin-right: 0; }
.vyt-dalsi > summary,
.vyt-oprava > summary {
    display: inline-block;
    list-style: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--modra);
}
.vyt-dalsi > summary::-webkit-details-marker,
.vyt-oprava > summary::-webkit-details-marker { display: none; }
.vyt-dalsi > summary::after { content: " ▸"; }
.vyt-dalsi[open] > summary::after { content: " ▾"; }

.vyt-dalsi ul {
    margin: 8px 0 0;
    padding: 0 12px;
    list-style: none;
    border: 1px solid var(--lem-karta);
    border-radius: 10px;
    background: #FAFBFE;
}
.vyt-dalsi li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--lem);
}
.vyt-dalsi li:last-child { border-bottom: 0; }
.vyt-dalsi li span { min-width: 0; }
.vyt-dalsi li b { display: block; font-size: 13.5px; color: var(--tmava); overflow-wrap: anywhere; }
.vyt-dalsi li form { flex: none; }

.vyt-oprava form {
    margin-top: 9px;
    padding: 12px;
    border: 1px solid var(--lem-karta);
    border-radius: 10px;
    background: #FAFBFE;
}
.vyt-oprava .pole-akce { margin-top: 10px; }

@media (max-width: 620px) {
    .vyt-udaj { grid-template-columns: auto minmax(0, 1fr); }
    .vyt-udaj-akce { grid-column: 2; }
    .vyt-dalsi li { flex-wrap: wrap; }
}

/* ------------------------------------------- části plánu podle přílohy 6

   Částí je třicet, takže seznam vlevo je dlouhý a editor vpravo by u něj
   jinak zůstal nahoře mimo dohled. Poměr sloupců je proto otočený proti
   `.sloupce` (tam je hlavní obsah vlevo) a karta s editorem se drží
   v obraze. */

.sloupce--casti { grid-template-columns: minmax(0, 430fr) minmax(0, 902fr); }
.sloupce--casti .sloupec-pravy > .karta { position: sticky; top: 18px; }

/* `.karta-oddil` je týž štítek jinde — oddíly uvnitř karty (detail
   zákazníka: Zakázky, Historie). */
.casti-skupina,
.karta-oddil {
    margin: 18px 0 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--sedy);
}
.casti-skupina:first-of-type { margin-top: 6px; }

/* Nadpis části je v seznamu delší než jinde („s) Dokončovací práce ve
   výšce a nad volnou hloubkou"), tak ať se zalomí a nepřetlačí odznak. */
.sloupce--casti .sekce__nazev { font-size: 13.5px; line-height: 1.35; }
.sloupce--casti .sekce__radek { align-items: flex-start; }
.sloupce--casti .odznak { flex: none; }

@media (max-width: 980px) {
    .sloupce--casti { grid-template-columns: minmax(0, 1fr); }
    .sloupce--casti .sloupec-pravy > .karta { position: static; }
}

/* ---------------------------------------------- pravý sloupec a tabulky

   `.sloupec-pravy` je v `aplikace.css` mřížka bez určeného sloupce, takže
   se jeho jediný sloupec roztáhne podle NEJŠIRŠÍHO obsahu. U nich to
   nevadilo, tady ano: v pravém sloupci stojí tabulky a na telefonu tím
   karta přerostla svůj sloupec o sto padesát bodů a celá stránka se dala
   posouvat do strany. `minmax(0, 1fr)` dovolí sloupci zúžit se pod obsah
   — vodorovný posuv pak zůstane uvnitř `.tabulka-posuv`, kam patří. */

.sloupec-pravy { grid-template-columns: minmax(0, 1fr); }

/* ------------------------------------------------------ dotykové cíle

   Na telefonu se klepe prstem a odkaz vysoký 15–19 px se trefuje
   špatně. Tohle jsou vlastní odkazy, které `nastroje/mobil.mjs` hlásil
   pod 36 px; převzaté komponenty mají cíle vyřešené samy.

   Plocha pro klepnutí se zvětšuje NEVIDITELNĚ: svislý padding a stejně
   velký záporný okraj. U řádkového odkazu uprostřed věty okraj nic
   nedělá a padding nehne řádkem; u odkazu, ze kterého flex udělal blok,
   záporný okraj vrátí, co padding přidal. Vzhled se tak nemění nikde
   a platí to jen pod zlomem 620 px — myš takovou pomoc nepotřebuje. */

@media (max-width: 620px) {
    /* Název zakázky a zákazníka v přehledu — hlavní cíl celé obrazovky. */
    .zak-odkaz,
    /* Odkazy do nápovědy a na krok zakázky uprostřed věty. */
    .napoveda-odkaz,
    .pruh-poznamka a,
    /* „Otevřít kalendář" v rozbalené pilulce. */
    .kalendar-vice a {
        padding-block: 11px;
        margin-block: -11px;
    }

    /* Značka v pruhu je široká přes celý displej, chybí jí jen pixel
       na výšku — ať ji kontrola nehlásí pořád dokola. */
    .rozvrh:not(.rozvrh--builder) .panel-znacka {
        padding-block: 5px;
        margin-block: -5px;
    }
}

/* Dosažený, ale ještě nehotový krok v panelu. Je to odkaz jako hotový
   krok, jen bez fajfky — `builder.css` zná jen hotový a pozdější. */
.panel-krok--dalsi:hover { background: rgba(255, 255, 255, .12); }

/* Tabulka „Co je potřeba doplnit" pod textem části (krok 4). Pole jsou
   mimo `.pole`, takže vzhled vstupu se tu opisuje. */
.doplnte { margin-top: 18px; }
.doplnte h3 { font-size: 14px; font-weight: 700; color: var(--tmava); margin: 0 0 8px; }
.doplnte td:first-child { width: 45%; font-size: 13.5px; }
.doplnte textarea {
    width: 100%; min-width: 180px; box-sizing: border-box; resize: vertical;
    font: inherit; font-size: 14px; padding: 8px 10px;
    border: 1px solid #D5DCE8; border-radius: 8px; background: #fff;
}
.doplnte textarea:focus { outline: none; border-color: var(--modra); }
.sloupce--casti #navrh-vse-chyba { margin: 0 12px 12px; }

/* Průběh nahrávání podkladů (krok 1). Stojí místo zóny pro přetažení. */
.nahravani { margin: 4px 0 18px; }
.nahravani .ukazatel { margin-top: 0; }
.nahravani .pole-hint { margin: 8px 0 0; }
.nahravani .vyt-soubory { margin-top: 12px; }

/* Stav hromadných návrhů v hlavičce „Části plánu" (krok 4). */
.navrh-fronta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* ------------------------------------------------ krok 3: posouzení */

/* Neviditelné výchozí tlačítko formuláře (Enter v poli). Ne `display: none`:
   takové tlačítko by prohlížeč za výchozí nemusel vzít. */
.vychozi-odeslani { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Rozsah prací: čtyři krátká pole v řadě, na užší obrazovce po dvou. */
.posouzeni-rozsah {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px 18px;
    align-items: start;
}
/* Stejné odsazení u všech polí; builder dává prvnímu v kartě jiné a řada se rozjela. */
.posouzeni-rozsah > .pole { margin: 0; }
@media (max-width: 1100px) { .posouzeni-rozsah { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .posouzeni-rozsah { grid-template-columns: minmax(0, 1fr); } }

/* Jednotka jako součást pole, ne text vedle něj. */
.pole-jednotka {
    display: flex;
    align-items: stretch;
    border: 1px solid #DCDFE6;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
}
.pole-jednotka:focus-within { border-color: var(--modra); box-shadow: 0 0 0 3px rgba(12, 86, 181, .16); }
.pole .pole-jednotka input[type="number"] { flex: 1; min-width: 0; border: 0; border-radius: 0; box-shadow: none; }
.pole-jednotka em {
    display: flex; align-items: center;
    padding: 0 10px;
    background: #F4F6FA;
    border-left: 1px solid #DCDFE6;
    font-style: normal; font-size: 12.5px; color: var(--sedy);
    white-space: nowrap;
}

/* Kategorie přílohy č. 5: seznam řádků v jedné kartě, zvýrazněné jen ty
   s nálezem. Prázdná kategorie je jeden řádek. */
.kategorie-p5 { margin-top: 14px; border: 1px solid #E8EBF1; border-radius: 12px; overflow: hidden; }
.kategorie-p5__karta { padding: 10px 14px; background: #fff; }
.kategorie-p5__karta + .kategorie-p5__karta { border-top: 1px solid #EEF0F5; }
.kategorie-p5__karta--nalez { background: #FFFBF3; }
.kategorie-p5__hlava { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.kategorie-p5__cislo {
    flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px;
    border-radius: 7px;
    background: #EEF3FC;
    color: var(--modra);
    font-weight: 800; font-size: 12.5px;
}
.kategorie-p5__nazev { flex: 1 1 220px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kategorie-p5__nazev b { font-size: 14px; color: var(--tmava); }
.kategorie-p5__volba { flex: 0 0 270px; }
.kategorie-p5__zneni summary { cursor: pointer; font-size: 12px; color: var(--sedy); list-style: none; }
.kategorie-p5__zneni summary::-webkit-details-marker { display: none; }
.kategorie-p5__zneni summary::before { content: "ⓘ "; }
.kategorie-p5__zneni[open] { flex-basis: 100%; }
.kategorie-p5__zneni p { margin: 4px 0 2px; font-size: 13px; line-height: 1.5; color: #3D4A62; }
.kategorie-p5__karta .vyt-udaje { margin: 8px 0 2px 38px; }
.kategorie-p5__karta .vyt-udaj b { font-size: 13.5px; font-weight: 600; }
.kategorie-p5__nezarazene { margin-top: 18px; }
.kategorie-p5__nezarazene h3 { font-size: 14px; margin: 0 0 4px; }
.odznak--modra { background: #EAF2FC; color: var(--modra); }

@media (max-width: 560px) {
    /* Builder na úzké obrazovce skládá přepínač pod sebe. Tři krátké volby
       se ale vejdou vedle sebe a pod sebou by každá kategorie zabrala tři řádky. */
    #posouzeni .prepinac { flex-direction: row; }
    #posouzeni .prepinac span { margin: 0 0 0 -1px; border-radius: 0; }
    #posouzeni .prepinac label:first-child span { margin-left: 0; border-radius: 6px 0 0 6px; }
    #posouzeni .prepinac label:last-child span { border-radius: 0 6px 6px 0; }
    .kategorie-p5__volba { flex-basis: 100%; }
    .kategorie-p5__karta .vyt-udaje { margin-left: 0; }
}

/* ------------------------------------------------ přehled zakázek: dlaždice */

/* Klikací celá dlaždice (podle rizikabozp): odkaz v názvu se roztáhne přes
   kartu. Text odkazu je pořád jen název, takže čtečka nečte celou kartu. */
.zak-odkaz::after { content: ''; position: absolute; inset: 0; border-radius: 14px; }
/* Hlavička má v `prehled.css` `position: relative` a odkaz se pak roztáhl jen
   přes ni — klikat šlo pořád jen na název. Vrstvu musí nést karta. */
.zak-karta .zak-hlava { position: static; }
.zak-odkaz:focus-visible { outline: none; }
.zak-odkaz:focus-visible::after { outline: 2px solid var(--modra); outline-offset: 2px; }
.zak-karta { cursor: pointer; }
/* Koš nad roztaženým odkazem — jinak by klik na koš otevřel zakázku.
   Jen ovládací prvky: štítek „V pořádku" nad odkazem by klik zakázku neotevřel. */
.zak-karta .zak-akce form, .zak-karta .zak-akce a { position: relative; z-index: 1; }

/* Ukazatel postupu a tlačítka karty jsou v `zakazky.css` z rizik (14. 10.
   2026). Tady jen co má plán jinak: PĚT dílků místo osmi (rizika mají osm
   kroků builderu) — `zakazky.css` se načítá až po tomhle souboru, proto
   delší selektor. */
.zak-seznam--zakazky .zakazka-pruh { grid-template-columns: repeat(5, 1fr); }

/* PATIČKA KARTY: vlevo stav, vpravo tužka, koš a špendlík. Rizika mají
   tlačítka nahoře vedle monogramu, tady tam stojí fotka stavby (zadavatel).
   Záporné okraje = odsazení karty z `prehled.css`, jinak by čára končila
   před proužkem stavu. `position: relative`, ať se nabídka kroků u tužky
   (`.zak-uprava-panel`) zarovná k pravému okraji patičky, ne karty. */
.zak-pata {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: auto -17px 0 -20px;
    padding: 10px 13px 0 20px;
    border-top: 1px solid var(--lem);
}
.zak-pata .zak-odznak svg { width: 13px; height: 13px; margin-right: 5px; }
/* Stav na štítku — barvy jako proužek karty. Dvě třídy: `prehled.css`
   se načítá až po tomhle souboru a šedý podklad `.zak-odznak` by vyhrál. */
.zak-odznak.zak-odznak--kontrola { background: #FDF1DF; color: #8A5207; }
.zak-odznak.zak-odznak--ok       { background: #E6F6EE; color: #0B6B4C; }
.zak-odznak.zak-odznak--cizi     { background: #EEF3FC; color: #0B4E9E; }
/* Počet zakázek u zákazníka je odkaz do přehledu — nad roztaženým odkazem
   karty, jinak by klik otevřel zákazníka. */
a.zak-odznak.zak-odznak--odkaz { position: relative; z-index: 1; color: var(--modra); }
a.zak-odznak.zak-odznak--odkaz:hover { background: #E4ECF9; }

/* Označení zakázky a IČO pod názvem karty. Do 14. 10. 2026 to byla třída
   štítku filtrů ze starého `prehled.css`; rizikový ji nemá. */
.zak-stitek {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--sedy);
}

/* Kancelář na kartě cizí zakázky (vidí ji jen admin) — šedě, ať se neplete
   se jménem zpracovatele, které je modré. */
.zak-vede--kancelar { color: var(--sedy); }

/* ŘÁDKY. Táž karta, jen naležato: fotka a název vlevo, postup uprostřed,
   patička vpravo. `zakazky.css` z rizik dělá řádek flexem pro kartu
   s monogramem; s fotkou a patičkou se líp drží mřížka. */
@media (min-width: 901px) {
    .zak-seznam--zakazky.zak-seznam--seznam .zakazka-karta {
        display: grid;
        /* Patička pevně široká: s `auto` se podle délky štítku posouval
           sloupec postupu a dílky pod sebou neseděly. */
        grid-template-columns: minmax(0, 1fr) 220px 250px;
        align-items: center;
        gap: 20px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .zak-seznam--seznam .zak-nahled { width: 64px; height: 48px; }
    .zak-seznam--seznam .zak-nahled svg { width: 20px; height: 20px; }
    .zak-seznam--seznam .zak-telo .zak-stitek { display: inline-block; margin: 0 0 0 6px; }
    .zak-seznam--seznam .zak-telo .zak-nazev { display: inline; }
    .zak-seznam--seznam .zakazka-titulek .zak-vede { display: inline-flex; margin: 3px 12px 0 0; }
    .zak-seznam--zakazky.zak-seznam--seznam .zak-pata { margin: 0; padding: 0; border-top: 0; gap: 14px; }
}


/* Kdo je právě přihlášený — tečka před jménem v Účtech. Zelená je táž
   jako proužek „v pořádku“ na kartách zakázek. */
.admin-online {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 7px 1px 0;
    border-radius: 50%;
    background: #17A47A;
    box-shadow: 0 0 0 3px #DDF3EA;
    vertical-align: middle;
}
.admin-online-text { font-weight: 700; color: #0B6B4C; }

/* ------------------------------------------- pruh filtrů v Účtech Správy

   `.admin-filtr` a `.f-mini` jsou z `admin.css`; tady jsou jen dvě věci,
   které jim chybí, protože rizikabozp v panelu nic nehledá.

   `.f-mini` je šité na vyběrátka a drží vpravo místo na šipku. Textové
   pole ho nepotřebuje a bez šířky by se ve `flex` pruhu srazilo na pár
   znaků — do hledání se má vejít e-mail. */

.admin-filtr .f-hledani { flex: 1 1 210px; min-width: 150px; padding-right: 9px; }

/* Důvod, proč účet nejde smazat, stojí místo popelnice. Buňka se zásahy má
   kvůli tlačítkům `white-space: nowrap`; věta by se v ní roztáhla přes půl
   tabulky a rozjela vodorovný posuv. */

.admin-akce .admin-akce-duvod {
    display: block;
    max-width: 190px;
    margin-left: auto;
    white-space: normal;
    line-height: 1.35;
}

/* V řádku účtu stojí čtyři zásahy: heslo, vypnutí, licence a smazání.
   `.admin-akce` je kvůli tlačítkům v řadě `nowrap`, jenže tady se sloupec
   roztáhl tak, že Stav i zásahy vypadly z karty ven a byly až za
   vodorovným posuvem. Zalomit se smějí; `text-align: right` z panelu je
   pak drží u pravého okraje jako slova v odstavci. */

.admin-tabulka--ucty td.admin-akce { white-space: normal; }
.admin-tabulka--ucty td.admin-akce > form,
.admin-tabulka--ucty td.admin-akce > details { margin: 2px 0 2px 6px; }

/* Rozbalená licence. `admin.css` dává panelu pevných 330 px podle toho,
   jak široký je sloupec zásahů na rizikabozp; tady je užší a panel z karty
   vylézal vpravo ven. Otevřený dostane vlastní řádek pod tlačítky a drží
   se u pravého okraje buňky — zavřená klapka zůstává tlačítkem v řadě. */

.admin-tabulka--ucty td.admin-akce > details[open] { display: block; }
.admin-tabulka--ucty .admin-rozbal--drobne[open] > .admin-rozbal-obsah {
    width: auto;
    max-width: 260px;
    margin-left: auto;
}


/* ------------------------------------------- fotka stavby a loga firem

   Karta v přehledu nese fotku jako miniaturu vlevo od názvu, jako
   rizikabozp. Proužek přes celou šířku dělal kartu s fotkou o čtvrt metru
   vyšší než sousedy. Karta bez fotky má na stejném místě stejně velkou
   plochu s budovou — jinak by názvy v mřížce neseděly pod sebou.

   Rozměr je pevný a `object-fit: cover` uřízne, co se nevejde — fotky
   z telefonu chodí na výšku i na šířku a karta se podle toho měnit nesmí. */

.zak-telo { display: flex; align-items: flex-start; gap: 14px; }
.zak-nahled {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 112px;
    height: 84px;
    border-radius: 10px;
    background: #EEF1F7;
    color: #BCC5D6;
}
.zak-nahled img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}
.zak-nahled svg { width: 30px; height: 30px; }
.zak-telo .zakazka-titulek { flex: 1 1 auto; min-width: 0; }
.zak-telo .zak-nazev { display: block; }


/* Všechny karty v mřížce stejně vysoké jako ta nejvyšší, ne jen v řádku.
   V jednom sloupci na telefonu by to jen nechalo prázdno pod krátkými. */
@media (min-width: 901px) {
    .zak-seznam--zakazky { grid-auto-rows: 1fr; }
}

@media (max-width: 480px) {
    .zak-nahled { width: 84px; height: 63px; }
    .zak-nahled svg { width: 24px; height: 24px; }
}

/* Logo místo monogramu v hlavičce karty firmy. `contain` proto, že logo
   se ořezávat nesmí — na rozdíl od fotky je to značka. */
.zak-logo {
    flex: none;
    width: 38px;
    height: 38px;
    padding: 3px;
    border: 1px solid var(--lem-karta);
    border-radius: 11px;
    object-fit: contain;
    background: #fff;
}

/* Hlavička detailu firmy: logo (nebo monogram) vedle názvu. */
.firma-hlava { display: flex; align-items: center; gap: 12px; }
.firma-logo {
    flex: none;
    max-width: 84px;
    max-height: 48px;
    object-fit: contain;
}

.firma-osoby { margin: 6px 0 0; padding: 0; list-style: none; }
.firma-osoby li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--lem);
}
.firma-osoby li:last-child { border-bottom: 0; }
.firma-osoby b { display: block; font-size: 14.5px; color: var(--tmava); }
.firma-osoby em {
    display: block;
    margin-top: 2px;
    font-size: 12.5px;
    font-style: normal;
    color: var(--sedy);
}

/* Logo firmy v řádku účastníka (krok 2). Sedí na místě `vyt-znak`, takže
   má jeho rozměr — jinak by řádky s logem a bez loga nebyly zarovnané. */
.ucastnik-logo {
    flex: none;
    width: 38px;
    height: 38px;
    margin-top: 2px;
    padding: 3px;
    border: 1px solid var(--lem-karta);
    border-radius: 11px;
    object-fit: contain;
    background: #fff;
}

/* Náhled fotky v úpravě zakázky. Strop na výšku, ať formulář nezmizí. */
.foto-nahled { margin: 0 0 8px; }
.foto-nahled img {
    display: block;
    max-width: 100%;
    max-height: 220px;
    border-radius: 10px;
    object-fit: cover;
}

/* Volba zdrojů v PDF pod kartou exportu (26. 9. 2026). */
.pdf-volby { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; border-top: 1px solid var(--lem); }
.pdf-volby__radek { display: flex; gap: 10px; align-items: flex-start; flex: 1 1 420px; font-size: 13px; color: var(--sedy); }
.pdf-volby__radek input { margin-top: 3px; flex: none; }
.pdf-volby__radek b { display: block; color: var(--tmava); }

/* Obrázek na titulce v kroku 5 (26. 9. 2026). */
.titulka-obrazek { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 640px) { .titulka-obrazek { grid-template-columns: 1fr; } }
.titulka-obrazek img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; border: 1px solid var(--lem); }
.titulka-obrazek__prazdno {
    display: grid;
    place-items: center;
    aspect-ratio: 16 / 9;
    padding: 12px;
    border: 1px dashed var(--lem);
    border-radius: 8px;
    font-size: 12.5px;
    color: var(--sedy);
    text-align: center;
}

/* Kalkulačka osobodnů v kroku 3 (26. 9. 2026). */
.osobodny-kalk { margin-top: 6px; }
.osobodny-kalk > summary { font-size: 12.5px; font-weight: 600; color: var(--modra); cursor: pointer; }
.osobodny-kalk__radek {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin-top: 6px;
    font-size: 12.5px;
    color: var(--sedy);
}
.osobodny-kalk__radek label { font-weight: 600; color: var(--telo); }
.osobodny-kalk__radek input { width: 90px; }

/* ------------------------------------------ editor situačního výkresu

   vykres.php (25. 9. 2026): paleta vlevo, výkres uprostřed, legenda
   vpravo. Výkres je obrázek a přes něj SVG se stejným poměrem stran —
   souřadnice prvků jsou v poměru k výkresu, takže velikost okna nevadí. */

.vykres-lista {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}
.vykres-rezimy { display: flex; flex-wrap: wrap; gap: 4px; }
.vykres-rezim {
    padding: 7px 12px;
    border: 1px solid var(--lem);
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--telo);
    cursor: pointer;
}
.vykres-rezim[aria-pressed="true"] { background: var(--tmava); border-color: var(--tmava); color: #fff; }
.vykres-akce { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
/* Tlačítka tříd `tlacitko-*` mají vlastní `display`, který `hidden` přebije. */
.vykres-akce [hidden] { display: none; }
.vykres-napoveda { margin: 10px 0; font-size: 12.5px; color: var(--sedy); }

.vykres-mrizka {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr) 190px;
    gap: 14px;
    align-items: start;
}
@media (max-width: 1000px) {
    .vykres-mrizka { grid-template-columns: 1fr; }
}
.vykres-paleta__skupina {
    margin: 8px 0 4px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sedy);
}
.vykres-paleta__znacky { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.vykres-paleta__znacky button,
.vykres-paleta__radek {
    padding: 3px;
    border: 1px solid transparent;
    border-radius: 7px;
    background: #fff;
    cursor: pointer;
}
.vykres-paleta__znacky img { display: block; width: 100%; height: auto; }
.vykres-paleta__radek {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-bottom: 4px;
    padding: 6px 8px;
    border-color: var(--lem);
    font: inherit;
    font-size: 12px;
    color: var(--telo);
    text-align: left;
}
.vykres-paleta [aria-pressed="true"] { border-color: var(--modra); background: #EAF2FC; box-shadow: 0 0 0 1px var(--modra); }

.vykres-platno {
    position: relative;
    border: 1px solid var(--lem);
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    user-select: none;
}
.vykres-platno img { display: block; width: 100%; height: auto; pointer-events: none; }
.vykres-platno svg { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.vykres-platno svg[data-rezim="v"] { cursor: default; }
.vykres-platno svg[data-rezim="v"] [data-i] { cursor: move; }

.vykres-legenda ul { margin: 0; padding-left: 16px; display: grid; gap: 4px; font-size: 12.5px; }
.vykres-legenda__prazdno { list-style: none; margin-left: -16px; color: var(--sedy); font-style: italic; }

/* ------------------------------------------------ přílohy plánu v kroku 4

   Seznam příloh sestavuje aplikace (25. 9. 2026). Přílohy č. 1 a 2 jsou
   pevné řádky; u souborů pořadí šipkami, přejmenování a odebrání. */

.prilohy td { vertical-align: top; }
.prilohy__pevna td { color: var(--sedy); }
.prilohy__pevna b { color: var(--telo); }
.prilohy__zdroj { display: block; font-size: 11.5px; color: var(--sedy); margin-top: 2px; }
.prilohy__akce { white-space: nowrap; text-align: right; }
.prilohy__akce .tlacitko-lem { min-width: 30px; }
.prilohy-pridat {
    display: grid;
    gap: 14px;
    border-top: 1px solid var(--lem);
}
.prilohy-pridat .pole-radek { align-items: end; }

/* ------------------------------------------- bezpečnostní značky v kroku 4

   Pás značek nad polem s textem ukazuje, co se u té části vytiskne do
   plánu. Od 24. 9. 2026 se dají odebrat křížkem a přidat z výběru pod
   pásem; stejný výběr vkládá značku do textu. */

.znacky-cast { margin: 0 0 12px; }
.znacky-cast__hlava {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--sedy);
}
.znacky-pas {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 0;
    padding: 10px 12px;
    list-style: none;
    border: 1px solid var(--lem);
    border-radius: 10px;
    background: #FBFCFE;
}
.znacky-pas li {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: var(--sedy);
}
.znacky-pas img { display: block; flex: none; }
.znacky-pas__pryc {
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--lem);
    border-radius: 50%;
    background: #fff;
    color: var(--sedy);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}
.znacky-pas__pryc:hover { color: #B42318; border-color: #E7B7B2; }
.znacky-pas__prazdno { font-style: italic; }

.znacky-vyber { margin-top: 6px; }
.znacky-vyber > summary {
    display: inline-block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--modra);
    cursor: pointer;
    list-style: none;
}
.znacky-vyber > summary::-webkit-details-marker { display: none; }
.znacky-vyber[open] {
    padding: 10px 12px 12px;
    border: 1px solid var(--lem);
    border-radius: 10px;
    background: #fff;
}
.znacky-vyber--text { margin: 0 0 8px; }
.znacky-vyber__skupina {
    margin: 10px 0 4px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sedy);
}
.znacky-mrizka {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 8px;
    margin-top: 6px;
}
.znacky-mrizka button {
    display: grid;
    justify-items: center;
    gap: 4px;
    padding: 8px 4px;
    border: 1px solid var(--lem);
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 11px;
    line-height: 1.25;
    color: var(--telo);
    text-align: center;
    cursor: pointer;
}
.znacky-mrizka button:hover { border-color: var(--modra); background: #F4F8FE; }
.znacky-mrizka code { font-size: 10px; color: var(--sedy); }
/* Se skriptem se vkládá kliknutím, klíč není potřeba číst. */
.ma-skript .znacky-mrizka code { display: none; }

/* Log chyb v adminu (29. 9. 2026). Hlavička záznamu nese název třídy
   PHP bez jediné mezery (`Smalot\PdfParser\Exception\…`) a na telefonu
   roztáhla stránku na šestistovku. Zalamuje se kdekoli, výpis pod ní taky
   — vodorovný posuvník v úzkém sloupci se špatně čte i posouvá. */
.admin-rozbal--log > summary { overflow-wrap: anywhere; }
.admin-rozbal--log pre { white-space: pre-wrap; overflow-wrap: anywhere; }

/* ------------------------------------------ přihlášení: cesta zpět a heslo

   Šipka zpět na web (29. 9. 2026). Na pozadí stránky, ne v kartě: karta je
   o přihlášení, tohle je cesta pryč. Na telefonu karta vyplní šířku a šipka
   by na ní ležela, proto `absolute` a místo nad kartou. */
.prihlaseni-zpet {
    position: absolute;
    top: 18px;
    left: 18px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 15px 9px 12px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}
.prihlaseni-zpet:hover { border-color: #fff; background: rgba(255, 255, 255, .1); }
.prihlaseni-zpet svg { width: 16px; height: 16px; }
@media (max-width: 600px) {
    .strana-prihlaseni { padding-top: 64px; }
}

.prihlaseni-zapomenute { margin: -4px 0 12px; text-align: right; font-size: 13px; color: var(--sedy); }
.prihlaseni-zapomenute a { color: var(--modra); font-weight: 700; }
/* `.prihlaseni input` dává polím `display: block` a to přebije atribut
   `hidden` — skryté pole s e-mailem pro správce hesel by se ukázalo. */
.prihlaseni input[hidden] { display: none; }
/* Podnadpis je jinde verzálkami; e-mail se tak číst nemá. */
.prihlaseni-popis--email { text-transform: none; letter-spacing: 0; font-size: 13.5px; }
.prihlaseni-napoveda { margin: -4px 0 12px; text-align: left; font-size: 12.5px; color: var(--sedy); }

/* Limit AI beta kanceláře v Adminu → Kanceláře (29. 9. 2026). Pole na
   pár číslic — `.f-mini` je šité na vyběrátka a bez šířky by se natáhlo. */
.admin-ai-strop { margin-top: 6px; }
.admin-ai-strop .f-mini { width: 90px; }

/* ------------------------------------------ podpora jako konverzace (29. 9.)

   Vlevo seznam vláken, vpravo otevřené vlákno. Bubliny: moje vpravo,
   druhá strana vlevo — u uživatele je „moje" jeho zpráva, v adminu naše
   (`pba_podpora_bubliny()`). Vlákno se neroluje uvnitř: roste stránka,
   ať na telefonu nejsou dva posuvníky v sobě. */
.podpora-chat {
    display: grid;
    grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
    gap: 24px;
}
.podpora-seznam {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-right: 18px;
    border-right: 1px solid var(--lem);
}
.podpora-nova,
.podpora-polozka {
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--tmava);
    text-decoration: none;
}
.podpora-nova {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    border: 1px dashed #C6D6EE;
    color: var(--modra);
    font-weight: 700;
    font-size: 14px;
}
.podpora-nova svg { width: 16px; height: 16px; }
.podpora-polozka:hover, .podpora-nova:hover { background: #F4F8FE; }
.podpora-polozka--zde { background: #EEF4FF; }
.podpora-polozka b {
    display: block;
    overflow: hidden;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.podpora-polozka em { display: block; margin-top: 2px; font-size: 12px; font-style: normal; color: var(--sedy); }
/* Nová odpověď: tečka za názvem. Text pro čtečku je v HTML (`sr-only`). */
.podpora-polozka--nova b::after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 6px;
    border-radius: 50%;
    background: var(--modra);
    vertical-align: middle;
}
.podpora-stav { font-weight: 700; }
.podpora-stav--nove       { color: #9A5B00; }
.podpora-stav--odpovezeno { color: var(--modra); }
.podpora-stav--vyrizeno   { color: #0B6B4C; }

.podpora-zpravy { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.podpora-bublina {
    align-self: flex-start;
    max-width: 78%;
    padding: 10px 14px;
    border-radius: 14px 14px 14px 4px;
    background: #F1F4F9;
}
.podpora-bublina--moje { align-self: flex-end; border-radius: 14px 14px 4px 14px; background: #E6F0FF; }
.podpora-bublina p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--tmava); overflow-wrap: anywhere; }
.podpora-bublina em { display: block; margin-top: 4px; font-size: 11.5px; font-style: normal; color: var(--sedy); }

.podpora-odpoved { display: flex; align-items: flex-end; gap: 10px; margin-top: 16px; }
.podpora-odpoved textarea {
    flex: 1;
    min-height: 72px;
    padding: 10px 12px;
    border: 1px solid var(--lem-karta);
    border-radius: 10px;
    font: inherit;
    resize: vertical;
}
.podpora-odpoved + .admin-drobne { margin-top: 8px; }

@media (max-width: 900px) {
    .podpora-chat { grid-template-columns: minmax(0, 1fr); }
    .podpora-seznam { padding: 0 0 12px; border-right: 0; border-bottom: 1px solid var(--lem); }
    .podpora-bublina { max-width: 92%; }
    .podpora-odpoved { flex-direction: column; align-items: stretch; }
}

/* Počet nových odpovědí u Podpory v menu. Barva jako `.lista-znacka`. */
.panel-polozka-pocet {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    margin-left: auto;
    padding: 0 6px;
    border-radius: 10px;
    background: #FDE68A;
    color: #7C4A03;
    font-size: 11.5px;
    font-weight: 800;
}

.pravni-seznam { margin: 10px 0 0; padding: 0; list-style: none; }
.pravni-seznam li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--lem); font-size: 14px; }
.pravni-seznam li:last-child { border-bottom: 0; }
.pravni-seznam a { color: var(--modra); font-weight: 700; }
.pravni-seznam em { flex: none; font-style: normal; font-size: 12.5px; color: var(--sedy); }

/* Odkaz na úpravu zakázky pod jejím názvem v levém panelu (30. 9. 2026). */
.panel-upravit {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 6px 14px 0;
    padding: 4px 14px;
    font-size: 12.5px;
    font-weight: 700;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
}
.panel-upravit:hover { color: #fff; }
.panel-upravit svg { width: 14px; height: 14px; }
/* Na telefonu je levý panel vodorovný pruh (`builder.css`) — odkaz v něm
   jen jako další položka, bez odsazení. */
@media (max-width: 900px) {
    .rozvrh--builder .panel-upravit { order: 99; flex: none; margin: 0; padding: 0; white-space: nowrap; }
}

/* Uzavření zakázky (11. 10. 2026): tlačítko pod úpravou zakázky,
   v kroku 5 a v pruhu uzavřené zakázky. */
.zakazka-uzavrit { margin-top: 24px; padding-top: 18px; border-top: 1px solid #E3E8EF; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.zakazka-uzavrit .pole-hint { margin: 0; max-width: 60ch; }
/* Pruh nad obsahem (licence, cizí kancelář, uzavřená zakázka). Ležel jen
   v builder.css, takže mimo kroky zakázky byl bez stylu (11. 10. 2026). */
.pruh-poznamka {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 13px 0 0;
    padding: 11px 15px;
    border: 1px solid #D8E4F6;
    border-radius: 9px;
    background: #F3F7FD;
    font-size: 13px;
    color: #123A6B;
}
.pruh-poznamka i { flex: none; display: flex; color: var(--modra); }
.pruh-poznamka svg { width: 17px; height: 17px; }
.pruh-poznamka--vystraha { border-color: #F2D2A2; background: #FEFAF3; }
.pruh-poznamka--vystraha svg { color: #8A5207; }
.pruh-poznamka .zakazka-stav { margin-top: 10px; }
.obsah-aplikace > .pruh-poznamka { margin-bottom: 16px; }

/* Novinky nad Dashboardem (12. 10. 2026), podle „Novinka v Koordi". */
.novinky { margin: 0 0 18px; }
.novinka { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border: 1px solid #CFE3D8; border-radius: 12px; background: #F2FAF5; }
.novinka-ikona { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #E0F3E8; color: #1F8A4C; }
.novinka-ikona svg { width: 18px; height: 18px; }
.novinka-telo { flex: 1; min-width: 0; }
.novinka-nadhlavi { margin: 0 0 2px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #1F8A4C; }
.novinka-titulek { margin: 0 0 4px; font-weight: 700; color: #0C2141; }
.novinka-text { margin: 0; font-size: 14px; line-height: 1.55; color: #3D4B5E; white-space: pre-line; overflow-wrap: anywhere; }
.novinka-odkaz { margin-top: 10px; }
.novinka-skryt { flex: none; }
.novinka-krizek { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #55657A; cursor: pointer; }
.novinka-krizek:hover, .novinka-krizek:focus-visible { background: #E0F3E8; color: #0C2141; }
.novinka-krizek svg { width: 16px; height: 16px; }
.novinky-vse { margin-top: 6px; }
.novinky-vse summary { cursor: pointer; font-size: 13.5px; color: #55657A; width: fit-content; padding: 4px 0; }
.novinky-vse ul { list-style: none; margin: 6px 0 0; padding: 0; border: 1px solid #E3E8EF; border-radius: 12px; background: #fff; }
.novinky-vse li { padding: 12px 16px; }
.novinky-vse li + li { border-top: 1px solid #E3E8EF; }
.novinky-vse li a { display: inline-block; margin-top: 6px; font-size: 14px; }

/* ---------------------------------------------- profil: jen pro plán

   `profil.css` je opsaný z rizikabozp beze změny (14. 10. 2026); tady je
   jen to, co plán má jinak. */

/* Logo bez podpisu vedle sebe: karta by se roztáhla přes celé okno
   a náhled loga by byl nudle. */
.kp-logo-samo { width: 100%; max-width: 360px; }

/* Hláška o uložení v okně stojí nad sekcí; na rizikách je to toast. */
.kp-body > .msg { margin: 0 0 14px; }

/* Pole na heslo s okem (`pba_heslo_pole()`): oko je vycentrované na
   výšku pole, a ta je v profilu 38 px, na telefonu 44. */
.kp .heslo-pole > input { padding-right: 42px; }

/* Pruh vyčerpání stropu na vytěžení ve Správě. Do 14. 10. 2026 si ho
   Správa půjčovala ze starého `profil.css` (`profil-drah`). */
.strop-drah { display: block; height: 6px; border-radius: 999px; background: #E7ECF5; overflow: hidden; }
.strop-vypln { display: block; height: 100%; border-radius: 999px; background: var(--zluta); }
.strop-vypln--0 { width: 0%; }   .strop-vypln--10 { width: 10%; } .strop-vypln--20 { width: 20%; }
.strop-vypln--30 { width: 30%; } .strop-vypln--40 { width: 40%; } .strop-vypln--50 { width: 50%; }
.strop-vypln--60 { width: 60%; } .strop-vypln--70 { width: 70%; } .strop-vypln--80 { width: 80%; }
.strop-vypln--90 { width: 90%; } .strop-vypln--100 { width: 100%; background: var(--zelena); }

/* Ikona uvnitř věty (nápověda u hesla, lišta s uložením): `aplikace.css`
   dává ikonám `display: block` a ta by odskočila na vlastní řádek. */
.kp-muted > svg { display: inline-block; }

/* „Zbývá 1 · dokončit" je na telefonu jediný odkaz v kartě dokončení —
   kreslí se dál 18 px vysoký, klepnout jde na 44. */
@media (max-width: 767.98px) {
    .kp-progress-link { padding-block: 13px; margin-block: -13px; }
}

/* Počet zakázek u zákazníka je odkaz — na telefonu klepnutelný jako
   ostatní ovládání (dřív to hlídalo pravidlo pro chipy v `prehled.css`). */
@media (max-width: 620px) {
    a.zak-odznak.zak-odznak--odkaz { min-height: 40px; padding: 0 14px; }
}

/* =====================================================================
   SPRÁVA — jen planbozp (14. 10. 2026 přestěhováno z `admin.css`, který
   je zase rizikový soubor beze změny): spuštění podmínek, úklid,
   náhled titulky, oznámení a novinky. Rizika nic z toho nemají.
   ===================================================================== */


.admin-uklid { display: grid; gap: 4px; margin: 14px 0 22px; }
.admin-uklid .volba-radek {
    display: flex; align-items: flex-start; gap: 10px; margin-top: 10px;
    font-weight: 600; color: var(--tmava); cursor: pointer;
}
.admin-uklid .volba-radek input { width: 18px; height: 18px; margin: 2px 0 0; flex: none; }
.admin-uklid .pole-hint { margin: 0 0 0 28px; }
.admin-uklid .tlacitko-hlavni { justify-self: start; margin-top: 14px; }
#uklid h3 { margin: 6px 0 8px; font-size: 15px; }
#uklid code { word-break: break-all; }
.pole-chyba { display: block; margin-top: 4px; font-size: 13px; color: #C0392B; }

/* Náhled a spuštění nových podmínek ve dvou blocích, ať se nikdo neuklikne. */
.admin-nahledy { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.admin-pripraveno { margin: 12px 0 18px; padding: 0; list-style: none; display: grid; gap: 6px; }
.admin-pripraveno li { display: grid; gap: 2px; padding: 9px 12px; border-radius: 8px; font-size: 14px; }
.admin-pripraveno li.is-ok { background: #E4F5EE; color: #0B7A55; }
.admin-pripraveno li.is-chybi { background: #FBF1DC; color: #8A5F00; }
.admin-pripraveno span { font-size: 13px; color: var(--telo); }
.admin-spusteni__form { display: grid; gap: 12px; justify-items: start; padding-top: 14px; border-top: 1px solid var(--lem); }
.admin-spusteni__form .volba-radek { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; color: var(--tmava); cursor: pointer; }
.admin-spusteni__form .volba-radek input { width: 18px; height: 18px; margin: 2px 0 0; flex: none; }

/* Náhled nové titulky na první obrazovce Admin panelu. */
.admin-titulka { display: flex; justify-content: center; padding: 22px; }
.admin-titulka__tlacitko {
    display: inline-flex; align-items: center; justify-content: center; min-width: min(100%, 360px);
    padding: 18px 36px; border-radius: 12px; background: #C62828; color: #fff;
    font-size: 18px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; text-decoration: none;
    box-shadow: 0 8px 22px rgba(198,40,40,.28); transition: background .15s, transform .15s;
}
.admin-titulka__tlacitko:hover { background: #A61F1F; color: #fff; transform: translateY(-1px); }
.admin-titulka__tlacitko:focus-visible { outline: 3px solid #F2A3A3; outline-offset: 3px; }

/* Text oznámení o nových podmínkách v Údržbě (11. 10. 2026). */
.admin-oznameni-text pre { margin: 10px 0 0; padding: 12px 14px; max-height: 420px; overflow: auto; white-space: pre-wrap; font: 13px/1.55 ui-monospace, Consolas, monospace; background: #F6F8FB; border: 1px solid #E3E8EF; border-radius: 8px; }

/* Historie novinek ve Správě (12. 10. 2026). */
.admin-novinky { list-style: none; margin: 0; padding: 0; }
.admin-novinky li { display: flex; gap: 16px; justify-content: space-between; align-items: flex-start; padding: 14px 18px; border-top: 1px solid #E3E8EF; }
.admin-novinky li > div { min-width: 0; }
.admin-novinky li p { margin: 4px 0 0; white-space: pre-line; overflow-wrap: anywhere; }
.admin-novinky li .odznak { margin-left: 8px; }
.admin-novinky--skryta > div { opacity: .7; }