/* ============================================================
   caps_shh — ДИЗАЙН-ТОКЕНИ (Хвиля 0.1 редизайну)
   Єдине джерело відступів, типо-шкали, радіусів, тіней і кольору.
   Підключається ПЕРЕД ui.css — екрани споживають лише var(--…),
   без магічних чисел. Значення затверджено на прототипі (prototype/
   redesign.html). Міграцію наявних екранів на токени роблять пізніші
   хвилі (0.3 шаблони, 4.3 решта екранів).
   ============================================================ */
:root {
  /* ── Відступи (4-крокова шкала) ───────────────────────────── */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;

  /* ── Типо-шкала ───────────────────────────────────────────── */
  --t-xs: 12px;
  --t-sm: 14px;
  --t-md: 16px;
  --t-lg: 20px;
  --t-xl: 28px;

  /* ── Таблиця ──────────────────────────────────────────────── */
  --row-h: 40px;

  /* ── Радіуси ──────────────────────────────────────────────── */
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* ── Тіні ─────────────────────────────────────────────────── */
  --shadow: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-pop: 0 8px 24px rgba(16, 24, 40, .16);

  /* ── Семантика кольору (одна на весь продукт, Хвиля 0.2) ─────
     🔴 act = «дій ЗАРАЗ» · 🟡 watch = «стеж» · 🟢 ok = «норма» ·
     info = нейтральна інформація. Колір — не для декору. */
  --act:   #e5484d;  --act-bg:   #fdebec;  --act-bd:   #f5c4c6;
  --watch: #b45309;  --watch-bg: #fff7e0;  --watch-bd: #f3dca0;
  --ok:    #18a058;  --ok-bg:    #e6f6ee;  --ok-bd:    #bfe3cd;
  --info:  #2f6fed;  --info-bg:  #eaf1fe;  --info-bd:  #c9dbfb;

  /* ── Каркас CRM (темний сайдбар · світла зона · білі картки) ─ */
  --sidebar-bg: #17181c;
  --content-bg: #f6f7f9;
  --card-bg:    #ffffff;
  --border:     #e7eaf0;
  --text:       #1d2733;
  /* --muted затемнено з #8a93a3 (WCAG AA fail ~3.1:1) до #626d7c —
     ≥4.5:1 навіть на найтемнішій світлій поверхні #f0f2f5 (аудит P1) */
  --muted:      #626d7c;

  /* ── Сайдбар: внутрішня палітра (на темному --sidebar-bg) ─── */
  --sidebar-text:   #c2c7d0;
  --sidebar-zone:   #6b7280;
  --sidebar-hover:  #24262c;
  --sidebar-active: #2b2e36;
  --sidebar-cnt-bg: #353841;

  /* ── Нейтральні поверхні / hover (аудит /normalize) ──────── */
  --surface-2: #f0f2f5;   /* badge.gray, insight.plain, межі рядків, micro */
  --surface-3: #eef0f3;   /* колонка дошки */
  --hover-bg:  #f3f4f6;   /* hover кнопки/чипа */
  --row-hover: #f8f9fb;   /* hover рядка таблиці */
  --action-bg: #fbfdff;   /* зона дії на картці */

  /* ── Hover-варіанти семантики й фокус-обведення ──────────── */
  --ok-hover:     #128a4b;
  --info-hover:   #2459c8;
  --act-bg-hover: #fbd5d7;
  --ok-bg-hover:  #d4f0e0;
  --focus-ring:   #bfd3f8;
}