/* ============================================================
   GLOBAL RK — spoločné dizajnové tokeny (jediný zdroj pravdy)
   Načítava sa PO vlastných štýloch appky, takže prepíše jej hodnoty.
   Rieši rozpad: --ink znamenal raz text a raz tlačidlo, --r malo
   4 hodnoty, tiene 3 varianty, focus 2 farby.
   ============================================================ */
:root{
  /* --- plochy --- */
  --canvas:#EFF1F5;  --bg:#EFF1F5;            /* --bg bol alias v Preukazoch */
  --surface:#FFFFFF; --surface-2:#F7F8FA; --surface-3:#E9ECF1;
  --scrim:rgba(16,20,28,.44);

  /* --- hranice --- */
  --hairline:#E4E8EE; --line:#E4E8EE;         /* --line bol alias */
  --border:#D5DAE3;   --line-2:#D5DAE3;
  --border-strong:#B6BEC9; --border-s:#B6BEC9;

  /* --- text --- */
  --text-1:#14171D; --text-2:#3E4650; --text-3:#646E7C; --text-dis:#98A1AE;
  --ink-2:#3E4650;  --ink-3:#646E7C;

  /* --- grafit (tmavý pás, primárne tlačidlá) ---
     Jedna hodnota pre text aj povrch — rozdiel #14171D/#1D2129 bol
     opticky nulový, ale spôsoboval tri odtiene tmavého pásu. */
  --ink:#14171D; --ink-hover:#272C36; --ink-h:#272C36;
  --rail-bg:#14171D; --rail-surface:#1D212A;
  --rail-text:#E7E9EE; --rail-dim:#8A909B;
  --rail-border:rgba(255,255,255,.08); --rail-active:rgba(255,255,255,.08);

  /* --- značka: ČERVENÁ = značka + alarm, NIE bežné potvrdenie --- */
  --brand:#CF202A; --red:#CF202A;
  --brand-hover:#B81B24; --red-h:#B81B24; --brand-press:#A0161E;

  /* --- stavy (ISO 7010) --- */
  --po-fill:#CF202A; --po-ink:#A3151D; --po-tint:#FDECED; --po-border:#F3B9BD;
  --do-fill:#F2C500; --do-ink:#8A6300; --do-tint:#FEF6DC; --do-border:#F5DE8E;
  --ok-fill:#16C172; --ok-ink:#0E7A47; --ok-tint:#E6F8EF; --ok-border:#A9E6C6;
  --bez-fill:#94A0B0; --bez-ink:#5A6472; --bez-tint:#F0F2F6; --bez-border:#D3D9E2;
  --ok:#16C172; --warn:#F2C500; --warn-ink:#8A6300;

  /* --- kategórie rizika I–V (generátor) — odvodené z ISO škály --- */
  --k1:#16C172; --k1i:#0E7A47; --k1t:#E6F8EF;
  --k2:#8FC31F; --k2i:#5B7A0E; --k2t:#F0F7DF;
  --k3:#F2C500; --k3i:#8A6300; --k3t:#FEF6DC;
  --k4:#F08A24; --k4i:#9A5410; --k4t:#FDEEDD;
  --k5:#CF202A; --k5i:#A3151D; --k5t:#FDECED;

  /* --- informačná modrá: JEDNA naprieč sadou --- */
  --info:#2D6BE4; --info-ink:#17458F; --info-i:#17458F;
  --info-tint:#EAF1FE; --info-t:#EAF1FE;
  --tool-blue:#2D6BE4;

  /* --- rádiusy: jedna škála (bolo 11 hodnôt) --- */
  --r-xs:6px; --r-sm:10px; --r:14px; --r-md:14px; --r-lg:20px; --r-full:999px;

  /* --- tiene: jedna sada --- */
  --sh-xs:0 1px 2px rgba(17,24,39,.06);
  --sh:0 1px 3px rgba(17,24,39,.07),0 1px 2px -1px rgba(17,24,39,.05);
  --sh-sm:0 1px 3px rgba(17,24,39,.07),0 1px 2px -1px rgba(17,24,39,.05);
  --sh-md:0 6px 16px -6px rgba(17,24,39,.14),0 2px 6px -2px rgba(17,24,39,.07);
  --sh-lg:0 14px 30px -10px rgba(17,24,39,.18),0 4px 10px -4px rgba(17,24,39,.08);
  --sh-xl:0 32px 64px -16px rgba(17,24,39,.24),0 12px 24px -12px rgba(17,24,39,.12);
  --sh-sticky:0 1px 0 rgba(17,24,39,.06),0 8px 16px -12px rgba(17,24,39,.18);

  /* --- odstupy --- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;

  /* --- pohyb --- */
  --dur-1:130ms; --dur-2:200ms; --dur-3:280ms; --dur-4:420ms;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-std:cubic-bezier(.2,0,0,1);
  --ease-in:cubic-bezier(.4,0,1,1);

  /* --- ostatné --- */
  --focus-ring:0 0 0 3px rgba(45,107,228,.34);
  --font:'Poppins','Segoe UI',system-ui,sans-serif;
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);

  /* --- jednotné rozmery ovládacích prvkov --- */
  --h-btn:48px; --h-btn-sm:40px; --h-input:48px; --h-riadok:56px;
}

