/* Revízie — dizajn systém Frizbi.
   Zdieľané všetkými stránkami; tokeny sú v :root. */

:root{
  /* ── Značkové jadro ─────────────────────────────────────── */
  --fz-orange:#e45424; --fz-orange-700:#c8461b; --fz-orange-800:#a63713;
  --fz-orange-900:#8a2d0f; --fz-orange-100:#fbe6dd;
  --fz-teal:#6dbcbc; --fz-teal-700:#4f9c9c; --fz-teal-100:#e4f2f2;

  /* ── Kampaňová paleta ───────────────────────────────────── */
  --fz-sienna:#e76e50;    --fz-saffron:#f9c54e;
  --fz-olivine:#91be6f;   --fz-jellybean:#277ca0;
  --fz-sienna-100:#fceae4;  --fz-saffron-100:#fdf3dc;
  --fz-olivine-100:#eef4e7; --fz-jellybean-100:#e4eef4;
  --fz-sienna-700:#c2513a;  --fz-saffron-700:#b8862a;
  --fz-olivine-700:#6a9a45; --fz-jellybean-700:#1d5f7c;

  /* ── Teplé neutrály ─────────────────────────────────────── */
  --fz-ink:#201e1d; --fz-ink-2:#3d3a37; --fz-ink-3:#6b6764;
  --fz-ink-4:#8a8580;          /* rámy, ikony, dekorácia — NIKDY text */
  --fz-line:#c9c5c1; --fz-line-soft:#ddd9d5;
  --fz-paper:#e9e7e4; --fz-paper-2:#f4f2f0; --fz-white:#fff;

  /* ── Povrchy ────────────────────────────────────────────── */
  --surface-page:var(--fz-paper);
  --surface-card:var(--fz-white);
  --surface-sunken:var(--fz-paper-2);
  --surface-accent:var(--fz-orange-700);   /* výplň, na ktorej stojí biely text */
  --surface-accent-brand:var(--fz-orange); /* výplň bez textu — pás, 4px linky */

  /* ── Text — každá hodnota spĺňa AA 4,5:1 ────────────────── */
  --text-heading:var(--fz-ink); --text-body:var(--fz-ink-2);
  --text-muted:var(--fz-ink-3); --text-faint:var(--fz-ink-3);
  --text-accent:var(--fz-orange-700);
  --text-link:var(--fz-jellybean); --text-link-hover:var(--fz-jellybean-700);
  --border-strong:var(--fz-ink); --border-default:var(--fz-line); --border-soft:var(--fz-line-soft);

  /* ── Stavy — text stmavený na AA, -mark je jasná dekorácia ─ */
  --status-success:#537936; --status-success-bg:var(--fz-olivine-100); --status-success-mark:var(--fz-olivine);
  --status-warning:#906921; --status-warning-bg:var(--fz-saffron-100); --status-warning-mark:var(--fz-saffron);
  --status-danger:#a32d16;  --status-danger-bg:#f8e3dd;                --status-danger-mark:#a32d16;
  --status-info:#247395;    --status-info-bg:var(--fz-jellybean-100);  --status-info-mark:var(--fz-jellybean);
  --status-offline:#736e6a; --status-offline-bg:var(--fz-paper-2);     --status-offline-mark:var(--fz-ink-4);

  /* ── Dátové rady — VYHRADENÉ pre merané energetické veličiny.
     Na farebné rozlíšenie čohokoľvek iného slúži surová paleta vyššie. ── */
  --data-consumption:var(--fz-jellybean);
  --data-production:var(--fz-saffron);
  --data-export:var(--fz-olivine);
  --data-peak:var(--fz-orange);

  /* ── Typografia ─────────────────────────────────────────── */
  --font-sans:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;

  /* ── Layout a pohyb ─────────────────────────────────────── */
  --touch-min:48px; --row-min:48px; --tap-inset:12px;

  /* ── Zaoblenie ──────────────────────────────────────────────
     Manuál: mäkko zaoblené PLOCHY na tvrdej ŠTRUKTÚRE.
     Ovládacie prvky 8, plochy 10, odznaky pill, bodky kruh.
     Na nule zostáva všetko, čo je štruktúra: štvorfarebný pruh,
     4px akcentové linky, hlavičkové pásy sekcií, bunky tabuľky
     vnútri karty, metre a plochy grafov. Nikdy viac než 10 na
     karte a nikdy zaoblená akcentová linka — práve to drží
     dojem prístroja namiesto spotrebiteľskej appky. */
  /* ── Doplnené z manuálu kvôli AppBar ────────────────────── */
  --surface-inverse:var(--fz-ink); --text-inverse:var(--fz-white);
  /* Jediný mäkký tieň v appke — plávajúci ostrov hlavičky. */
  --shadow-float:0 6px 18px rgba(32,30,29,.18);
  --fw-black:800;
  --motion-hover:color var(--dur-fast) var(--ease-out),
                 background-color var(--dur-fast) var(--ease-out),
                 border-color var(--dur-fast) var(--ease-out),
                 transform var(--dur-fast) var(--ease-out);

  --radius-none:0; --radius-md:8px; --radius-lg:10px;
  --radius-pill:999px; --radius-dot:50%;
  /* Sémantické aliasy, ako ich menuje manuál */
  --radius-button:var(--radius-md); --radius-input:var(--radius-md);
  --radius-card:var(--radius-lg);
  --ease-out:cubic-bezier(.2,0,0,1); --dur-fast:120ms;
  --focus-ring:var(--fz-jellybean);
}
@media (prefers-reduced-motion:reduce){:root{--dur-fast:0ms}}

*{box-sizing:border-box;margin:0;padding:0}
/* Atribút hidden musí prebiť aj triedu, ktorá si nastavuje display.
   Pravidlo `[hidden]{display:none}` je v UA štýle prehliadača, takže
   ho ktorékoľvek autorské pravidlo prebije bez ohľadu na špecifickosť:
   `.saved{display:inline-flex}` nechal indikátor ukladania natrvalo
   svietiť ako prázdna sivá bodka vedľa stavu správy. */
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{font:400 15px/1.6 var(--font-sans);background:var(--surface-page);color:var(--text-body);min-height:100vh}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-link-hover);text-decoration:underline}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}

/* ── Štvorfarebný pás — jeden na plochu, na hornej hrane ──── */
/* 4 px v aplikačnej chrome, 6 v kartách — manuál. */
.brandbar{display:grid;grid-template-columns:repeat(4,1fr);height:4px}
.brandbar i{display:block}
.brandbar i:nth-child(1){background:var(--fz-sienna)}
.brandbar i:nth-child(2){background:var(--fz-saffron)}
.brandbar i:nth-child(3){background:var(--fz-olivine)}
.brandbar i:nth-child(4){background:var(--fz-jellybean)}

/* ── Topbar ────────────────────────────────────────────────── */
/* ── AppBar — tmavý ostrov plávajúci na ploche stránky ─────────
   Nahrádza plochý panel, ktorý tu bol predtým. Dve veci, ktoré ten
   panel miešal, sú tu oddelené: NAVIGÁCIA (chip taby, kde som) a
   AKCIA (jedno oranžové tlačidlo, čo urobím). Navigácia nikdy nie je
   orámované tlačidlo — orámovanie robí zo všetkých položiek rovnako
   dôležité a rovnako klikateľné. */
header.appbar{background:var(--surface-page);padding:14px}
.appbar-island{
  background:var(--surface-inverse);color:var(--text-inverse);
  border-radius:var(--radius-card);box-shadow:var(--shadow-float);
  display:flex;align-items:center;flex-wrap:wrap;gap:14px;
  padding:10px 12px 10px 16px;min-height:60px;
}

