/* =====================================================================
 *  UNI-PAD — Designový systém (hlavní stylopis)
 *  Skleněný, nadčasový vzhled. Barvy jdou VŽDY přes proměnné, nikdy
 *  natvrdo — přidání tématu = přepnutí hodnot proměnných.
 * ===================================================================== */

/* ---------- Značkový iridescentní gradient (signatura) ------------- */
:root{
  --iris-blue:#5B8DEF; --iris-violet:#8B7FF0; --iris-pink:#E89BC4; --iris-gold:#F0C080;
  --grad-iris:linear-gradient(110deg,#5B8DEF 0%,#8B7FF0 32%,#E89BC4 64%,#F0C080 100%);
  --grad-zlata:linear-gradient(110deg,#F0C080 0%,#E8B04B 100%);

  /* sémantické (stavové) barvy — napříč tématy stejné */
  --ok:#2DD4A8; --warn:#F0B45C; --err:#F26D6D; --info:#5B8DEF; --fialova:#8B5CF6;

  /* typografie */
  --font-display:"Space Grotesk",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --font-mono:"Space Mono",ui-monospace,monospace;

  /* tvary a pohyb */
  --radius:18px; --radius-s:12px;
  --prechod:180ms ease;
}

/* ---------- TÉMA: dark (výchozí) ----------------------------------- */
:root, [data-theme="dark"]{
  --bg:#08080C; --bg-2:#0E0E16;
  --surface:rgba(255,255,255,0.045); --surface-2:rgba(255,255,255,0.07);
  --border:rgba(255,255,255,0.09); --border-2:rgba(255,255,255,0.15);
  --text:#F4F5FA; --text-muted:#A0A4B8; --text-faint:#6B6F82;
  --glow:0 0 40px rgba(120,140,255,0.18);
  --zar-1:rgba(91,141,239,0.12); --zar-2:rgba(240,192,128,0.08);
}

/* ---------- TÉMA: light (platinová) -------------------------------- */
[data-theme="light"]{
  --bg:#EEF0F6; --bg-2:#F6F7FB;
  --surface:rgba(255,255,255,0.72); --surface-2:rgba(255,255,255,0.92);
  --border:rgba(20,21,30,0.10); --border-2:rgba(20,21,30,0.18);
  --text:#14151C; --text-muted:#5A5E70; --text-faint:#8A8E9E;
  --glow:0 8px 30px rgba(90,110,200,0.12);
  --zar-1:rgba(91,141,239,0.10); --zar-2:rgba(240,192,128,0.10);
  /* Sémantické barvy pro SVĚTLÉ pozadí (bod 80, 21. 7.): tmavší varianty —
     svítivé odstíny laděné na tmavou nebyly na světlé čitelné (kontrast ~1,6:1).
     Přebarví texty, štítky, tečky i nádechy najednou (vše jede přes proměnné). */
  --ok:#0E7A5A; --warn:#92600F; --err:#C43A3A; --info:#3D6BD0;
  --iris-blue:#3D6BD0; --fialova:#6D3FD1;
  /* Iris odstíny (bod 80 / 2C): pastelové verze laděné na tmavou jsou na
     světlém pozadí nečitelné — VIP štítky, fialové akcenty, růžová čísla. */
  --iris-violet:#6D3FD1; --iris-pink:#B03A75; --iris-gold:#8A6420;
}

/* ---------- Základ -------------------------------------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font-body); color:var(--text);
  background:
    radial-gradient(900px 520px at 12% -10%, var(--zar-1), transparent 60%),
    radial-gradient(820px 520px at 100% 0%, var(--zar-2), transparent 55%),
    var(--bg);
  background-attachment:fixed;
  min-height:100vh; line-height:1.5;
  transition:background-color var(--prechod), color var(--prechod);
}

/* svislé uspořádání celé stránky (obsah + patička dole) */
.stranka{ min-height:100vh; display:flex; flex-direction:column; }

/* ---------- Typografie --------------------------------------------- */
h1,h2,h3{ font-family:var(--font-display); font-weight:600; line-height:1.12; }
h1{ font-size:30px; } h2{ font-size:23px; } h3{ font-size:18px; }
.eyebrow{
  font-size:12px; font-weight:500; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--text-faint);
}
.text-tlumeny{ color:var(--text-muted); }
.text-slaby{ color:var(--text-faint); }

/* nadpis s iridescentním přelivem */
.nadpis-iris{
  background:var(--grad-iris); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
/* nadpis se zlatým přelivem (superadmin = majitel) */
.nadpis-zlaty{
  background:var(--grad-zlata); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
/* světlý režim — kontrast (bod 52): plná tmavá zlatá místo bledého přelivu */
[data-theme="light"] .nadpis-zlaty{ background:none; -webkit-text-fill-color:#8A6420; color:#8A6420; }
/* světlý režim — kontrast (bod 80/2C): stejný princip pro iris přeliv (částky faktur, statistiky) */
[data-theme="light"] .nadpis-iris{ background:none; -webkit-text-fill-color:#3D6BD0; color:#3D6BD0; }

/* ---------- Skleněná karta (hlavní stavební kámen) ----------------- */
.glass{
  position:relative; background:var(--surface);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--glow), 0 14px 40px rgba(0,0,0,0.28);
}
/* světlý režim — těžký černý stín tmy nahrazuje jemný šedomodrý */
[data-theme="light"] .glass{ box-shadow:var(--glow), 0 10px 28px rgba(20,21,30,.10); }
.glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,0.10), transparent 40%);
}

/* ---------- Tlačítka ------------------------------------------------ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-display); font-weight:600; font-size:15px;
  padding:13px 22px; border-radius:var(--radius-s); border:1px solid transparent;
  cursor:pointer; text-decoration:none; min-height:44px;
  transition:transform var(--prechod), box-shadow var(--prechod), background var(--prechod);
}
.btn:active{ transform:translateY(1px); }
.btn-plny{ width:100%; }

.btn-primarni{
  color:#0b0b12; background:var(--grad-iris);
  box-shadow:0 6px 20px rgba(120,140,255,0.28);
}
.btn-primarni:hover{ box-shadow:0 8px 28px rgba(120,140,255,0.42); }

.btn-sekundarni{
  color:var(--text); background:var(--surface-2); border-color:var(--border);
}
.btn-sekundarni:hover{ background:var(--surface); }

/* ---------- Formulářové prvky -------------------------------------- */
.pole{ margin-bottom:16px; }
.pole label{
  display:block; font-size:13px; color:var(--text-muted); margin:0 0 7px 2px;
}
.pole input[type=text],
.pole input[type=email],
.pole input[type=password],
.pole input[type=tel],
.pole input[type=number],
.pole select,
.pole textarea{
  width:100%; font-family:var(--font-body); font-size:15px; color:var(--text);
  background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--radius-s); padding:13px 15px; outline:none; min-height:44px;
  transition:border-color var(--prechod);
}
.pole textarea{ resize:vertical; min-height:96px; line-height:1.5; }
.pole input:focus, .pole select:focus, .pole textarea:focus{
  outline:2px solid var(--iris-blue); outline-offset:2px;
}
.pole .napoveda-pole{ font-size:12px; color:var(--text-faint); margin:6px 2px 0; line-height:1.5; }