/* ---------- JEDNOTNÝ FOCUS ----------
   Bol raz modrý, raz červený, na rozcestníku chýbal úplne. */
:focus-visible{ outline:3px solid var(--info); outline-offset:2px; border-radius:var(--r-xs) }
.tool:focus-visible, .fcard:focus-visible, .tile:focus-visible, .cin:focus-visible,
.velka:focus-visible, .ukarta:focus-visible{ outline-offset:3px }
.rail-item:focus-visible, .top a:focus-visible, .top button:focus-visible,
.topacts button:focus-visible{ outline-color:#7FA8F5 }

/* ---------- JEDNOTNÉ TLAČIDLÁ ----------
   Boli 4 výšky, 4 rádiusy, 3 váhy písma.
   ČERVENÁ je alarm — primárna akcia je grafitová. */
.btn{
  min-height:var(--h-btn); border-radius:12px;
  font-weight:600; font-size:16px; border-width:1.5px;
}
.btn.sm{ min-height:var(--h-btn-sm); font-size:15px }
.btn.big{ min-height:54px; font-size:18px }
.btn.primary{ background:var(--ink); border-color:var(--ink); color:#fff }
.btn.primary:hover{ background:var(--ink-hover); border-color:var(--ink-hover) }
.btn.dark{ background:var(--ink); border-color:var(--ink); color:#fff }
/* deštruktívne a alarmové ostávajú červené */
.btn.danger, .btn.destruktiv{ background:var(--brand); border-color:var(--brand); color:#fff }
.btn.danger:hover{ background:var(--brand-hover); border-color:var(--brand-hover) }

/* ---------- JEDNOTNÉ POLIA ----------
   Boli 3 výšky (48/54/46) a 3 veľkosti labelu. */
.pole input, .pole select, .pole textarea,
.field input, .field select{
  min-height:var(--h-input); border-radius:10px; border-width:1.5px;
}
.pole label, .field label{ font-size:14px; font-weight:600; color:var(--text-2) }

/* ---------- IKONY: jedna hrúbka ťahu ---------- */
svg[stroke-width]{ stroke-width:1.9 }
.iconbtn svg, .rail-item svg{ stroke-width:1.9 }

/* ---------- BEZPEČNÁ ZÓNA (PWA na mobile) ----------
   Generátor a Velín sa schovávali pod stavový riadok. */
.top{ padding-top:max(12px, var(--safe-t)) }
.rail{ padding-top:var(--safe-t) }
.utilbar{ top:0 }

@media (prefers-reduced-motion:no-preference){
  html{ scroll-behavior:smooth }
}