/* Vľavo identita: logo · deliaca čiara · modul a jeho tyrkysový podtitul */
.appbar-identity{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.appbar-identity .logo{display:inline-flex;align-items:center;min-height:var(--touch-min)}
.appbar-identity .logo img{height:22px;display:block}
.appbar-identity .divider{width:1px;height:30px;background:rgba(255,255,255,.22)}
.appbar-identity .app{line-height:1.15;color:var(--fz-white)}
.appbar-identity .app b{display:block;font:var(--fw-bold,700) 14px/1.2 var(--font-sans)}
.appbar-identity .app small{
  display:block;font:var(--fw-bold,700) 9.5px/1.3 var(--font-sans);
  letter-spacing:1.6px;text-transform:uppercase;color:var(--fz-teal);
}

/* Chip taby. Aktívny je tyrkysová výplň s tmavým textom. */
.appbar-tabs{display:flex;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none}
.appbar-tabs::-webkit-scrollbar{display:none}
.chip{
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  min-height:40px;padding:10px 14px;border:0;border-radius:var(--radius-pill);
  font:600 13px/1 var(--font-sans);
  background:transparent;color:rgba(255,255,255,.68);
  transition:var(--motion-hover);
}
.chip:hover{background:rgba(255,255,255,.10);color:var(--fz-white);text-decoration:none}
.chip .ti{font-size:16px}
.chip.je-aktivny{
  background:var(--fz-teal);color:var(--fz-ink);font-weight:700;
}
.chip.je-aktivny:hover{background:var(--fz-teal);color:var(--fz-ink)}

.appbar-spacer{flex:1;min-width:0}

/* Jediná akcia v hlavičke — oranžová, pill.
   Selektor musí byť špecifickejší než samotné .btn, ktoré je v súbore
   nižšie a s rovnakou špecifickosťou by ho prebilo na 8 px. */
.btn.appbar-action{
  border-radius:var(--radius-pill);min-height:40px;padding:0 16px;
  font:600 13px/1 var(--font-sans);
}

/* Vpravo človek: meno, mono tyrkysová rola, oranžový avatar, odhlásenie */
/* margin-left:auto drží človeka vpravo aj vtedy, keď sa ostrov zalomí do
   dvoch riadkov — samotná medzera (.appbar-spacer) zostane na prvom riadku
   a avatar by inak spadol doľava. */
.appbar-user{display:flex;align-items:center;gap:10px;flex:0 0 auto;margin-left:auto}
.appbar-user .nm{text-align:right;line-height:1.2;color:var(--fz-white)}
.appbar-user .nm b{display:block;font:700 12.5px/1.2 var(--font-sans)}
.appbar-user .nm small{display:block;font:400 10.5px/1.3 var(--font-mono);color:var(--fz-teal)}
.appbar-user .avatar{
  width:36px;height:36px;flex:0 0 auto;border-radius:var(--radius-dot);
  background:var(--surface-accent-brand,var(--fz-orange));color:var(--fz-white);
  display:flex;align-items:center;justify-content:center;
  font:var(--fw-black,800) 12px/1 var(--font-sans);letter-spacing:.02em;
  transition:var(--motion-hover);
}
.appbar-user .avatar:hover{background:var(--fz-orange-700);text-decoration:none}
.appbar-user .lo{
  width:40px;height:40px;flex:0 0 auto;border:0;background:transparent;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;font-size:18px;
  border-radius:var(--radius-md);color:rgba(255,255,255,.72);
  transition:var(--motion-hover);
}
.appbar-user .lo:hover{background:rgba(255,255,255,.12);color:var(--fz-white)}

/* Pod 1120 px meno a rola miznú, avatar zostáva. */
@media (max-width:1120px){
  .appbar-user .nm{display:none}
}
/* ── Riadok „pole + tlačidlo + vysvetlenie" ──────────────────
   Na širokej obrazovke vedľa seba, na telefóne pod sebou. Predtým to bol
   inline flex s wrap a na 375 px sa rozsypal — pole aj tlačidlo skončili
   pritlačené k pravému okraju a text pod nimi. */
.form.riadok-pole{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.form.riadok-pole .field{margin:0;max-width:160px;flex:0 0 auto}
.form.riadok-pole .fine{margin:0 0 10px;flex:1 1 240px;min-width:0}

@media (max-width:720px){
  .form.riadok-pole{flex-direction:column;align-items:stretch;gap:14px}
  .form.riadok-pole .field{max-width:none}
  .form.riadok-pole .btn{width:100%;justify-content:center}
  .form.riadok-pole .fine{margin:0}
}

/* ── Spodná lišta na telefóne ────────────────────────────────
   Manuál: na telefóne sa taby z hlavičky presunú dole, hlavička sa zmrští
   na 56 px a nechá si logo a jednu akciu. Tri chip taby sa do 375 px
   širokej lišty nezmestia — posledný sa odrezával.
   Lišta je fixná, preto main dole dostane odsadenie, aby posledný riadok
   tabuľky nezostal pod ňou. */
.tabbar{display:none}

@media (max-width:720px){
  /* Hlavička: logo, modul, jedna akcia, avatar. Taby idú dole. */
  .appbar-island{min-height:56px;padding:8px 10px 8px 14px;gap:10px}
  .appbar-tabs{display:none}
  .appbar-identity{gap:10px}
  .appbar-identity .logo img{height:20px}
  .btn.appbar-action{min-height:40px;padding:0 14px;font-size:12.5px}
  .btn.appbar-action .ti{font-size:16px}
  /* Odhlásenie je na telefóne v profile (avatar naň vedie) — hlavička má
     podľa manuálu niesť len logo, modul a jednu akciu. */
  .appbar-user form{display:none}
  /* Podtitul modulu ubere výšku, ktorú na 375 px potrebujeme inde. */
  .appbar-identity .app small{display:none}
  /* „Import z merača" sa na 375 px do jedného riadku nezmestí — ostane
     „Import", zvyšok povie ikona. Celá lišta tak drží jeden riadok
     a avatar sa nezalomí pod ňu. */
  .len-siroko{display:none}

  .tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;
    background:var(--surface-inverse);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -6px 18px rgba(32,30,29,.18);
  }
  .tabbar-polozka{
    flex:1;min-width:0;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:3px;
    height:64px;padding:0 4px;
    font:600 10.5px/1.2 var(--font-sans);
    color:rgba(255,255,255,.68);text-align:center;
    transition:var(--motion-hover);
  }
  .tabbar-polozka span{
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
  }
  .tabbar-polozka .ti{font-size:21px}
  .tabbar-polozka:hover{color:var(--fz-white);text-decoration:none}
  /* Aktívny je tyrkysový — tá istá reč ako chip tab v lište. */
  .tabbar-polozka.je-aktivny{color:var(--fz-teal)}
  .tabbar-polozka.je-aktivny .ti{color:var(--fz-teal)}

  /* Miesto pre lištu, nech pod ňou nič nezostane. */
  main{padding-bottom:calc(64px + env(safe-area-inset-bottom) + 24px)}
}

/* ── Omrvinky ───────────────────────────────────────────────
   Pás pod hlavičkou. Ostrov AppBar už pláva na ploche stránky, takže
   omrvinky nesmú byť nalepené naň — 2px linka zdola ich oddeľuje od
   obsahu rovnako, ako to bolo predtým. */
nav.crumb{
  background:var(--surface-card);border-bottom:2px solid var(--border-strong);
  padding:12px 24px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font:500 13px/1.5 var(--font-sans);
}
nav.crumb .sep{color:var(--text-muted)}
nav.crumb h1{display:inline;font:700 13px/1.5 var(--font-sans);color:var(--text-heading)}

/* Odsek vnútri upozornenia — posledný bez spodného okraja, aby sa
   nezdvojoval s vnútorným odsadením karty. */
.alert p{margin:0 0 12px}
.alert p:last-child{margin-bottom:0}

/* Malý podnadpis nad skupinou polí („Klient", „Objekt"). */
p.podnadpis{margin:0 0 8px;font-weight:600}

/* ── Telo karty ─────────────────────────────────────────────
   24 px je gutter karty podľa manuálu, 16 px odstup poľa od poľa.
   Predtým to bolo 112-krát inline a odstupy sa rozišli na 12/16/18/20 —
   presne to je drift, ktorému má design systém brániť. */
.karta-telo{padding:24px}
.karta-telo.stlpec{display:flex;flex-direction:column;gap:16px}
.karta-telo.uzky{padding:20px 24px}

/* Úvodná veta karty — vysvetlí, načo tá karta je. */
p.uvod{margin:0 0 14px;color:var(--text-muted)}

main{max-width:1200px;margin:0 auto;padding:24px;display:flex;flex-direction:column;gap:24px}

/* ── Sekcia = hlavička + obsah, medzi nimi 10 px ───────────── */
.sec{display:flex;flex-direction:column;gap:10px}

/* ── Hlavička sekcie — tónovaný pás, vetný nadpis, bez spodnej linky ── */
.sechead{
  display:flex;align-items:center;gap:14px;padding:12px 16px;
  border-left:4px solid var(--sh-rule,var(--fz-ink));
  background:var(--sh-bg,var(--surface-sunken));
}
.sechead .ti{font-size:22px;color:var(--sh-rule,var(--fz-ink));flex:0 0 auto}
.sechead h2{
  font:700 20px/1.25 var(--font-sans);letter-spacing:-.2px;color:var(--text-heading);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}
.sechead .sh-count{
  font:700 13px/1 var(--font-mono);font-variant-numeric:tabular-nums;
  background:var(--surface-card);color:var(--text-heading);
  border:1px solid var(--border-default);padding:5px 8px;flex:0 0 auto;
}
.sh-neutral  {--sh-bg:var(--fz-paper-2);       --sh-rule:var(--fz-ink)}
.sh-jellybean{--sh-bg:var(--fz-jellybean-100); --sh-rule:var(--fz-jellybean)}
.sh-sienna   {--sh-bg:var(--fz-sienna-100);    --sh-rule:var(--fz-sienna)}
.sh-saffron  {--sh-bg:var(--fz-saffron-100);   --sh-rule:var(--fz-saffron-700)}
.sh-olivine  {--sh-bg:var(--fz-olivine-100);   --sh-rule:var(--fz-olivine-700)}
.sh-teal     {--sh-bg:var(--fz-teal-100);      --sh-rule:var(--fz-teal-700)}
.sh-orange   {--sh-bg:var(--fz-orange-100);    --sh-rule:var(--surface-accent-brand)}

/* ── Tabuľka — pokojná: 1px rám, svetlé deliace linky, 56px riadky ── */
.tbl{
  border:1px solid var(--border-default);background:var(--surface-card);
  border-radius:var(--radius-card);
  /* Bunky vnútri karty zostávajú hranaté — orezanie drží zaoblenie karty
     bez toho, aby sa muselo zaobľovať čokoľvek vnútri. */
  overflow:hidden;
}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl table{width:100%;min-width:520px;border-collapse:collapse}
.tbl thead tr{background:var(--surface-sunken)}
.tbl th{
  text-align:left;padding:10px 16px;height:44px;
  border-bottom:1px solid var(--border-default);
  font:600 12px/1.4 var(--font-sans);color:var(--text-body);white-space:nowrap;
}
.tbl th + th,.tbl td + td{border-left:1px solid var(--border-soft)}
.tbl th.num,.tbl td.num{text-align:right}
.tbl td{
  padding:0 16px;vertical-align:middle;
  font:400 14px/1.45 var(--font-sans);color:var(--text-body);white-space:nowrap;
}
.tbl td.wrap{white-space:normal}
.tbl td strong{font-weight:600;color:var(--text-heading)}
.tbl td.num,.tbl td.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.tbl td.muted{color:var(--text-muted)}
.tbl tbody tr{height:56px;border-bottom:1px solid var(--border-soft)}
.tbl tbody tr:last-child{border-bottom:none}
.tbl tbody tr[data-href]{cursor:pointer;transition:background var(--dur-fast) var(--ease-out)}
.tbl tbody tr[data-href]:hover{background:var(--surface-sunken)}
.tbl td.chev{width:48px;padding:0;text-align:center;color:var(--fz-line)}
.tbl tbody tr:hover td.chev{color:var(--text-heading)}
.tbl td.chev .ti{font-size:18px;vertical-align:middle}
.mono{font:500 13px/1.5 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-body)}

