/* ============================================================
   ACRM design tokens — synced from Claude Design project
   "Datamart + CRM Design System" (colors_and_type.css).
   DO NOT hand-edit token values here; re-sync via /design-sync.

   Barvy: škála Geist (vercel.com/geist/colors) — kroky 200 subtle / 300 tint / 700 solid /
   800 pressed / 900 ink; lime odvozen z green (odstín 84°). Písma: Geist Sans + Geist Mono
   (vercel.com/font, npm geist@1.7.2, OFL); --font-display = Geist v řezu „Label".
   Rozhodnutí Štěpán 29. 8. 2026 nad lokálním preview.
   ============================================================ */

@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/ds/_fonts/Geist-Variable.woff2') format('woff2');
}
@font-face {
  font-family: 'Geist';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('/ds/_fonts/Geist-Italic-Variable.woff2') format('woff2');
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/ds/_fonts/GeistMono-Variable.woff2') format('woff2');
}

:root {
  /* ---------- RAW SCALE · neutrals (cool-tinted, never pure #000) ---------- */
  --ink-900: #18191b;
  --ink-800: #1f2023;
  --ink-700: #303135;
  --ink-600: #4a4b4f;
  --ink-500: #707477; /* sekundární text ≥ 4,5:1 na surface-50/75/100 (dřív #7d8184, 3,8:1; zadavatel 2. 10. 2026) */
  --ink-400: #98999c;
  --ink-300: #b8b8c0;
  --line-300: #dcdbdd;
  --line-200: #eeeff1;
  --line-100: #f4f4f5;
  --surface-100: #ffffff;
  --surface-75: #fbfbfb;
  --surface-50: #faf9fe;
  --white: #ffffff;

  /* ---------- the one functional blue ---------- */
  --blue-600: #0062d1;
  --blue-500: #0072f5;
  --blue-100: #e0f0ff;
  --blue-ink: #0068d6;
  --selected: #ebf5ff;

  /* ---------- desaturated status ---------- */
  --positive: #45a557;
  --positive-subtle: #ebfaeb;
  --positive-ink: #297a3a;
  --positive-press: #398e4a; /* border/pressed plněné zelené (.btn.save) — DS colors_and_type.css */
  --warning: #ffb224;
  --warning-subtle: #fff4d6;
  --warning-ink: #a35200;
  --critical: #e5484d;
  --critical-subtle: #ffebeb;
  --critical-ink: #cb2a2f;
  --info: #0072f5;
  --info-subtle: #ebf5ff;
  --info-ink: #0068d6;
  /* Nálada rozhovoru (DS Meeting analysis › Conversation timeline, AD FA215) — dataviz, validováno CVD +
     kontrast 30. 9. 2026. Výplně nad/pod nulou = TENTÝŽ token průhledně přes color-mix, nikdy jiný hex. */
  --sentiment-pos: #12a594;
  --sentiment-neg: #c2620a;
  /* „V doporučeném pásmu“ (Reporty › Koučink, AD 1. 10. 2026) — dataviz, sourozenec --sentiment-*; --positive
     (stav úspěchu) se nemění. Plná 3,30 : 1 na #ffffff je těsně nad mezí 3 : 1 — nedávat na tmavší podklad
     (--surface-75 aj.) bez ověření; ink 4,57 : 1 na subtle. CVD proti --ic-amber ověřeno. Test goal-in-tokens. */
  --goal-in: #16a34a;
  --goal-in-ink: #15803d;
  --goal-in-subtle: #dcfce7;

  /* ---------- soft attribute pills ---------- */
  --pill-lime-bg: #f4faeb;
  --pill-lime-ink: #5a7a29;
  --pill-amber-bg: #fff4d6;
  --pill-amber-ink: #a35200;
  --pill-blue-bg: #ebf5ff;
  --pill-blue-ink: #0068d6;
  --pill-purple-bg: #f9f1fe;
  --pill-purple-ink: #7820bc;
  --pill-green-bg: #ebfaeb;
  --pill-green-ink: #297a3a;
  --pill-rose-bg: #feecf2;
  --pill-rose-ink: #bd2864;
  --pill-grey-bg: #ebebeb;
  --pill-grey-ink: #666666;
  --accent-violet: #8e4ec6;

  /* ---------- entity icon tiles ---------- */
  --ic-blue: #0072f5;
  --ic-purple: #8e4ec6;
  --ic-green: #45a557;
  --ic-lime: #7fa545;
  --ic-mint: #34c759; /* SMS — světlejší zelená jako Zprávy na iOS (zadavatel 19. 10. 2026, ACRM-568) */
  --ic-amber: #ff990a;
  --ic-rose: #ea3e83;
  --ic-grey: #666666;

  /* ---------- bonita rating ---------- */
  --bonita-green: #16c95f;
  --bonita-green-ink: #06371b;
  --bonita-lime: #9bd60a;
  --bonita-lime-ink: #2c3a00;
  --bonita-amber: #ffc01f;
  --bonita-amber-ink: #4a3500;
  --bonita-rose: #ff5a4d;
  --bonita-rose-ink: #3d0e05;
  --bonita-grey: #6b7177;
  --bonita-grey-ink: #ffffff;

  --avatar-cyan: #12a594;

  /* ---------- comms channel brand glyph colors (flat icon, no tile — §0) ---------- */
  --channel-wa: #1d9c40; /* brand: WhatsApp */
  --channel-fb: #3a5fe0; /* brand: Messenger */
  --channel-li: #2f6fc9; /* brand: LinkedIn */
  --channel-ig: #c13584; /* brand: Instagram */

  /* ---------- SEMANTIC TOKENS — use these in components ---------- */
  --bg: var(--surface-75);
  --bg-canvas: var(--surface-100);
  --sidebar-bg: var(--surface-75);
  --shell-bg: #efeff1;
  --fg: var(--ink-900);
  --fg-secondary: var(--ink-500);
  --fg-muted: var(--ink-400);
  --fg-on-accent: var(--white);

  --border: var(--line-200);
  --border-strong: var(--line-300);
  --hover-surface: var(--surface-75); /* neutral lightest grey (AD 21. 8. 2026, was surface-50) */
  --active-surface: #eeeff1;

  --accent: var(--blue-500);
  --accent-press: var(--blue-600);
  --accent-tint: var(--blue-100);
  --accent-ink: var(--blue-ink);
  --ring: var(--blue-500);
  /* Zaostření pole: průsvitný 3px prstenec (kanonická hodnota; _critical = chybový stav). */
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
  --focus-ring-critical: 0 0 0 3px color-mix(in srgb, var(--critical) 16%, transparent);

  /* ---------- radii (rounded set) ---------- */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 11px;
  --radius-lg: 15px;
  --radius-xl: 20px;
  --radius-pill: 9999px;

  /* ---------- spacing scale (2·4·6·8·12·16·24·40) ---------- */
  --sp-0: 2px;
  --sp-1: 4px;
  --sp-2: 6px;
  --sp-3: 8px;
  --sp-4: 12px;
  --sp-5: 16px;
  --sp-6: 24px;
  --sp-7: 40px;

  /* ---------- density ---------- */
  --row-h: 37px;
  --row-h-nav: 28px;
  --cell-px: 15px;
  --cell-px-sm: 5px;
  --topbar-h: 49px;
  --sidebar-w: 261px;
  --control-h: 30px;
  /* Rozměry podle VÝZNAMU (F4, AD 27. 9. 2026) — hodnoty převzaté z kódu beze změny. */
  --control-h-sm: 24px; /* kompaktní ovládání: Button compact, IconButton sm, tlačítko v řádku */
  --field-h: 32px; /* vstupní pole, select, hledání + ovládání topbaru, které s nimi lícuje */
  --field-h-touch: 40px; /* vstupní pole na telefonu (dotyk) — DateField, vstup v kalendáři */
  --avatar-xs: 16px; /* avatar v řádku textu */
  --avatar-sm: 24px; /* výchozí avatar */
  --avatar-lg: 32px; /* velký avatar (hlavička detailu, karta člena) */
  --dot-sm: 6px; /* indikátor na ikonovém tlačítku (nepřečtené) */
  --dot: 8px; /* tečka stavu / tónu (pilulka, výpis) */
  --pill-h-sm: 20px; /* malá pilulka (.acrm-pill.sm) */
  --pill-h: 22px; /* pilulka (.acrm-pill) */
  --tile-sm: 22px; /* dlaždice přepínače (pipeline) — jiný význam než pilulka, i při stejném čísle */
  /* AD 30. 9. 2026 — dva skutečné články škály, které se opakovaly natvrdo / jako calc. */
  --tap-min: 44px; /* dotykový cíl a řádek pro dotyk (výpis, pole a ovládání na telefonu) */
  --tab-h: 46px; /* výška kanonického tabu (.acrm-tab) — jediný význam */
  --line-thick: 2px; /* silná čára: indikátor aktivní záložky, spoje */

  /* ---------- icon sizes ---------- */
  --ico-2xs: 12px;
  --ico-xs: 14px;
  --ico-sm: 16px;
  --ico-md: 18px;
  --ico-lg: 20px;
  /* Ikona stavu obrazovky (EmptyState) — jediné místo v systému, kde glyf nese plochu,
     ne řádek. Schválená varianta V2 (AD 12. 9. 2026, ACRM-228). */
  --ico-xl: 24px;
  --ico-stroke: 1.5px;

  /* ---------- elevation ---------- */
  --shadow-xs: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 3px 8px 0 rgba(0, 0, 0, 0.07);
  --shadow-md: 0 8px 24px 0 rgba(0, 0, 0, 0.1);
  --shadow-pop: 0 16px 40px -10px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.04);

  /* ---------- vrstvy (z-index) — pojmenované podle významu, hodnoty = ty skutečně použité ---------- */
  --z-sticky: 30; /* lepivé filtry / hlavičky v obsahu */
  --z-drawer: 50; /* boční šuplík appky */
  --z-fab: 58; /* plovoucí akce; pod scrimem šuplíku i dialogy */
  --z-drawer-scrim: 59; /* podklad AI panelu / šuplíku */
  --z-panel: 60; /* překryvný panel a lokální popup v obsahu */
  --z-nav-scrim: 72; /* podklad mobilní navigace */
  --z-nav: 73; /* mobilní navigace */
  --z-sheet-scrim: 74; /* podklad spodního šuplíku */
  --z-sheet: 75; /* spodní šuplík */
  --z-dock: 78; /* kompaktní dialog, dock dialogů, lišta hovoru */
  --z-dialog: 80; /* dialog + jeho scrim */
  --z-popover-scrim: 85; /* podklad popoveru */
  --z-bulkbar: 85; /* lišta hromadných akcí — nad obsahem, pod toastem */
  --z-toast: 90; /* toasty */
  --z-dialog-top: 90; /* dialog nad ostatními dialogy (globální hledání) */
  --z-picker-scrim: 100; /* podklad pickeru (datum) */
  --z-popover: 101; /* popover, menu, panel pickeru — nad dialogem */
  --z-tooltip: 120; /* tooltip */
  --z-banner: 1000; /* trvalý banner (impersonace) */
  --z-lightbox: 1000; /* celoobrazovkový náhled příloh */

  /* ---------- pohyb — délky a křivky použité v appce (pružina morfů zůstává v lib/spring.ts) ---------- */
  --dur-fast: 120ms; /* hover / press zpětná vazba, fade scrimu dialogu (RULES) */
  --dur-base: 160ms; /* rise + scale dialogu (RULES) */
  --dur-slow: 240ms; /* výsuv šuplíku / sheetu */
  --ease-sheet: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* ---------- překryvy (dříve v segment-screen.css) — jeden wash a jeden podpisový stín pro KAŽDÝ překryv ---------- */
  --overlay-shadow:
    0 24px 64px -16px rgba(16, 19, 28, 0.28), 0 8px 22px -8px rgba(16, 19, 28, 0.13),
    0 0 0 1px rgba(18, 22, 31, 0.05);
  --ov-scrim: rgba(22, 24, 30, 0.07);
  --ov-scrim-dim: rgba(20, 22, 28, 0.3);

  /* ---------- skeleton shimmer (dříve v skeleton.css) ---------- */
  --sk-base: color-mix(in srgb, var(--fg) 9%, var(--surface-100));
  --sk-hi: color-mix(in srgb, #fff 60%, transparent);

  /* ---------- layout stránky seznamu (dříve v item-list.css) ---------- */
  --il-page-max: 1080px;

  /* ---------- type families ---------- */
  --font-sans: 'Geist', ui-sans-serif, system-ui, sans-serif;
  --font-display:
    'Geist', ui-sans-serif, system-ui, sans-serif; /* řez „Label": Geist 500, tracking 0 */
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---------- type tracking ---------- */
  --tracking-tight: 0; /* Geist Label bez záporného trackingu */
  --tracking-tighter: 0;
  --tracking-eyebrow: 0.05em;

  /* ---------- SEMANTIC TYPE ---------- */
  --h1: 500 16px/1.2 var(--font-display);
  --h2: 500 15px/1.25 var(--font-display);
  --h3: 500 13px/1.35 var(--font-display);
  --kpi: 500 23px/1 var(--font-display); /* DEPRECATED — stat dlaždice = var(--h1) (Components · Stat tile) */
  --section: 600 12px/1.2 var(--font-sans);
  --label: 500 12px/22px var(--font-display);
  --p: 400 13px/1.5 var(--font-sans);
  --cell: 500 13px/22px var(--font-sans);
  --hint: 400 12px/1.45 var(--font-sans); /* nápověda pod polem — váha 400, ne 500 (AD 26. 8. 2026) */
  --small: 500 12px/1.4 var(--font-sans);
  --overline: 500 11px/1 var(--font-sans);
  --mono: 500 12px/1.4 var(--font-mono);
  --subtitle: 400 13px/1.5 var(--font-sans);
}