/* ---------- Hláška (úspěch / chyba / info) ------------------------- */
.hlaska{
  display:flex; gap:11px; align-items:flex-start;
  padding:13px 15px; border-radius:var(--radius-s); margin-bottom:18px;
  font-size:14px; line-height:1.5;
  border:1px solid var(--border); background:var(--surface-2); word-break:break-word;
}
.hlaska .b{ width:10px; height:10px; border-radius:50%; flex:none; margin-top:5px; }
.hlaska.ok    .b{ background:var(--ok);   box-shadow:0 0 12px var(--ok); }
.hlaska.chyba .b{ background:var(--err);  box-shadow:0 0 12px var(--err); }
.hlaska.info  .b{ background:var(--info); box-shadow:0 0 12px var(--info); }

/* ---------- Přepínač tématu ---------------------------------------- */
.prepinac-tema{
  position:fixed; top:18px; right:18px; z-index:10;
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:19px; cursor:pointer; color:var(--text);
  background:var(--surface-2); border:1px solid var(--border);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  transition:background var(--prechod), transform var(--prechod);
}
.prepinac-tema:hover{ transform:rotate(18deg); }

/* ---------- Rozvržení: vystředěný obsah ---------------------------- */
.stred{
  flex:1; display:flex; align-items:center; justify-content:center;
  padding:40px 18px;
}
.karta-uzka{ width:100%; max-width:440px; padding:34px 30px; }

/* ---------- Vstupní (uvítací) stránka ------------------------------ */
.uvod{
  flex:1; display:flex; align-items:center; justify-content:center;
  padding:48px 20px; text-align:center;
}
.uvod-obsah{ width:100%; max-width:600px; }
.uvod-podtitul{
  color:var(--text-muted); font-size:17px; line-height:1.6;
  max-width:460px; margin:0 auto 30px;
}