/* Kľúč – hodnota: prvý stĺpec je popis, riadok sa neklikáva */
.kv td:first-child{width:200px;color:var(--text-muted)}
.kv tbody tr{height:48px}

/* ── Badge ─────────────────────────────────────────────────── */
.badge{
  display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:var(--radius-pill);
  font:700 11px/1.35 var(--font-sans);letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap;
}
.badge-sentence{font:600 13px/1.35 var(--font-sans);letter-spacing:0;text-transform:none}
.badge .dot{width:7px;height:7px;border-radius:var(--radius-dot);background:var(--bd-mark,currentColor);flex:0 0 auto}
.badge-success{background:var(--status-success-bg);color:var(--status-success);--bd-mark:var(--status-success-mark)}
.badge-danger {background:var(--status-danger-bg); color:var(--status-danger); --bd-mark:var(--status-danger-mark)}
.badge-warning{background:var(--status-warning-bg);color:var(--status-warning);--bd-mark:var(--status-warning-mark)}
.badge-info   {background:var(--status-info-bg);   color:var(--status-info);   --bd-mark:var(--status-info-mark)}
.badge-offline{background:var(--status-offline-bg);color:var(--status-offline);--bd-mark:var(--status-offline-mark)}

/* ── Stat — holý odpočet so 4px linkou, v jednej spoločnej ploche ── */
.stat-row{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:28px;
  background:var(--surface-card);border:1px solid var(--border-default);padding:20px;
}
.stat{display:flex;flex-direction:column;gap:8px;border-left:4px solid var(--accent,var(--fz-ink));padding-left:14px}
.stat .lbl{font:700 11px/1.45 var(--font-sans);letter-spacing:2px;text-transform:uppercase;color:var(--text-muted)}
.stat .val{font:700 32px/1.05 var(--font-mono);letter-spacing:-.5px;font-variant-numeric:tabular-nums;color:var(--text-heading)}
.stat .val .unit{font:500 14px/1 var(--font-mono);color:var(--text-muted);margin-left:6px}

/* ── Karta — 2px inkoustový rám, pre samostatné textové bloky ── */
.card{background:var(--surface-card);border:2px solid var(--border-strong);padding:20px}
.card p{font:400 15px/1.6 var(--font-sans);color:var(--text-body)}

