/* dataZtacha UI – tokeny: jediný zdroj barev, písma, mezer, velikostí a stavových barev pro dataZtacha i Moje kartu.
   Kanonický zdroj: větev master, internal/web/static/ui/. V produktových větvích se soubor jen přebírá beze změny
   (pravidla docs/ui/README.md, shodu hlídá SHA256SUMS a internal/web/ui_test.go).
   Kontrast uvedených dvojic je spočten podle WCAG 2.2 (poměr k uvedenému podkladu). */
:root {
  --dz-ui-verze: "1.0.1";

  /* značka: tmavomodrá nese hlavní akci, oranžová je jen detail (linka, zvýraznění) */
  --dz-brand: #16324f;          /* bílý text na ní 13,10:1 */
  --dz-brand-hover: #0f2438;
  --dz-brand-weak: #e6ecf3;     /* --dz-brand na ní 11,01:1 */
  --dz-brand-line: #b4c5d8;
  --dz-brand-accent: #f28c28;   /* jen dekorace: proti bílé 2,45:1, nikdy text */
  --dz-on-brand: #ffffff;

  /* plochy, hranice a text */
  --dz-bg: #f3f5f6;
  --dz-surface: #ffffff;
  --dz-surface-2: #f7f9fa;
  --dz-border: #dde3e6;         /* oddělení bloků (dekorativní) */
  --dz-border-strong: #c5cfd4;  /* obrysy karet ve starších částech (dekorativní) */
  --dz-border-input: #7b8a91;   /* hranice ovládacího prvku proti bílé 3,57:1 (WCAG 1.4.11) */
  --dz-text: #1b2a31;           /* na bílé 14,77:1 */
  --dz-text-2: #475a63;         /* na bílé 7,22:1, na podkladech stavů nejméně 6,07:1 */
  --dz-text-3: #5f717a;         /* na bílé 5,09:1, na --dz-bg 4,65:1; ne na barevných podkladech stavů */
  --dz-backdrop: rgba(15, 30, 36, .28);
  --dz-shadow: 0 1px 2px rgba(20, 40, 50, .06), 0 1px 1px rgba(20, 40, 50, .04);
  --dz-shadow-l: 0 10px 30px rgba(20, 40, 50, .16);

  /* významy stavů – barva nikdy nenese význam sama, vždy s textem a symbolem */
  --dz-problem: #b42318;        /* doložený problém; na --dz-problem-bg 5,75:1, na bílé 6,57:1 */
  --dz-problem-bg: #fdeceb;
  --dz-problem-line: #f1c0bb;
  --dz-missing: #9a4a05;        /* chybějící podklad (jantarová); na --dz-missing-bg 5,67:1 */
  --dz-missing-bg: #fff2df;
  --dz-missing-line: #f3cc95;
  --dz-review: #5b3a99;         /* k posouzení (fialová); na --dz-review-bg 7,22:1 */
  --dz-review-bg: #f1ecfa;
  --dz-review-line: #d5c8ef;
  --dz-neutral: #56666e;        /* nepodporováno, nevyhodnoceno, informace; na --dz-neutral-bg 5,21:1 */
  --dz-neutral-bg: #edf0f2;
  --dz-neutral-line: #d3dadd;
  --dz-done: #1f6a47;           /* dokončený pracovní krok, ne právní soulad; na --dz-done-bg 5,74:1 */
  --dz-done-bg: #e7f3ec;
  --dz-done-line: #b9dcc7;

  /* činnosti z tachografu (grafy, legenda, volba započtení) */
  --dz-act-d: #1f5a8a;
  --dz-act-w: #8a63c2;
  --dz-act-a: #74a7c2;
  --dz-act-r: #66a676;

  /* písmo: systémová rodina, běžný text 16 px, kompaktní 14 px, vedlejší 13 px */
  --dz-font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --dz-text-base: 1rem;
  --dz-text-compact: .875rem;
  --dz-text-small: .8125rem;
  --dz-text-title: 1.25rem;
  --dz-weight-strong: 600;
  --dz-line: 1.5;

  /* mezery: základ 4 px */
  --dz-space-1: 4px;
  --dz-space-2: 8px;
  --dz-space-3: 12px;
  --dz-space-4: 16px;
  --dz-space-5: 24px;
  --dz-space-6: 32px;

  /* ovládání: standard 44 px, kompaktní 36 px (na dotykových zařízeních také 44 px) */
  --dz-control-h: 44px;
  --dz-control-h-compact: 36px;
  --dz-radius-control: 8px;
  --dz-radius-panel: 12px;
  --dz-radius-pill: 999px;
  --dz-focus: #16324f;          /* obrys fokusu 2 px, proti bílé 13,10:1 */
  --dz-focus-width: 2px;

  /* rozvržení vrstev a dialogu */
  --dz-dialog-w: 480px;
  --dz-z-dialog: 41;
}

@media (pointer: coarse) {
  :root { --dz-control-h-compact: 44px; }
}