/* Dark mode: set data-theme="dark" on <html>. */
[data-theme='dark'] {
  --ink-900: #eceded;
  --ink-800: #e1e2e4;
  --ink-700: #cccdd1;
  --ink-600: #aeb0b5;
  --ink-500: #9a9ca1;
  --ink-400: #717479;
  --ink-300: #565a60;
  --line-300: #3a3c42;
  --line-200: #2a2c31;
  --line-100: #232529;
  --surface-100: #1b1c1f;
  --surface-75: #161719;
  --surface-50: #232529;

  --blue-600: #0062d1;
  --blue-500: #0072f5;
  --blue-100: #0f2f57;
  --blue-ink: #52a8ff;
  --selected: #10233d;

  --positive: #45a557;
  --positive-subtle: #0f2e18;
  --positive-ink: #62c073;
  --positive-press: #398e4a;
  --warning: #ffb224;
  --warning-subtle: #331b00;
  --warning-ink: #ff990a;
  --critical: #e5484d;
  --critical-subtle: #3c1618;
  --critical-ink: #ff6166;
  --info: #0072f5;
  --info-subtle: #10233d;
  --info-ink: #52a8ff;
  /* Nálada rozhovoru — dataviz, validováno CVD + kontrast 30. 9. 2026 (na --surface-100 #1b1c1f:
     pos 5,55 : 1, neg 5,31 : 1 — WCAG 2.x relativní jas, test sentiment-tokens.contract.test.ts). */
  --sentiment-pos: #12a594;
  --sentiment-neg: #d9760a;
  /* V doporučeném pásmu — tmavě 7,48 : 1 na #1b1c1f, ink 8,45 : 1 na subtle (AD 1. 10. 2026). */
  --goal-in: #22c55e;
  --goal-in-ink: #4ade80;
  --goal-in-subtle: #0f2e1b;

  /* soft attribute pills — dark translucent fills, lighter ink (re-synced from DS
     colors_and_type.css; entity --ic-* tiles + bonita stay vivid in dark by design) */
  --pill-lime-bg: #222e0f;
  --pill-lime-ink: #9bc062;
  --pill-amber-bg: #331b00;
  --pill-amber-ink: #ff990a;
  --pill-blue-bg: #10233d;
  --pill-blue-ink: #52a8ff;
  --pill-purple-bg: #2e1938;
  --pill-purple-ink: #bf7af0;
  --pill-green-bg: #0f2e18;
  --pill-green-ink: #62c073;
  --pill-rose-bg: #3a1726;
  --pill-rose-ink: #f75f8f;
  --pill-grey-bg: #1f1f1f;
  --pill-grey-ink: #a1a1a1;

  --shell-bg: #141518;
  --bg: var(--surface-75);
  --bg-canvas: var(--surface-100);
  --hover-surface: var(--surface-50);
  --active-surface: #2d2f35;
  --border: var(--line-200);
  --border-strong: var(--line-300);

  --shadow-xs: 0 0 0 1px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
  --shadow-md: 0 6px 18px 0 rgba(0, 0, 0, 0.55);
  --shadow-pop: 0 12px 34px -6px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.06);

  --overlay-shadow:
    0 28px 72px -16px rgba(0, 0, 0, 0.72), 0 8px 22px -8px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(255, 255, 255, 0.07);
  --ov-scrim: rgba(0, 0, 0, 0.48);
  --ov-scrim-dim: rgba(0, 0, 0, 0.66);
  --sk-base: color-mix(in srgb, #fff 8%, var(--surface-100));
  --sk-hi: color-mix(in srgb, #fff 7%, transparent);
}

/* ---- convenience element defaults (optional; opt-in via .ds-scope) ---- */
.ds-scope {
  color: var(--fg);
  font: var(--p);
  font-feature-settings:
    'cv05' 1,
    'cv08' 1,
    'ss01' 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-variant-numeric: tabular-nums;
}
.ds-scope h1 {
  font: var(--h1);
  letter-spacing: var(--tracking-tight);
  margin: 0;
}
.ds-scope h2 {
  font: var(--h2);
  letter-spacing: var(--tracking-tight);
  margin: 0;
}
.ds-scope h3 {
  font: var(--h3);
  letter-spacing: var(--tracking-tight);
  margin: 0;
}
.ds-scope .overline {
  font: var(--overline);
  color: var(--fg-secondary);
}
.ds-scope .data-mono {
  font: var(--mono);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}