/* ── Prázdny stav ──────────────────────────────────────────── */
.empty{
  border-radius:var(--radius-card);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:52px 24px;text-align:center;background:var(--surface-card);
}
.empty .ti{font-size:34px;color:var(--fz-ink-4)}
.empty .t{font:700 18px/1.3 var(--font-sans);letter-spacing:-.2px;color:var(--text-heading)}
.empty p{max-width:42ch;font:400 14px/1.6 var(--font-sans);color:var(--text-muted)}

/* ── Kontakt ───────────────────────────────────────────────── */
.contact{
  display:flex;flex-wrap:wrap;gap:32px;padding:20px;
  background:var(--surface-card);border:1px solid var(--border-default);
}
.contact .item{display:flex;gap:12px;align-items:flex-start;min-width:200px}
.contact .ti{font-size:20px;color:var(--fz-ink-4);margin-top:2px}
.contact .k{font:700 11px/1.45 var(--font-sans);letter-spacing:2px;text-transform:uppercase;color:var(--text-muted)}
.contact .v{font:500 15px/1.5 var(--font-sans);color:var(--text-heading);margin-top:3px}

/* ── Kalkulácia ────────────────────────────────────────────── */
.tbl tbody tr.kal-section{height:auto;cursor:default}
.kal-section td{
  background:var(--surface-sunken);border-left:0;
  font:700 12px/1.4 var(--font-sans);color:var(--text-heading);padding:10px 16px;
}
/* Číselné polia V TABUĽKE (počty v kalkulácii) — mono, zarovnané doprava,
   ako každá meraná hodnota. Selektor musí mieriť na `table`, nie na celú
   kartu: bez toho chytal aj bežné formulárové polia vnútri .tbl — rok
   uvedenia do prevádzky vychádzal 88 px široký a zarovnaný doprava. */
.tbl table input[type=number],.kal-line input[type=number]{
  width:88px;padding:8px 10px;border:1px solid var(--fz-ink-4);border-radius:var(--radius-input);
  background:var(--surface-card);color:var(--text-heading);
  font:500 13px/1.5 var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;
  min-height:40px;transition:border-color var(--dur-fast) var(--ease-out);
}
.kal-line input[type=number]{width:70px}
.tbl table input[type=number]:hover,.kal-line input[type=number]:hover{border-color:var(--fz-ink-3)}
.tbl table input[type=number]:focus,.kal-line input[type=number]:focus{
  outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--fz-ink);
}
.kal-foot{border-top:1px solid var(--border-default);background:var(--surface-sunken);padding:16px}
/* Polia priamo v riadku tabuľky — cenník v profile, šablóny technika.
   Bez vlastného štýlu ich prehliadač kreslil v predvolenej šírke a dlhší
   názov položky („Kontrola rozvádzača do 10 prístrojov") sa odsekol. */
table.polia input[type=text]{
  width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--fz-ink-4);
  border-radius:var(--radius-input);background:var(--surface-card);color:var(--text-heading);
  font:400 14px/1.5 var(--font-sans);transition:border-color var(--dur-fast) var(--ease-out);
}
table.polia input.cena{
  width:110px;font:500 13px/1.5 var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;
}
table.polia th.num,table.polia td.num{width:150px}
/* Väzba skúšky na merania v Šablónach (migrácia 028). */
table.polia select.vazba{
  width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--fz-ink-4);
  border-radius:var(--radius-input);background:var(--surface-card);color:var(--text-heading);
  font:400 14px/1.5 var(--font-sans);
}
table.polia input[type=text]:hover{border-color:var(--fz-ink-3)}
table.polia input[type=text]:focus{outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--fz-ink)}
/* Šablóny: posun riadku, odstránenie a stĺpce sekcie v medzinadpise. */
table.polia .posun{display:flex;gap:6px}
table.polia label.odstranit{display:flex;align-items:center;gap:8px;min-height:var(--touch-min);
  font:500 13px/1.4 var(--font-sans);color:var(--text-body);cursor:pointer;white-space:nowrap}
.kal-section .sablona-stlpce{font-weight:400;color:var(--text-muted)}
/* Prvé tlačidlo formulára je to, ktoré odošle Enter v textovom poli. Šablóny
   majú v riadkoch tlačidlá posunu — bez tohto by Enter posunul prvú položku. */
.predvolene-odoslanie{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);border:0;white-space:nowrap}
.kal-line{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:6px 0}
.kal-line .k{font:500 14px/1.5 var(--font-sans);color:var(--text-muted);display:flex;align-items:center;gap:8px}
.kal-line .v{font:700 15px/1.5 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-heading)}
.kal-total{
  display:flex;justify-content:space-between;align-items:baseline;gap:24px;
  margin-top:12px;padding-top:14px;border-top:2px solid var(--border-strong);
}
.kal-total .k{font:700 11px/1.45 var(--font-sans);letter-spacing:2px;text-transform:uppercase;color:var(--text-heading)}
.kal-total .v{font:700 32px/1.05 var(--font-mono);letter-spacing:-.5px;font-variant-numeric:tabular-nums;color:var(--text-heading)}

@media (max-width:720px){
  header{padding:0 16px;gap:12px}
  header .app small{display:none}
  nav.crumb{padding:10px 16px}
  /* Omrvinky sú na telefóne hlavná cesta späť, ale text má 20 px.
     Odsadenie zväčší cieľ palca na 44 px a záporný margin vráti
     riadok tam, kde bol — lišta sa nezvýši, len sa dá trafiť. */
  nav.crumb a{padding-block:var(--tap-inset);margin-block:calc(-1 * var(--tap-inset))}
  main{padding:16px;gap:20px}
  .sechead{padding:10px 14px;gap:10px;align-items:flex-start}
  /* Na telefóne sa nadpis zalomí, neodseká — technik musí vedieť, ktorú
     časť prehliadky vypĺňa („A — Ochrana pred priamym dotyk…" nestačí). */
  .sechead h2{font-size:17px;white-space:normal;overflow:visible;text-overflow:clip}
  .stat-row{gap:20px;padding:16px}
  .contact{gap:20px;padding:16px}
  /* Riadok tabuľky je dotykový cieľ z výšky 56 px; polia treba dotiahnuť na 48 px */
  .tbl table input[type=number],.kal-line input[type=number]{min-height:48px;padding:12px 10px}
  table.polia input[type=text]{min-height:48px;padding:12px 10px}
}

/* ── Import z merača ────────────────────────────────────────── */


.upload{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.drop{
  border-radius:var(--radius-card);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  width:100%;padding:34px 20px;cursor:pointer;
  background:var(--surface-sunken);border:2px dashed var(--border-default);
  transition:border-color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out);
}
.drop:hover{border-color:var(--fz-ink-3);background:var(--fz-white)}
.drop:focus-within{outline:2px solid var(--focus-ring);outline-offset:2px}
.drop .ti{font-size:32px;color:var(--fz-ink-4)}
.drop .t{font:600 15px/1.4 var(--font-sans);color:var(--text-heading)}
.drop .s{font:400 13px/1.5 var(--font-sans);color:var(--text-muted)}
.drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

.picked{
  font:500 13px/1.5 var(--font-mono);color:var(--text-heading);
  background:var(--fz-jellybean-100);border:1px solid var(--fz-jellybean);
  padding:8px 12px;
}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  min-height:var(--touch-min);padding:0 20px;border:0;border-radius:var(--radius-button);
  background:var(--surface-accent);color:var(--fz-white);
  font:600 15px/1 var(--font-sans);cursor:pointer;
  transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out);
}
.btn:hover{background:var(--fz-orange-800)}
.btn:active{background:var(--fz-orange-900);transform:translate(1px,1px)}
.btn .ti{font-size:18px}

