/* NutriFee — designové tokeny (zdroj pravdy pro vzhled; 18. 10. 2026, směr „Teplý a lidský“ s paletou podle reference vlastníka).
   Vše, co má barvu, písmo, odstup, zaoblení, stín nebo pohyb, bere hodnotu odsud. design.css tokeny jen skládá do komponent.
   Katalog komponent a pravidla: ../design-system/ . Ostrá aplikace přebírá tento soubor beze změny.
   Zásady: jedna akční barva (petrolejová) · zelená = v cíli a hotovo · oranžová = nad cílem a upozornění · červená = chyby, pokles pod 4, mimo rozsah (rozhodnutí vlastníka 18. 10. 2026) · stav nikdy jen barvou (vždy slovo + ikona) · kontrast textu ≥ 4,5:1 · cíl dotyku ≥ 48 px · text pacienta od 17 px. */

/* ---------- písmo (jedno pro vše: Plus Jakarta Sans 400–800, vlastní hostování, licence OFL 1.1 v app/fonts/; 18. 10. 2026 večer: vlastník nechce zvláštní písmo pro slabozraké) ---------- */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/plus-jakarta-sans-400-800-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/plus-jakarta-sans-400-800-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* ---------- barvy: plocha ---------- */
  --nf-bg:#F2F8F9;            /* podklad obrazovky pacienta i ordinace — velmi světlá chladná tyrkysová (reference) */
  --nf-bg-2:#E3F1F3;          /* o stupeň hlubší pro pruhy a vyznačené plochy */
  --nf-surface:#FFFFFF;       /* karta: bílá, bez okraje, jen měkký stín */
  --nf-surface-2:#F4F9FA;     /* vnořená plocha v kartě (boxy, segmentovaný přepínač) */
  --nf-card-edge:rgba(11,28,43,.05); /* téměř neviditelná hrana karty (jen aby karta nesplynula) */
  --nf-line:#E4EEF0;          /* dělicí linka uvnitř karet */
  --nf-line-strong:#C7DEE3;   /* dekorativní okraj (pruh kroků, osa, prázdné kroužky) */
  --nf-border-control:#6F8B98;/* okraj ovládacích prvků (volby, čipy, pole, voliče): 3,6:1 na bílé, 3,4:1 na podkladu — „obrys = dá se zmáčknout“ (19. 10. 2026: 3:1 i na --nf-bg) */

  /* ---------- barvy: text ---------- */
  --nf-ink:#0B1C2B;           /* titulky, čísla — hluboká modročerná (reference) */
  --nf-text:#26394A;          /* běžný text */
  --nf-muted:#536677;         /* vedlejší text; na bílé 6,0:1, na podkladech a tintech ≥ 5,0:1 */
  --nf-on-primary:#FFFFFF;

  /* ---------- barvy: akce (jediná akční barva) ---------- */
  --nf-primary:#0F6F8C;       /* tlačítka, aktivní pilulka, linky grafů — petrolejová z reference; bílý text 5,5:1 */
  --nf-primary-strong:#0A5A72;/* stisk, text akcentu, ikony */
  --nf-primary-soft:#DCF1F4;  /* kolečka ikon, sekundární tlačítka, vybraný stav */
  --nf-primary-tint:#EEF7F9;  /* nejjemnější zvýraznění karty (milník, výsledek) */

  /* ---------- barvy: stavy glukózy a bezpečí (vždy se slovem a ikonou) ---------- */
  --nf-ok:#2FA371;            /* v cíli, hotovo, splněno = svěží zelená (výplně s bílou ikonou 3,2:1; pro text --nf-ok-text) */
  --nf-ok-bg:#DFF4EA;
  --nf-ok-text:#1E7A52;       /* na bílé 5,3:1 */
  --nf-over:#EC7F4F;          /* nad cílem, upozornění, „brzy“ = korálově oranžová (není chyba); jen výplně a pruhy */
  --nf-over-bg:#FDEBE2;
  --nf-over-text:#A64923;     /* na bílé 6,0:1, na --nf-over-bg 5,1:1 */
  --nf-low:#D9453D;           /* chyby, kritická upozornění, pokles pod 4, mimo rozsah, zamítnuto = červená (výplně s bílou ikonou 4,4:1) */
  --nf-low-bg:#FCE8E6;
  --nf-low-text:#A93226;      /* na bílé 6,0:1 */
  --nf-info:#3E6B8F;          /* podobné jídlo, poznámka lékaře */
  --nf-info-bg:#E5EEF5;
  --nf-info-text:#2B4D69;
  --nf-demo:#6B5B95;          /* štítek DEMO */
  --nf-demo-bg:#EFEBF7;
  --nf-basal:#1C3344;         /* skupina bazálu v ordinaci (tmavá) */
  --nf-basal-2:#2A4659;
  --nf-basal-text:#C9DCE6;
  --nf-focus:#10212E;
  --nf-focus-on-dark:#FFFFFF;    /* fokus na petrolejové a tmavých plochách */
  --nf-primary-soft-hover:#CBE8EC;

  /* ---------- písmo ---------- */
  --nf-font-display:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,sans-serif;   /* titulky, čísla, značka (700–800) */
  --nf-font-text:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,sans-serif;      /* text, tlačítka, štítky (500, zvýraznění 700) */
  /* velikosti v rem (19. 10. 2026): písmo roste se systémovým nastavením telefonu; při výchozích 16 px = 13 · 14 · 15 · 17 · 19 · 24 · 30 · 44 px */
  --nf-fs-2xs:.8125rem;       /* jen ordinace: popisky, záhlaví tabulek, čísla v kolečkách (pacient nikdy pod 14 px) */
  --nf-fs-xs:.875rem;--nf-fs-sm:.9375rem;--nf-fs-md:1.0625rem;--nf-fs-lg:1.1875rem;--nf-fs-xl:1.5rem;--nf-fs-2xl:1.875rem;--nf-fs-num:2.75rem;--nf-fs-num-sm:2rem;
  --nf-fs-hero:1.625rem;      /* zpráva karty „Co teď“ na Dnes (26 px): jediný hrdina obrazovky */
  --nf-fs-desk:.9375rem;      /* základní velikost textu v ordinaci (desktop) */
  --nf-fs-h1-desk:clamp(1.5rem,3vw,1.875rem); /* titulek stránky v ordinaci */
  /* popisky uvnitř vysvětlujících obrázků (SVG): jednotky viewBoxu, obrázek se zvětšuje se šířkou karty */
  --nf-fs-fig-xs:10px;--nf-fs-fig-sm:11px;--nf-fs-fig:12px;--nf-fs-fig-lg:13px;--nf-fs-fig-xl:16px;--nf-fs-fig-2xl:28px;
  --nf-fig-h:96px;--nf-fig-stroke:1.75;   /* jeden rámeček ilustrací rad: výška a tah (19. 10. 2026) */
  --nf-lh:1.45;--nf-lh-tight:1.15;
  --nf-w-text:500;--nf-w-strong:700;--nf-w-display:700;--nf-w-display-strong:800;
  --nf-track-tight:-0.02em;--nf-track-caps:0.06em;

  /* ---------- rozměry ---------- */
  --nf-s1:4px;--nf-s2:8px;--nf-s3:12px;--nf-s4:16px;--nf-s5:20px;--nf-s6:24px;--nf-s8:32px;
  --nf-r-sm:10px;--nf-r-md:16px;--nf-r-lg:20px;--nf-r-pill:999px;
  --nf-tap:48px;              /* nejmenší cíl dotyku pacienta */
  --nf-tap-desk:40px;         /* nejmenší cíl kliknutí v ordinaci (myš) */
  --nf-tap-lg:56px;           /* primární akce pacienta */
  --nf-icon-sm:20px;--nf-icon:22px;--nf-icon-lg:26px;--nf-icon-circle-sm:36px;--nf-icon-circle:40px;--nf-icon-circle-lg:48px;--nf-icon-circle-xl:56px;
  --nf-phone:480px;           /* šířka sloupce pacienta */
  --nf-ctx-w:380px;           /* kontextový sloupec ordinace od 1600 px */

  /* ---------- stíny ---------- */
  /* vyvýšení tónem a tvarem, stín jen náznakem (19. 10. 2026: barevná záře pod tlačítky a mlha mezi kartami působily o generaci starší) */
  --nf-sh-card:0 1px 2px rgba(11,28,43,.04),0 4px 14px rgba(11,28,43,.05);
  --nf-sh-raised:0 14px 36px rgba(11,28,43,.10);
  --nf-sh-primary:0 1px 2px rgba(10,90,114,.24);
  --nf-sh-inset:inset 0 0 0 1px var(--nf-line);
  --nf-sh-bar:0 -6px 24px rgba(11,28,43,.06);  /* spodní lišta záložek (stín nahoru) */
  --nf-tabbar-h:72px;                       /* výška lišty záložek bez bezpečné zóny telefonu */
  --nf-scrim:rgba(11,28,43,.35);          /* ztmavení pod zásuvkou */
  --nf-shadow-ink:rgba(11,28,43,.2);      /* drobné stíny knoflíků a značek */
  --nf-phone-frame:#0B0F0E;               /* rám náhledu telefonu u sestry */
  /* fajfka (ikona Lucide „check“) pro zaškrtávátko a vybranou volbu; data URI, aby komponenta nepotřebovala obrázek */
  --nf-check-white:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --nf-check-ink:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F6F8C' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");

  /* ---------- pohyb ---------- */
  --nf-t-success:.6s;          /* okamžik potvrzení po uložení */
  --nf-t-fast:.15s;--nf-t:.25s;--nf-t-slow:.4s;--nf-ease:cubic-bezier(.2,.7,.2,1);--nf-ease-move:cubic-bezier(.4,0,.2,1);

  /* ---------- mapování starších názvů (design.css je zatím používá; nové komponenty berou --nf-*) ---------- */
  --ink:var(--nf-ink);--muted:var(--nf-muted);--brand:var(--nf-primary);--brand2:var(--nf-primary-strong);--brandbg:var(--nf-primary-soft);
  --paper:var(--nf-surface);--bg:var(--nf-bg);--line:var(--nf-line);--sand:var(--nf-primary-tint);--peach:var(--nf-over-bg);
  --ok:var(--nf-ok);--okbg:var(--nf-ok-bg);--oktx:var(--nf-ok-text);
  --warn:var(--nf-over);--warnbg:var(--nf-over-bg);--warntx:var(--nf-over-text);
  --bad:var(--nf-low);--badbg:var(--nf-low-bg);--badtx:var(--nf-low-text);
  --info:var(--nf-info);--infobg:var(--nf-info-bg);--demo:var(--nf-demo);--demobg:var(--nf-demo-bg);
  --r:var(--nf-r-lg);--sh:var(--nf-sh-card);--glass:var(--nf-surface);--glass2:var(--nf-surface-2);--edge:var(--nf-line);

  /* ---------- prezentační vrstva (demo/demo.css; 19. 10. 2026, prověrka V6) ----------
     Fialová = ovládání ukázky, nikdy stav aplikace. Do produkčního sestavení se nepromítne: tokeny čte jen demo.css. */
  --nf-demo-strong:#54467A;   /* plné tlačítko a text vrstvy; bílý text 8,4:1 */
  --nf-demo-line:#CFC6E3;     /* okraje a dělicí linky vrstvy */
  --nf-demo-surface:#F8F6FC;  /* plocha panelu vyprávění */
  --nf-demo-focus:#7B4FC4;    /* zvýraznění místa v příběhu (krok i „čeho si všímat“) */
  --nf-demo-glow:rgba(123,79,196,.30);
  --nf-demo-shadow:0 18px 50px rgba(43,24,74,.20);
  --nf-demo-stage:var(--nf-bg-2); /* podklad za rámečkem telefonu */
  --nf-demo-panel-w:380px;
  --nf-demo-phone-w:402px;--nf-demo-phone-h:874px;--nf-demo-phone-r:52px;--nf-demo-phone-edge:12px
}