/* ---------- Patička ------------------------------------------------ */
.paticka{
  padding:22px 18px; text-align:center;
  color:var(--text-faint); font-size:12.5px;
  border-top:1px solid var(--border);
}
.odkaz-zpet{
  display:inline-flex; align-items:center; gap:7px; margin-top:18px;
  padding:9px 16px; border:1px solid var(--border); border-radius:var(--radius-s);
  background:var(--surface); color:var(--text-muted);
  text-decoration:none; font-size:13px; font-weight:600;
  transition:border-color var(--prechod), color var(--prechod), transform var(--prechod), background var(--prechod);
}
.odkaz-zpet:hover{
  border-color:var(--iris-blue); color:var(--iris-blue);
  background:var(--surface-2); transform:translateX(-3px);
  text-decoration:none;
}

/* ---------- Checkbox souhlasu (registrace) ------------------------- */
.souhlas-pole{
  display:flex; align-items:flex-start; gap:11px; cursor:pointer;
  padding:10px 0; color:var(--text-muted); font-size:13.5px; line-height:1.5;
}
.souhlas-pole input[type=checkbox]{
  width:19px; height:19px; flex:none; margin-top:1px; cursor:pointer; accent-color:var(--iris-violet);
}
.souhlas-pole a{ color:var(--iris-blue); text-decoration:none; }
.souhlas-pole a:hover{ text-decoration:underline; }

/* ---------- Pole se vsazeným tlačítkem (IČO + Načíst z ARESu) ------ */
.pole-s-tlacitkem{ display:flex; gap:8px; align-items:flex-start; }
.pole-s-tlacitkem .pole{ flex:1; margin-bottom:0; }
.btn-ares{
  flex:none; margin-top:0; height:44px; padding:0 15px; border-radius:var(--radius-s);
  border:1px solid var(--border); background:var(--surface-2); color:var(--text);
  font-family:var(--font-body); font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap;
  transition:border-color var(--prechod), color var(--prechod);
}
.btn-ares:hover{ border-color:var(--iris-blue); color:var(--iris-blue); }
.btn-ares:disabled{ opacity:.55; cursor:default; }
.ares-stav{ font-size:12px; margin:6px 2px 0; min-height:15px; }
.ares-stav.ok{ color:var(--ok); }
.ares-stav.chyba{ color:var(--err); }

/* ---------- Pole navíc skryté před boty (honeypot) ------------------ */
.pole-skryte{ position:absolute; left:-9999px; top:-9999px; }

/* ---------- Přístupnost a pohyb ------------------------------------ */
:focus-visible{ outline:2px solid var(--iris-blue); outline-offset:2px; }

@media (prefers-reduced-motion:no-preference){
  .nabiha{ animation:nabehnuti .5s ease both; }
  @keyframes nabehnuti{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
}

/* ---------- Responsivita ------------------------------------------- */
@media (max-width:768px){
  h1{ font-size:26px; }
  .logo-panel{ padding:22px 24px; }
  .uvod-podtitul{ font-size:15px; }
  .karta-uzka{ padding:28px 22px; }
}

/* ---------- Široká karta (seznamy, role, formuláře s mřížkou) ----- */
.karta-siroka{ width:100%; max-width:620px; padding:34px 30px; }

/* ---------- Seznam klikacích položek (role apod.) ----------------- */
.seznam{ display:flex; flex-direction:column; gap:10px; }
.radek-polozka{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:15px 17px; border-radius:var(--radius-s);
  background:var(--surface-2); border:1px solid var(--border);
  text-decoration:none; color:var(--text);
  transition:border-color var(--prechod), transform var(--prechod);
}
.radek-polozka:hover{ border-color:var(--iris-blue); transform:translateX(2px); }
.radek-hlavni{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.radek-nazev{ font-family:var(--font-display); font-size:16px; font-weight:600; }
.radek-popis{ font-size:13px; color:var(--text-muted); }
.radek-znacka{
  flex:none; font-size:12.5px; color:var(--text-muted);
  background:var(--surface); border:1px solid var(--border);
  border-radius:999px; padding:4px 11px; white-space:nowrap;
}

/* ---------- Skupiny oprávnění (zaškrtávání) ----------------------- */
.skupina-prav{ margin-bottom:16px; }
.skupina-nazev{
  font-size:12px; font-weight:500; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-faint); margin-bottom:9px;
}
.mrizka-prav{ display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; }
.pravo{
  display:flex; align-items:center; gap:10px; cursor:pointer;
  padding:9px 12px; border-radius:var(--radius-s); min-height:44px;
  background:var(--surface-2); border:1px solid var(--border);
  font-size:14px; color:var(--text); transition:border-color var(--prechod);
}
.pravo:hover{ border-color:var(--iris-blue); }
.pravo input[type=checkbox]{
  width:18px; height:18px; flex:none; cursor:pointer; accent-color:var(--iris-violet);
}

/* ---------- Responsivita: úzké obrazovky -------------------------- */
@media (max-width:768px){
  .karta-siroka{ padding:28px 22px; }
  .mrizka-prav{ grid-template-columns:1fr; }
}

/* ---------- Dvě pole vedle sebe (na úzkém pod sebe) --------------- */
.dvojpole{ display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }

/* ---------- Přepínač v poli (checkbox + popisek) ------------------ */
.prepinac-pole{
  display:flex; align-items:center; gap:11px; cursor:pointer;
  padding:12px 0 18px; color:var(--text); font-size:15px;
}
.prepinac-pole input[type=checkbox]{
  width:20px; height:20px; flex:none; cursor:pointer; accent-color:var(--iris-violet);
}

@media (max-width:768px){
  .dvojpole{ grid-template-columns:1fr; }
}

/* ---------- Oddělovač sekcí --------------------------------------- */
.oddelovac{ border:none; border-top:1px solid var(--border); margin:28px 0; }

/* ---------- Nahrávání souborů (logo, razítko) -------------------- */
.soubor-blok{ display:flex; flex-direction:column; gap:10px; }
.soubor-nahled{
  background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-s);
  padding:14px; display:flex; align-items:center; justify-content:center; min-height:96px;
}
.soubor-nahled img{ max-width:100%; max-height:120px; height:auto; display:block; }
.soubor-prazdno{
  background:var(--surface-2); border:1px dashed var(--border); border-radius:var(--radius-s);
  padding:24px 14px; text-align:center; color:var(--text-faint); font-size:13px;
  min-height:96px; display:flex; align-items:center; justify-content:center;
}
.vstup-soubor{ font-size:13px; color:var(--text-muted); width:100%; }
.vstup-soubor::file-selector-button{
  font-family:var(--font-body); font-size:13px; color:var(--text);
  background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-s);
  padding:8px 14px; margin-right:10px; cursor:pointer; transition:border-color var(--prechod);
}
.vstup-soubor::file-selector-button:hover{ border-color:var(--iris-blue); }
.smazat-radek{ display:flex; gap:20px; flex-wrap:wrap; margin-top:14px; }
.btn-textovy{
  background:none; border:none; color:var(--err); font-size:13px; cursor:pointer;
  padding:4px 0; font-family:var(--font-body); text-decoration:underline;
}
.btn-textovy:hover{ opacity:0.8; }