.log{
  font:500 12px/1.6 var(--font-mono);color:var(--text-body);
  white-space:pre-wrap;word-break:break-word;max-height:340px;overflow:auto;
}
.alert{background:var(--surface-card);border:1px solid var(--border-default);
  border-left:4px solid var(--edge,var(--fz-ink));padding:16px 18px}
.alert-danger{--edge:var(--status-danger)}

.help{background:var(--surface-sunken);border:1px solid var(--border-soft);padding:14px 16px}
.help summary{font:600 14px/1.5 var(--font-sans);color:var(--text-heading);cursor:pointer}
.help summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.help ol{margin:12px 0 0 20px;display:flex;flex-direction:column;gap:7px}
.help li{font:400 14px/1.55 var(--font-sans);color:var(--text-body)}

/* ── Formuláre ──────────────────────────────────────────────── */
main.narrow{max-width:560px}
.form{display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:600 13px/1.4 var(--font-sans);color:var(--text-heading)}
.field .hint{font:400 12px/1.5 var(--font-sans);color:var(--text-muted)}
.field input[type=text],.field input[type=email],.field input[type=password],
.field input[type=date],.field input[type=number],.field select,.field textarea{
  min-height:var(--touch-min);padding:10px 12px;border-radius:var(--radius-input);
  border:1px solid var(--fz-ink-4);background:var(--surface-card);color:var(--text-heading);
  font:400 15px/1.5 var(--font-sans);width:100%;
  transition:border-color var(--dur-fast) var(--ease-out);
}
.field textarea{min-height:110px;resize:vertical;line-height:1.6}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--fz-ink-3)}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--fz-ink);
}
.field.invalid input,.field.invalid select{border-color:var(--status-danger)}
.field .err{font:500 12px/1.5 var(--font-sans);color:var(--status-danger)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.fine{font:400 13px/1.6 var(--font-sans);color:var(--text-muted);max-width:60ch}

.btn-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* Na telefone sa akcie stavajú na celú šírku. Nie je to kozmetika:
   tlačidlá v „Stav správy" sedia v samostatných <form>, takže sa aj
   tak zalomia každé na vlastný riadok — a keď sú pritom rôzne široké,
   palec musí mieriť. Riadok so stavom ostáva v riadku, nemá .btn. */
@media (max-width:720px){
  .btn-row{flex-direction:column;align-items:stretch}
  .btn-row > form{display:flex;flex-direction:column;gap:10px}
  .btn-row .btn{width:100%;justify-content:center}
  .btn-row:has(> .saved){flex-direction:row;align-items:center}
}
.btn.secondary{background:var(--surface-card);color:var(--text-heading);
  border:1px solid var(--fz-ink-4)}
.btn.secondary:hover{background:var(--surface-sunken);border-color:var(--fz-ink-3)}
.btn.secondary:active{background:var(--fz-paper)}

/* Inverzný variant — biela pill s tmavým textom, na tmavý podklad.
   Vznikol pre akciu v lište podľa kolegovho pravidla „oranžová patrí obsahu,
   nie chrome". Robert sa nakoniec rozhodol, že „Import z merača" bude
   oranžové (viď CLAUDE.md, sekcia o hlavičke), takže sa tu zatiaľ nepoužíva
   — necháva sa pre tmavú pätku a hero bloky, kde ho manuál tiež predpokladá. */
.btn.inverse{background:var(--fz-white);color:var(--fz-ink)}
.btn.inverse:hover{background:rgba(255,255,255,.86)}
.btn.inverse:active{background:rgba(255,255,255,.74);transform:translate(1px,1px)}

.alert-info{--edge:var(--status-info)}
.alert-success{--edge:var(--status-success)}
.alert-warning{--edge:var(--status-warning)}

/* ── Kto je prihlásený ──────────────────────────────────────── */


/* ── Obvody pod chráničom ──────────────────────────────────── */
/* Zoznam na odškrtnutie pri skúške chrániča. Celý riadok je cieľ palca,
   nie 16px políčko — technik to robí v teréne pri otvorenom rozvádzači. */
.pod-zoznam{display:flex;flex-direction:column;border:1px solid var(--border-soft);
  border-radius:var(--radius-md);overflow:hidden;margin-top:6px}
.pod-riadok{display:flex;align-items:center;gap:12px;min-height:var(--touch-min);
  padding:0 14px;border-top:1px solid var(--border-soft);cursor:pointer}
.pod-riadok:first-child{border-top:0}
.pod-riadok:has(input:checked){background:var(--fz-olivine-100)}
.pod-riadok input{width:18px;height:18px;flex:none}
.pod-riadok .mono{min-width:48px;font-weight:600}

/* ── Riadky stromu v tabuľke obvodov ───────────────────────── */
tr.strom-rcd td,tr.strom-main td,tr.strom-board td{background:var(--surface-sunken)}
.strom-pod{color:var(--text-muted);font-size:12px}

/* ── Termín ďalšej revízie ──────────────────────────────────── */
/* Farba, nie odznak: je to dátum, nie stav. Odznak by v stĺpci plnom
   dátumov kričal viac, než si zaslúži. */
.termin-po{color:var(--status-danger);font-weight:600}
.termin-blizko{color:var(--status-warning);font-weight:600}

/* ── Autosave indikátor ─────────────────────────────────────── */
.saved{
  display:inline-flex;align-items:center;gap:7px;
  font:500 12px/1 var(--font-sans);color:var(--text-muted);
  min-height:24px;transition:color var(--dur-fast) var(--ease-out);
}
.saved .dot{width:7px;height:7px;border-radius:var(--radius-dot);background:var(--fz-line)}
.saved.ok{color:var(--status-success)} .saved.ok .dot{background:var(--status-success-mark)}
.saved.busy{color:var(--text-muted)}   .saved.busy .dot{background:var(--fz-saffron)}
.saved.err{color:var(--status-danger)} .saved.err .dot{background:var(--status-danger-mark)}


/* Riadok prehliadky, ktorý ešte nie je na serveri. Jantárová hrana vľavo —
   technik vidí, čo mu ešte visí, bez toho aby čítal text. */
tr.neulozene > td:first-child{box-shadow:inset 3px 0 0 var(--fz-saffron)}

/* Ponúknutá časť pospájania, ktorú technik ešte nevyplnil. Tlmená, aby bolo
   na prvý pohľad vidieť, čo je zapísané a čo je len návrh. */
tr.ponuka > td { background: var(--surface-sunken, transparent); }
tr.ponuka input[type=text], tr.ponuka select { opacity: .72; }
tr.ponuka:focus-within > td { background: transparent; }
tr.ponuka:focus-within input[type=text], tr.ponuka:focus-within select { opacity: 1; }

/* Medzinadpis miestnosti v zozname meraných bodov. Technik chodí po dome
   po miestnostiach, nie po abecede bodov. */
td.miestnost{
  background:var(--surface-sunken,var(--fz-paper-2));
  font:600 12px/1 var(--font-sans);letter-spacing:.04em;text-transform:uppercase;
  color:var(--text-muted);padding-top:10px;padding-bottom:10px;
}
td.miestnost .ti{font-size:14px;vertical-align:-2px;margin-right:6px}

/* ── Presun meraní (presun.php) ─────────────────────────────── */
.presun-uvod{padding:16px 24px 4px;margin:0}
table.presun td{padding-top:8px;padding-bottom:8px}
table.presun .merania{display:flex;flex-wrap:wrap;gap:8px}
/* Meranie je kartička, ktorá sa dá chytiť myšou; zaškrtávacie pole v nej
   je cesta pre telefón a klávesnicu. Celá kartička je dotykový cieľ. */
table.presun label.meranie{
  display:inline-flex;align-items:center;gap:8px;min-height:var(--touch-min);
  padding:6px 12px;border:1px solid var(--border-default);border-radius:var(--radius-pill);
  background:var(--surface-card);cursor:grab;user-select:none;
  font:500 13px/1.3 var(--font-sans);color:var(--text-body);
}
table.presun label.meranie:hover{border-color:var(--fz-ink-3)}
table.presun label.meranie:has(input:checked){border-color:var(--fz-ink);background:var(--surface-sunken)}
table.presun label.meranie .cas{color:var(--text-muted);font-size:12px}
table.presun label.meranie.tahane{opacity:.5}
table.presun tr.nad td{background:var(--status-info-bg);outline:2px dashed var(--focus-ring);outline-offset:-2px}
table.presun td.akcia{width:1%}
table.presun .bez{font-size:13px}
.presun-lista{
  position:sticky;bottom:0;z-index:2;margin-top:10px;
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;
  border:1px solid var(--border-default);border-radius:var(--radius-card);background:var(--surface-card);
}
.presun-lista label{font:600 13px/1.4 var(--font-sans);color:var(--text-heading)}
.presun-lista select{
  min-height:var(--touch-min);padding:10px 12px;border-radius:var(--radius-input);
  border:1px solid var(--fz-ink-4);background:var(--surface-card);color:var(--text-heading);
  font:400 15px/1.5 var(--font-sans);min-width:220px;max-width:100%;
}
ol.kroky{margin:12px 0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.oprava-vysledok{display:flex;flex-direction:column;gap:12px;margin-top:16px}

/* Oddeľovač vnútri karty. Predtým to bol inline štýl s tokenom
   --border-subtle, ktorý neexistuje — čiara bola neviditeľná. */
hr.oddelovac{border:0;border-top:1px solid var(--border-soft);margin:22px 0}

/* Tlačidlo akcie v riadku tabuľky. Vizuálne je úzke, ale dotykový cieľ má
   celých 48 px — manuál to meria na klikateľnej ploche, nie na ikone. */
.btn.riadkova{
  min-height:var(--touch-min);
  padding:0 var(--tap-inset);
}

/* ── Sken predchádzajúcej správy (sken.php) ─────────────────── */
/* Priebeh je meradlo — hranatý, ako každý merač v manuáli. */
.sken-priebeh{height:8px;background:var(--surface-sunken);margin:4px 0 12px}
.sken-priebeh span{display:block;height:100%;background:var(--fz-jellybean)}
.sken-stitok{padding:16px 24px 4px;margin:0;max-width:none}
table.sken-polozky td{padding-top:8px;padding-bottom:8px;vertical-align:top}
/* Popis drží šírku; tabuľka sa radšej posunie, než by sa zalomil po slovách. */
table.sken-polozky td.wrap{min-width:240px}
/* Položka s údajom, ktorý v prepise strany nestojí — pozrieť sken. */
table.sken-polozky tr.sken-pozor td{background:var(--status-warning-bg)}
.sken-problem{margin-top:4px;font:500 12.5px/1.45 var(--font-sans);color:var(--status-warning)}
.sken-problem .ti{font-size:14px;vertical-align:-2px}
/* Výber prevzatej predchádzajúcej správy (predchadzajuca.php) — pill tag. */
.sken-tag{
  display:inline-flex;align-items:center;min-height:var(--touch-min);padding:0 16px;
  border:1px solid var(--border-default);border-radius:var(--radius-pill);background:var(--surface-card);
  font:500 13px/1.3 var(--font-sans);color:var(--text-body);
}
.sken-tag:hover{text-decoration:none;border-color:var(--fz-teal-700)}
.sken-tag.je-vybrany{background:var(--fz-teal-100);border-color:var(--fz-teal-700);color:var(--text-heading);font-weight:600}
/* Priradenie bodov bez JavaScriptu — odkaz na roletky s celým zoznamom. */
.priradenie-bez-js{padding:12px 24px 0;margin:0;max-width:none}
/* Import z merača cez USB (upload.php) — výber klientov. */
.usb-uvod{padding:16px 24px 4px;margin:0;max-width:none}
table.usb-klienti th.vyber,table.usb-klienti td.vyber{width:48px;text-align:center}
table.usb-klienti input[type=checkbox]{width:20px;height:20px;accent-color:var(--fz-jellybean);cursor:pointer}
table.usb-klienti tbody tr{cursor:pointer}
table.usb-klienti label{display:block;cursor:pointer}
table.usb-klienti .subor{display:block;font:400 12px/1.4 var(--font-mono);color:var(--text-muted)}
/* Spotrebiče z PAT-96 — pri každej zložke výber klienta a objektu v aplikácii. */
.pat-chyba{margin:16px 24px 0}
table.pat-klienti td.pat-kam{min-width:280px;cursor:default}
table.pat-klienti td.pat-kam select,table.pat-klienti td.pat-kam input[type=text]{
  display:block;width:100%;min-height:44px;padding:8px 10px;border-radius:var(--radius-input);
  border:1px solid var(--fz-ink-4);background:var(--surface-card);color:var(--text-heading);
  font:400 14px/1.4 var(--font-sans);
}
table.pat-klienti td.pat-kam input[type=text]{margin-top:6px}
table.pat-klienti td.pat-kam select:focus,table.pat-klienti td.pat-kam input[type=text]:focus{
  outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--fz-ink);
}
table.pat-klienti tr.pat-prazdna{cursor:default;color:var(--text-muted)}
table.pat-klienti tr.pat-prazdna input[type=checkbox]{cursor:not-allowed}
table.pat-klienti td.pat-kam input.pat-novy[hidden]{display:none}
/* Merania spotrebiča (spotrebic.php) — nevyhovujúci bod vizuálnej kontroly. */
table.spotrebic-merania td{vertical-align:top}
.spotrebic-zle{font-weight:700;color:var(--status-danger)}
/* Znalostná databáza (znalosti.php) a doplnenie medze pri meraní (spotrebic.php). */
.znalosti-filtre{display:flex;flex-wrap:wrap;gap:8px}
.znalosti-filtre .znalosti-otazky{border-color:var(--status-warning-mark);font-weight:600}
.znalosti-pravidla{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px;max-width:75ch}
.znalosti-vzor{margin-top:12px;padding:12px 16px;border-left:4px solid var(--fz-teal);background:var(--surface-sunken)}
.znalosti-vzor dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:8px 0 0}
.znalosti-vzor dt{font-weight:600;color:var(--text-heading)}
.znalosti-vzor dd{margin:0}
table.znalosti-zoznam tbody tr{cursor:pointer}
table.znalosti-zoznam td.znalost-stav{min-width:150px}
table.znalosti-zoznam td.znalost-stav .badge{margin:0 4px 4px 0}
table.znalosti-zoznam tr.znalost-vyradena td{color:var(--text-muted)}
/* Katalóg FV modulov (moduly.php) — názov modulu nesmie stlačiť číselné stĺpce na šírku slova. */
table.moduly-zoznam tbody tr{cursor:pointer}
table.moduly-zoznam td.wrap:first-child{min-width:240px}
table.moduly-zoznam .fine{margin:2px 0 0;white-space:nowrap}
table.moduly-zoznam td.wrap .fine{white-space:normal}
fieldset.znalost-cast,fieldset.sablona-texty{border:1px solid var(--border-soft);border-radius:var(--radius-card);padding:12px 16px 16px;margin:0;
  display:flex;flex-direction:column;gap:12px;min-width:0}
fieldset.znalost-cast legend,fieldset.sablona-texty legend{font:600 13px/1.4 var(--font-sans);color:var(--text-heading);padding:0 6px}
fieldset.znalost-cast[hidden],.field .hint[hidden]{display:none}
.znalosti-udaje{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2px 16px}
.field-label{font:600 13px/1.4 var(--font-sans);color:var(--text-heading)}
label.volba{display:flex;align-items:center;gap:10px;min-height:40px;font:400 14px/1.4 var(--font-sans);
  color:var(--text-body);cursor:pointer}
label.volba input{width:18px;height:18px;accent-color:var(--fz-jellybean);flex:none}
.medza-riadok{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.medza-riadok select,.medza-riadok input{
  min-height:44px;padding:8px 10px;border-radius:var(--radius-input);border:1px solid var(--fz-ink-4);
  background:var(--surface-card);color:var(--text-heading);font:400 15px/1.4 var(--font-sans)}
/* Užšie než bežné pole formulára (.field input má 100 %) — riadok „≥ … ≤ …" a „od – do". */
.field .medza-riadok input{width:9em}
.field .medza-riadok select{width:auto}
.znalost-zmazat{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px;padding-top:16px;
  border-top:1px solid var(--border-soft)}

/* Šablóny objektov (migrácia 021) — nálezy údajov klienta v šablóne. */
.alert ul.sablona-nalezy{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:2px}

/* Technické parametre FV systému (partials/fve.php) — výkon poľa sa
   prepočítava pri písaní; súčet stojí pod stringami ako v kalkulácii. */
.fve-blok{display:flex;flex-direction:column;gap:16px}
table.fve-stringy input{width:100%}
.fve-suma{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;padding:12px 16px;
  border-left:4px solid var(--fz-saffron);background:var(--surface-sunken)}
.fve-suma .k{font:600 13px/1.4 var(--font-sans);color:var(--text-heading)}
.fve-suma .v{font:700 20px/1.2 var(--font-mono);color:var(--text-heading)}
.fve-suma .fine{margin:0}

/* Lehota podľa prílohy č. 8 vyhl. 508/2009 — karta objektu a návrh v správe. */
.lehota-form{display:flex;flex-direction:column;gap:14px}
fieldset.lehota-vplyvy{border:1px solid var(--border-soft);border-radius:var(--radius-card);padding:12px 16px 14px;
  margin:0;display:flex;flex-direction:column;gap:4px;min-width:0}
fieldset.lehota-vplyvy legend{font:600 13px/1.4 var(--font-sans);color:var(--text-heading);padding:0 6px}
/* Vnútri .tbl: tamojšie th/td majú nowrap, výšku a zvislé deliace čiary — tu sa kódy majú zalamovať. */
.tbl table.lehota-triedy{border-collapse:collapse;width:100%;min-width:0;margin-top:6px}
.tbl table.lehota-triedy tbody tr{height:auto;border:0}
.tbl table.lehota-triedy th,.tbl table.lehota-triedy td{border:0;border-top:1px solid var(--border-soft);
  vertical-align:top;height:auto;background:none}
.tbl table.lehota-triedy th{font:500 13px/1.35 var(--font-sans);color:var(--text-body);text-align:left;
  text-transform:none;letter-spacing:0;padding:12px 14px 8px 0;white-space:normal;width:13rem}
.tbl table.lehota-triedy td{padding:4px 0;white-space:normal}
/* Na telefóne názov riadku nad kódmi — vedľa nich by kódom ostal pás na jeden. */
@media (max-width:720px){
  .tbl table.lehota-triedy,.tbl table.lehota-triedy tbody,.tbl table.lehota-triedy tr,
  .tbl table.lehota-triedy th,.tbl table.lehota-triedy td{display:block;width:auto}
  .tbl table.lehota-triedy th{padding:10px 0 2px}
  .tbl table.lehota-triedy td{border-top:0;padding:0 0 6px}
}
label.trieda{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:2px 12px;margin:2px 6px 2px 0;
  border:1px solid var(--fz-line);border-radius:var(--radius-pill);font:500 13px/1 var(--font-mono);
  color:var(--text-heading);cursor:pointer}
label.trieda small{font:400 11.5px/1 var(--font-sans);color:var(--text-muted)}
label.trieda input{width:16px;height:16px;margin:0;accent-color:var(--fz-jellybean)}
label.trieda:has(input:checked){background:var(--fz-jellybean-100);border-color:var(--fz-jellybean)}
.lehota-navrh,.posudok-navrh,.fve-modul-navrh,.skuska-navrh{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;margin-top:12px;padding:10px 14px;
  border-left:4px solid var(--fz-jellybean);background:var(--surface-sunken);
  font:400 13.5px/1.45 var(--font-sans);color:var(--text-body)}
.lehota-navrh > span,.posudok-navrh > span,.fve-modul-navrh > span,.skuska-navrh > span{flex:1 1 320px;min-width:0}
.lehota-navrh .btn,.posudok-navrh .btn,.fve-modul-navrh .btn,.skuska-navrh .btn{flex:none}
/* Návrh posudku stojí pod roletkou, nie pod nadpisom sekcie. */
.posudok-navrh{margin:0 0 4px}
/* Modul z merača stojí pod poľami modulu; odstup dáva blok parametrov. */
.fve-modul-navrh{margin:0}


/* Fotky a videá pri závade, položke prehliadky a k správe (migrácia 025). */
.media-riadok{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;margin-top:8px}
.media-zoznam{display:flex;flex-wrap:wrap;gap:8px}
.media-zoznam:empty{display:none}
figure.media-mini{position:relative;width:104px;margin:0;display:flex;flex-direction:column;gap:3px;white-space:normal}
figure.media-mini > a{position:relative;display:flex;align-items:center;justify-content:center;width:104px;height:78px;
  border:1px solid var(--border-default);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-sunken);
  color:var(--text-muted);font-size:28px;text-decoration:none}