/* ---------- Krokovač registrace (1-2-3) ------------------------------ */
.wiz-kroky{ display:flex; align-items:flex-start; justify-content:center; gap:6px; margin:2px 0 20px; }
.wiz-krok{ display:flex; flex-direction:column; align-items:center; gap:5px; flex:none; width:64px; }
.wiz-cislo{
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:12.5px;
  background:var(--surface-2); border:1px solid var(--border); color:var(--text-faint);
  transition:background var(--prechod), border-color var(--prechod), color var(--prechod);
}
.wiz-popis{
  font-size:10px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em;
  transition:color var(--prechod);
}
.wiz-krok.aktivni .wiz-cislo{ background:var(--grad-iris); border-color:transparent; color:#0b0b12; box-shadow:0 3px 12px rgba(120,140,255,0.35); }
.wiz-krok.aktivni .wiz-popis{ color:var(--text); font-weight:600; }
.wiz-krok.hotovo .wiz-cislo{ background:var(--ok); border-color:transparent; color:#062018; }
[data-theme="light"] .wiz-krok.hotovo .wiz-cislo{ color:#fff; }   /* na tmavší světlé zelené je tmavý text nečitelný */
.wiz-cara{ width:22px; height:1px; background:var(--border); flex:none; margin-top:14px; }

.wiz-panel{ display:none; }
.wiz-panel.aktivni{ display:block; }
@media (prefers-reduced-motion:no-preference){
  .wiz-panel.aktivni{ animation:nabehnuti .35s ease both; }
}
.wiz-tlacitka{ display:flex; gap:10px; margin-top:18px; }
.wiz-tlacitka .btn{ flex:1; }
.wiz-dalsi{ margin-top:18px; }

/* ---------- Jazykový přepínač (CS/EN) — vedle přepínače tématu ------ */
.jazyk-prepinac{
  position:fixed; top:18px; right:74px; z-index:10;
  display:flex; gap:2px; padding:4px; border-radius:999px;
  background:var(--surface-2); border:1px solid var(--border);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.jazyk-prepinac a{
  display:flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:50%;
  font-family:var(--font-display); font-weight:700; font-size:11px;
  color:var(--text-faint); text-decoration:none;
  transition:background var(--prechod), color var(--prechod);
}
.jazyk-prepinac a:hover{ color:var(--text); }
.jazyk-prepinac a.aktivni{ background:var(--grad-iris); color:#0b0b12; }

/* ---------- Přihlašovací / registrační stránky (jednotný rámec) ---- */
.auth-panel{
  width:100%; max-width:400px; margin:0 auto;
  display:flex; flex-direction:column; align-items:center;
}
.auth-panel .glass{ width:100%; }
.auth-karta{ padding:26px 26px 22px; }
.auth-nadpis{ margin:0 0 4px; font-size:22px; text-align:center; }
.auth-podnadpis{
  color:var(--text-muted); font-size:13px; text-align:center;
  margin:0 0 18px;
}
.auth-prepinac{
  text-align:center; font-size:13.5px; color:var(--text-muted); margin-top:16px;
}
.auth-prepinac a{ color:var(--iris-blue); text-decoration:none; font-weight:600; }
.auth-prepinac a:hover{ text-decoration:underline; }
.auth-panel > .odkaz-zpet{ margin-top:14px; }

@media (max-width:480px){
  .auth-karta{ padding:22px 18px 20px; }
}

/* =====================================================================
 *  KIT EDITORŮ (kompaktní) — jednotné třídy pro editory v oknech/modálech
 *  (velín, doklady, faktura, fotky, e-mail…). Vychází z §6 designového
 *  dokumentu: kompaktní pole, panely-karty, barva tlačítka = funkce.
 * ===================================================================== */
.ed{ padding:16px 20px 34px; max-width:1180px; }
.ed-hlava{ margin-bottom:14px; }
.ed-hlava h1{ font-size:19px; font-weight:700; font-family:var(--font-display); color:var(--text); margin:0; }
.ed-hlava .ed-sub{ font-size:12.5px; color:var(--text-muted); margin-top:2px; }
.ed-hlava .ed-sub a{ color:var(--text-muted); }

.ed-grid{ display:grid; gap:14px; align-items:start; }
.ed-grid.dva{ grid-template-columns:1fr 1fr; }
.ed-grid.tri{ grid-template-columns:1fr 1fr 1fr; }
@media(max-width:820px){ .ed-grid.dva, .ed-grid.tri{ grid-template-columns:1fr; } }

.ed-panel{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:13px 15px; }
.ed-panel + .ed-panel{ margin-top:14px; }
.ed-panel > h2{ font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-muted); margin:0 0 10px; font-weight:600; }

.ed-label{ display:block; font-size:11.5px; color:var(--text-muted); margin:9px 0 4px; }
.ed-label:first-child{ margin-top:0; }
.ed-field{ width:100%; box-sizing:border-box; height:36px; padding:0 11px; border:1px solid var(--border); border-radius:9px; background:var(--surface-2); color:var(--text); font-size:13.5px; font-family:inherit; outline:none; transition:border-color var(--prechod); }
textarea.ed-field{ height:auto; min-height:64px; padding:8px 11px; line-height:1.5; resize:vertical; }
.ed-field:focus{ border-color:var(--iris-blue); }
.ed-field[readonly]{ color:var(--text-muted); background:var(--surface); }
.ed-radek{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }

.ed-akce{ display:flex; gap:10px; align-items:center; margin-top:16px; flex-wrap:wrap; }
.ed-btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; border:none; cursor:pointer; font-family:inherit; font-weight:700; font-size:14px; padding:10px 20px; border-radius:9px; text-decoration:none; transition:filter var(--prechod), box-shadow var(--prechod); }
.ed-btn.plny{ width:100%; }
.ed-btn-hlavni{ background:var(--grad-zlata); color:#2a1c05; }          /* Uložit / Vystavit / Nahrát (§6 = zlatá) */
.ed-btn-hlavni:hover{ box-shadow:0 6px 20px rgba(224,163,60,.42); }
.ed-btn-vedlejsi{ background:var(--surface-2); color:var(--text); border:1px solid var(--border); }
.ed-btn-vedlejsi:hover{ border-color:var(--iris-blue); color:var(--iris-blue); }
.ed-btn-modry{ background:rgba(91,141,239,.14); color:var(--iris-blue); border:1px solid rgba(91,141,239,.40); font-size:13px; padding:8px 15px; }   /* běžná akce (§6 modrý nádech) */
.ed-btn-modry:hover{ background:var(--iris-blue); color:#fff; }

.ed-drop{ border:2px dashed var(--border); border-radius:12px; padding:20px; text-align:center; }
.ed-hint{ font-size:11.5px; color:var(--text-faint); margin-top:8px; line-height:1.5; }
.ed-prazdno{ padding:12px 14px; color:var(--text-faint); font-size:12.5px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }

/* =====================================================================
 *  SPOLEČNÝ ZÁKLAD (Fáze 1 redesignu, dle 06_DESIGNOVY_SYSTEM)
 *  Přídavné sdílené třídy — obrazovky je přebírají postupně (Fáze 2).
 *  Nemění stávající třídy, takže nic se vizuálně nerozbije.
 * ===================================================================== */

/* --- Tokeny: barvy sekcí (§2) + škála rozestupů (§6j) --------------- */
:root{
  --sekce-zakazky:#5B8DEF; --sekce-kalkulace:#8B5CF6; --sekce-faktury:#E0A33C;
  --sekce-diar:#2DD4BF; --sekce-zakaznici:#EC4899; --sekce-vozidla:#6366F1;
  --sekce-partneri:#10B981; --sekce-statistiky:#3B82F6; --sekce-doklady:#64748B;
  --sekce-nastaveni:#6B7280; --sekce-objednavky:#EC4899;
  --sekce-ucetnictvi:#22A06B;   /* zelená peněz — přehledy, uzávěrka, platby */
  --mez-s:8px; --mez-m:16px; --mez-l:24px; --mez-xl:32px;
}
/* Světlý režim — MUSÍ být až ZA :root výše (stejná specificita, vyhrává
   pořadí): fialová kalkulací je na světlém podkladu tmavší (bod 80/2C). */
[data-theme="light"]{ --sekce-kalkulace:#6D3FD1; }

/* --- Tlačítka podle FUNKCE, sklovité „klid → rozsvícení" (§6) ------- */
.tl{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px;
  padding:11px 20px; border-radius:9px; border:1px solid transparent; cursor:pointer; text-decoration:none;
  font-family:var(--font-display); font-weight:600; font-size:14px; line-height:1;
  transition:background var(--prechod), color var(--prechod), border-color var(--prechod), box-shadow var(--prechod), transform var(--prechod); }
.tl:active{ transform:translateY(1px); }
.tl:disabled, .tl.je-zamcene{ opacity:.5; cursor:not-allowed; box-shadow:none !important; transform:none !important; }
.tl svg{ width:17px; height:17px; stroke:currentColor; stroke-width:1.9; fill:none; stroke-linecap:round; stroke-linejoin:round; flex:none; }
/* hlavní akce = zlatá */
.tl-hlavni{ background:rgba(224,163,60,.10); color:#E8C583; border-color:rgba(224,163,60,.38); }
/* světlé téma: zlatý text tmavší, ať je čitelný (vzor bod 52 — .nadpis-zlaty) */
[data-theme="light"] .tl-hlavni{ color:#8A6420; border-color:rgba(176,124,32,.45); background:rgba(224,163,60,.14); }
[data-theme="light"] .tl-ok:hover{ color:#fff; }
.tl-hlavni:hover{ background:var(--grad-zlata); color:#2a1c05; border-color:transparent; transform:translateY(-2px); box-shadow:0 6px 20px rgba(224,163,60,.45); }
/* běžná akce = modrá */
.tl-bezna{ background:rgba(91,141,239,.10); color:var(--iris-blue); border-color:rgba(91,141,239,.35); }
.tl-bezna:hover{ background:var(--iris-blue); color:#fff; border-color:transparent; transform:translateY(-2px); box-shadow:0 6px 20px rgba(91,141,239,.42); }
/* potvrzení / úspěch = zelená */
.tl-ok{ background:rgba(45,212,168,.10); color:var(--ok); border-color:rgba(45,212,168,.35); }
.tl-ok:hover{ background:var(--ok); color:#062b22; border-color:transparent; transform:translateY(-2px); box-shadow:0 6px 20px rgba(45,212,168,.40); }
/* mazání / nebezpečné = červená */
.tl-smazat{ background:rgba(242,109,109,.09); color:var(--err); border-color:rgba(242,109,109,.34); }
.tl-smazat:hover{ background:var(--err); color:#fff; border-color:transparent; transform:translateY(-2px); box-shadow:0 6px 20px rgba(242,109,109,.40); }
/* vedlejší / tiché = šedá kontura */
.tl-vedlejsi{ background:var(--surface); color:var(--text-muted); border-color:var(--border); }
.tl-vedlejsi:hover{ color:var(--text); border-color:var(--text-faint); background:var(--surface-2); }
/* velikosti (§6a) */
.tl-plny{ width:100%; }
.tl-sm{ min-height:36px; padding:7px 14px; font-size:13px; border-radius:8px; }
.tl-ikona{ min-height:0; width:34px; height:34px; padding:0; border-radius:9px; }   /* jen ikonka (řádek tabulky) */
.tl-ikona svg{ width:16px; height:16px; }

/* --- Dlaždice (§6c) — velký piktogram, rozsvícení v barvě sekce ----- */
.dlazdice{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  padding:18px 14px; border-radius:16px; background:var(--surface); border:1px solid var(--border); color:var(--text);
  text-decoration:none; cursor:pointer; --dl:var(--iris-blue);
  transition:transform var(--prechod), border-color var(--prechod), box-shadow var(--prechod); }
.dlazdice .dl-ikona{ width:46px; height:46px; display:flex; align-items:center; justify-content:center; border-radius:14px;
  background:color-mix(in srgb, var(--dl) 14%, transparent); color:var(--dl);
  transition:background var(--prechod), color var(--prechod); }
.dlazdice .dl-ikona svg{ width:28px; height:28px; stroke:currentColor; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.dlazdice .dl-nazev{ font-size:13.5px; font-weight:600; }
.dlazdice:hover{ transform:translateY(-3px); border-color:var(--dl); box-shadow:0 10px 26px color-mix(in srgb, var(--dl) 24%, transparent); }
.dlazdice:hover .dl-ikona{ background:var(--dl); color:#fff; }

/* --- Štítky stavů (§6d) — dvoubarevný průsvitný ------------------- */
.stitek{ display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:20px;
  font-size:11px; font-weight:600; white-space:nowrap; --st:var(--text-faint);
  background:color-mix(in srgb, var(--st) 12%, transparent); border:1px solid color-mix(in srgb, var(--st) 32%, transparent); color:var(--st); }
.stitek svg{ width:12px; height:12px; stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.stitek-ok{ --st:var(--ok); } .stitek-warn{ --st:var(--warn); } .stitek-err{ --st:var(--err); } .stitek-info{ --st:var(--info); }

/* --- Přepínač (toggle) + zaškrtávátko (§6f) ----------------------- */
.prepinac{ position:relative; display:inline-flex; align-items:center; cursor:pointer; }
.prepinac input{ position:absolute; opacity:0; width:0; height:0; }
.prepinac .knot{ width:40px; height:22px; border-radius:20px; background:var(--surface-2); border:1px solid var(--border); position:relative; transition:background var(--prechod), border-color var(--prechod); }
.prepinac .knot::after{ content:""; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:var(--text-muted); transition:transform var(--prechod), background var(--prechod); }
.prepinac input:checked + .knot{ background:color-mix(in srgb, var(--ok) 30%, transparent); border-color:var(--ok); }
.prepinac input:checked + .knot::after{ transform:translateX(18px); background:var(--ok); }
.prepinac input:focus-visible + .knot{ outline:2px solid var(--iris-blue); outline-offset:2px; }
.zaskrt{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-size:13px; color:var(--text); }
.zaskrt input{ width:18px; height:18px; border-radius:6px; accent-color:var(--iris-blue); flex:none; }

/* --- Tabulky / seznamy (§6g) — řádek 44px, hover, akce zprava ----- */
.tabulka{ width:100%; border-collapse:collapse; }
.tabulka thead th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); font-weight:600; padding:6px 12px; border-bottom:1px solid var(--border); }
.tabulka tbody td{ padding:0 12px; height:44px; border-bottom:1px solid var(--border); color:var(--text); font-size:13px; vertical-align:middle; }
.tabulka tbody tr{ transition:background var(--prechod); }
.tabulka tbody tr:hover{ background:var(--surface-2); }
.tabulka tbody tr:last-child td{ border-bottom:none; }
.tabulka .t-vpravo{ text-align:right; }
/* Akce v řádku jsou VIDĚT POŘÁD (pravidlo 16. 7. — hover by je na tabletu schoval úplně);
   najetí na řádek je jen doostří, interakci mají tlačítka sama (.tl hover). */
.tabulka .t-akce{ display:inline-flex; gap:6px; align-items:center; opacity:.75; transition:opacity var(--prechod); }
.tabulka tbody tr:hover .t-akce{ opacity:1; }
@media (hover:none){ .tabulka .t-akce{ opacity:1; } }

/* --- Okna / modály — 3 velikosti (§6h) --------------------------- */
.okno-prekryv{ position:fixed; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(2px); z-index:1000; display:none; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; }
.okno-prekryv.otevreno{ display:flex; }
.okno{ width:100%; background:var(--bg-2, #12121a); border:1px solid var(--border); border-radius:14px; box-shadow:0 20px 50px rgba(0,0,0,.6); }
[data-theme="light"] .okno{ background:#fff; box-shadow:0 16px 44px rgba(20,21,30,.18); }
.okno-male{ max-width:380px; } .okno-stredni{ max-width:520px; } .okno-velke{ max-width:720px; }
.okno-hlava{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-bottom:1px solid var(--border); }
.okno-hlava h3{ font-family:var(--font-display); font-size:15px; font-weight:700; color:var(--text); margin:0; }
.okno-zavri{ width:30px; height:30px; border-radius:8px; border:1px solid var(--border); background:var(--surface); color:var(--text-muted); cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center; }
.okno-zavri:hover{ color:var(--text); border-color:var(--text-faint); }
.okno-telo{ padding:16px 18px; }
.okno-akce{ display:flex; gap:8px; justify-content:flex-end; padding:14px 18px; border-top:1px solid var(--border); }
@media(max-width:600px){ .okno-male, .okno-stredni, .okno-velke{ max-width:100%; } }

/* --- Nadpisy stránek (§6j) --------------------------------------- */
.nadpis-stranka{ font-family:var(--font-display); font-size:20px; font-weight:700; color:var(--text); margin:0; }
.nadpis-sekce{ font-family:var(--font-display); font-size:15px; font-weight:600; color:var(--text); margin:0 0 10px; }
.popisek-skupiny{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-faint); font-weight:600; margin:0 0 6px; }


/* =====================================================================
   IKONOVA SADA (fronta bod 44, schvaleno 18. 7. 2026) - sprite
   assets/ikony.svg + pomocnici lib/ikona-sada.php. Dlazdice = grafit
   + sklovity odraz + sekcni zare pri najeti (promenna --ak); ve
   svetlem tematu zustavaji dlazdice zamerne grafitove (kontrast).
   ===================================================================== */
.ik{ width:20px; height:20px; flex:none; display:inline-block; vertical-align:-4px; }
.uni-tile{ --ak:#85B7EB; position:relative; width:120px; height:120px; border-radius:16px;
  background:#151517; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; border:none; cursor:pointer; overflow:hidden; color:#EDEDF0; text-decoration:none;
  font-family:inherit; transition:transform .15s ease, box-shadow .15s ease; }
.uni-tile::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 42%); }
.uni-tile:hover{ transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.45), 0 0 14px color-mix(in srgb, var(--ak) 35%, transparent); }
.uni-tile:hover .uni-ico{ filter:drop-shadow(0 0 6px color-mix(in srgb, var(--ak) 60%, #fff)); }
.uni-tile:focus-visible{ outline:2px solid var(--ak); outline-offset:2px; }
.uni-ico{ width:64px; height:64px; }
.uni-tile__label{ color:#EDEDF0; font-size:11.5px; font-weight:500; text-align:center; line-height:1.15; max-width:106px; }
.uni-tile.ut-m{ width:96px; height:96px; } .ut-m .uni-ico{ width:50px; height:50px; }
/* SVĚTLÉ TÉMA (bod 80, 21. 7. — ruší „grafit v obou režimech" z 18. 7.):
   dlaždice se přizpůsobují — bílé pozadí, tmavé ikony (sada jede přes
   currentColor), jemný stín; sekční záře při najetí zůstává */
[data-theme="light"] .uni-tile{ background:#FFFFFF; color:#14151C; border:1px solid var(--border); box-shadow:0 1px 4px rgba(20,21,30,.06); }
[data-theme="light"] .uni-tile::before{ background:linear-gradient(135deg, rgba(20,21,30,.05) 0%, rgba(20,21,30,0) 42%); }
[data-theme="light"] .uni-tile__label{ color:#14151C; }
[data-theme="light"] .uni-tile:hover{ box-shadow:0 6px 18px rgba(20,21,30,.16), 0 0 14px color-mix(in srgb, var(--ak) 30%, transparent); }
/* sekcni zare - jednotna barva pro celou skupinu dlazdic (pozadavek 18. 7.).
   Prefix iks- (ikonova sekce), aby nekolidoval s .us-* v upominky.php. */
.iks-doklady{ --ak:#3079C6; } .iks-kalkulace{ --ak:var(--sekce-kalkulace, #8B5CF6); }
.iks-akce{ --ak:#E2B45C; } .iks-nebezpecne{ --ak:#E24B4A; }
@media (prefers-reduced-motion: reduce){ .uni-tile{ transition:none; } }

/* --- Ikona OBORU z nove sady na grafitovem podkladu (fronta bod 45) --
   Plnobarevne obor-ikony (icon-obor-pdr/detailing/ppf) maji bile prvky
   (currentColor) -> potrebuji tmave pozadi a svetlou barvu, jinak zblednou.
   Sladeno s dlazdicemi .adl (velin) a .uni-tile. Pouziva se vsude, kde se
   dnes kreslila ikona oboru pres ikona_svg() (rozcestnik, vykladni skrin,
   detail oboru, aktivace firme). */
.obor-graf{ display:flex; align-items:center; justify-content:center; position:relative;
  background:#151517; color:#EDEDF0; border-radius:12px; overflow:hidden; }
.obor-graf::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 42%); }
.obor-graf .ik{ position:relative; z-index:1; }
.obor-graf-16{ width:100%; aspect-ratio:16/9; border-radius:10px; }  /* banner (rozcestnik, skrin) */
.obor-graf-cip{ width:52px; height:52px; border-radius:14px; flex:0 0 auto; }  /* maly ctvercovy cip */