figure.media-mini img{width:100%;height:100%;object-fit:cover;display:block}
figure.media-mini .media-play{position:absolute;inset:auto auto 6px 6px;display:flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;background:rgba(32,30,29,.72);color:#fff;font-size:15px}
figure.media-mini figcaption{display:flex;flex-direction:column;font:400 11.5px/1.3 var(--font-sans);
  color:var(--text-body);white-space:normal;overflow-wrap:anywhere}
figure.media-mini figcaption .popis{color:var(--text-heading)}
figure.media-mini figcaption .muted{color:var(--text-muted)}
.media-akcie{position:absolute;top:4px;right:4px;display:flex;gap:4px}
.media-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;
  border-radius:50%;background:rgba(255,255,255,.92);color:var(--fz-ink);font-size:15px;cursor:pointer;
  box-shadow:0 0 0 1px var(--border-default)}
.media-btn:hover{background:#fff;color:var(--status-danger)}
.media-pridat{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:48px;min-height:48px;
  padding:0 12px;border:1px dashed var(--fz-ink-4);border-radius:var(--radius-md);background:transparent;
  color:var(--text-body);font:500 13px var(--font-sans);cursor:pointer}
.media-pridat .ti{font-size:20px}
.media-pridat:hover{border-color:var(--fz-jellybean);color:var(--fz-jellybean)}
.media-pridat.velke{min-height:78px;padding:0 18px}
.media-nahrava{display:flex;flex-direction:column;justify-content:center;gap:6px;width:104px;height:78px;padding:8px;
  border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-sunken)}
.media-pruh{display:block;height:4px;background:var(--fz-line-soft)}
.media-pruh i{display:block;height:100%;width:0;background:var(--fz-jellybean);transition:width .2s}
.media-stav{font:500 11.5px/1.3 var(--font-sans);color:var(--text-body);overflow-wrap:anywhere}
figure.media-mini.chyba .media-nahrava{border-color:var(--status-danger);height:auto;min-height:78px}
figure.media-mini.chyba .media-stav{color:var(--status-danger)}

/* ── Odborná skúška (skuska.php, migrácia 028) ─────────────────
   Skúška je karta v zozname, nie riadok tabuľky: nesie rozsah z meraní,
   návrh, výsledok, poznámku a pri nevyhovení zistenie — v tabuľke by sa
   to na telefóne nezmestilo. */
.skuska-uvod{padding:16px 24px 4px;margin:0;max-width:none}
ol.skusky{list-style:none;margin:0;padding:0}
.skuska-bod{display:flex;flex-direction:column;gap:10px;padding:18px 24px;border-top:1px solid var(--border-soft)}
.skuska-bod:first-child{border-top:0}
/* Skúška, ktorá ešte nie je na serveri — jantárová hrana ako pri prehliadke. */
.skuska-bod.neulozene{box-shadow:inset 3px 0 0 var(--fz-saffron)}
.skuska-hlava{display:flex;align-items:baseline;gap:4px 12px;flex-wrap:wrap}
.skuska-hlava .c{font:600 13px/1.4 var(--font-mono);color:var(--text-muted);min-width:26px}
.skuska-hlava strong{flex:1 1 200px;min-width:0;font:600 15px/1.45 var(--font-sans);color:var(--text-heading)}
.skuska-povod{font:500 12px/1.4 var(--font-mono);color:var(--text-muted);white-space:nowrap}
.skuska-merania{padding:8px 12px;border-left:4px solid var(--fz-olivine);background:var(--surface-sunken);
  font:400 13.5px/1.5 var(--font-sans);color:var(--text-body)}
.skuska-merania .k{font-weight:600;color:var(--text-heading);margin-right:4px}
.skuska-navrh{margin:0}
.skuska-dovod,.skuska-chyba{margin:0;max-width:none}
ul.skuska-chyba{padding-left:18px}
.skuska-polia{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:12px 16px}
.skuska-polia .field textarea{min-height:64px}
@media (max-width:720px){.skuska-polia{grid-template-columns:1fr}}
.skuska-zistenie{display:flex;flex-direction:column;gap:10px;padding:12px 14px;
  border-left:4px solid var(--status-danger-mark);background:var(--status-danger-bg)}
.skuska-zistenie .btn{align-self:flex-start}
.skuska-zistenie .fine{margin:0}
.skuska-nove{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.skuska-nove select{min-height:var(--touch-min);padding:10px 12px;border-radius:var(--radius-input);
  border:1px solid var(--fz-ink-4);background:var(--surface-card);color:var(--text-heading);
  font:400 15px/1.5 var(--font-sans);max-width:100%}

/* ── Doklady výrobkov v PDF (migrácia 030) ─────────────────────
   Katalóg meničov a modulov: zoznam dokladov s akciami v riadku. V správe
   výber dokladov po výrobkoch — riadok má názov a pod ním pôvod, ako ho
   uvedie tlač. */
table.doklady-zoznam td{padding-top:10px;padding-bottom:10px;vertical-align:top}
table.doklady-zoznam td.wrap:first-child{min-width:240px}
table.doklady-zoznam .fine{margin:2px 0 0}
table.doklady-zoznam tr.je-vybrany td{background:var(--fz-jellybean-100)}
table.doklady-zoznam td.akcie{white-space:nowrap;width:1%}
table.doklady-zoznam td.akcie form{display:inline}
.doklady-skupina > .badge{align-self:flex-start}
label.volba.doklad-volba{align-items:flex-start;min-height:44px}
label.volba.doklad-volba input{margin-top:2px}
label.volba.doklad-volba > span{display:flex;flex-direction:column;gap:2px;min-width:0}
label.volba.doklad-volba .fine{margin:0;overflow-wrap:anywhere}
ol.doklady-sprava{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px}
ol.doklady-sprava .fine{display:block;margin:2px 0 0}

/* ── Kontrola so znalosťami (kontrola.php, migrácia 031) ──────
   Nález je karta ako skúška: názov, záznamy, z ktorých vychádza, čo AI
   v údajoch videla, a pri náleze návrh zistenia s výberom kódu. Vybavený
   nález ustúpi do pozadia, nevybavený nesie jantárovú hranu. */
ol.nalezy{list-style:none;margin:0;padding:0}
.nalez{display:flex;flex-direction:column;gap:10px;padding:18px 24px;border-top:1px solid var(--border-soft);
  box-shadow:inset 3px 0 0 var(--fz-saffron)}
.nalez:first-child{border-top:0}
.nalez.je-vybaveny{box-shadow:none}
.nalez.je-vybaveny > p,.nalez.je-vybaveny .nalez-hlava strong{color:var(--text-muted)}
.nalez-hlava{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap}
.nalez-hlava strong{flex:1 1 240px;min-width:0;font:600 15px/1.45 var(--font-sans);color:var(--text-heading)}
.nalez > p{margin:0;max-width:80ch;font:400 14px/1.55 var(--font-sans);color:var(--text-body)}
.nalez .k{font-weight:600;color:var(--text-heading);margin-right:6px}
.nalez-zaznamy{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.nalez-zaznamy .fine{margin:0}
.nalez-varovanie{display:flex;flex-direction:column;gap:4px;padding:8px 12px;border-left:4px solid var(--status-warning-mark);
  background:var(--status-warning-bg);font:400 13.5px/1.5 var(--font-sans);color:var(--text-body)}
.nalez-zavada{display:flex;flex-direction:column;gap:8px;padding:12px 14px;
  border-left:4px solid var(--status-danger-mark);background:var(--status-danger-bg);font:400 14px/1.5 var(--font-sans)}
.nalez-akcie{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.nalez-akcie .fine{margin:0}
.nalez-vybavene{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0;font:500 14px/1.5 var(--font-sans);color:var(--status-success)}
.kontrola-beh{display:flex;gap:14px;align-items:flex-start}
.kontrola-beh .ti{font-size:26px;color:var(--fz-teal-700);animation:kontrola-tocenie 1.2s linear infinite}
@keyframes kontrola-tocenie{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.kontrola-beh .ti{animation:none}}
.kontrola-spotreba{margin:-6px 0 14px}
ul.kontrola-posudene{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
ul.kontrola-posudene li{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
ul.kontrola-posudene .fine{flex:1 1 100%;margin:0;max-width:80ch}
pre.kontrola-text{margin:10px 0 0;max-height:480px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;
  font:400 12.5px/1.5 var(--font-mono);color:var(--text-body)}
.kontrola-riadok{display:flex;gap:8px 12px;align-items:center;flex-wrap:wrap}
.kontrola-riadok form{display:inline}
.kontrola-riadok .fine{margin:0;max-width:70ch}
/* Tlačidlo, ktoré práve nemá čo urobiť (kontrola beží). */
.btn:disabled{opacity:.5;cursor:not-allowed}
.kontrola-uvod{max-width:78ch;margin:0}
.help .kontrola-uvod{margin-top:10px}