/* ═══════════════════════════════════════════════════════════
   AFG — единые дизайн-токены (общие для CRM и Календаря).
   Один источник истины: подключается первым в crm.html и index.html.
   Раньше :root дублировался в crm.css и style.css и дрейфовал.
═══════════════════════════════════════════════════════════ */

:root {
  /* ── Поверхности ── */
  --bg:            #F1E8D8;   /* тёплый крем (ребренд 2026-08, из логотипа) */
  --surface:       #FFFFFF;
  --cream:         #ECE0CB;
  --header-bg:     #2A2016;   /* тёмная шапка календаря (эспрессо, ребренд 2026-08) */
  --sidebar-bg:    #2A2016;   /* тёмный сайдбар CRM (эспрессо, ребренд 2026-08) */
  --sidebar-w:     220px;

  /* ── Бренд ── */
  --primary:       #C2932F;
  --primary-hover: #A2761F;
  --primary-light: rgba(194,147,47,0.10);

  /* ── Опасность ── */
  --danger:        #c0392b;
  --danger-hover:  #a93226;

  /* ── Текст / границы ── */
  --text:          #2E2419;
  --text-muted:    #8C7B64;
  --border:        #E7DCC8;

  /* ── Семантика (свод «зоопарка» оттенков к ролям) ──
     --ok      : яркий зелёный — успех/активность/индикаторы (= --s-active)
     --ok-ink  : тёмный зелёный — текст «успех» на светлом (дельта вверх, галочки-статусы)
     --pay     : сдержанный зелёный — денежное действие (кнопка «внести оплату»)
     --info    : сине-серый — информационное действие/акцент (заметки, «добавить информацию»)
     --warn    : янтарь — предупреждение */
  --ok:            #4CAF7D;
  --ok-ink:        #2e7d4f;
  --ok-bg:         rgba(76,175,125,0.14);
  --pay:           #5C8A4E;
  --pay-hover:     #4D7641;
  --info:          #4A6A82;
  --info-hover:    #3C5568;
  --info-bg:       rgba(74,106,130,0.06);
  --warn:          #E39A2E;
  --warn-ink:      #b8860b;
  --warn-bg:       rgba(227,154,46,0.14);

  /* ── Цвета статусов клиента ── */
  --s-new:        #6B9BD2;
  --s-beginner:   #E8A838;
  --s-friend:     #B07A45;
  --s-barter:     #8B7E6E;
  --s-active:     var(--ok);
  --s-pause:      #9E9E9E;
  --s-advocate:   #C2932F;
  --s-ambassador: #A2761F;
  --s-master:     #9B59B6;

  /* ── Форма ── */
  --radius:      10px;
  --radius-xs:   4px;    /* микро: scrollbar */
  --radius-sm:   6px;    /* мелкие кнопки, степперы, теги */
  --radius-md:   8px;    /* кнопки, инпуты, view-toggle, badge-иконки */
  --radius-pill: 999px;  /* чипы, пилюли, бары */
  --radius-lg:   14px;   /* крупные мобильные карточки */
  --radius-xl:   20px;   /* мобильные bottom-sheet (скруглённый верх) */
  --shadow-sm:   0 1px 5px rgba(28,28,26,0.08);     /* лёгкая элевация (мобильные карточки) */
  --shadow:      0 2px 12px rgba(28,28,26,0.08);
  --shadow-md:   0 4px 20px rgba(28,28,26,0.12);
  --shadow-lg:   0 10px 30px rgba(28,28,26,0.18);   /* всплывающие панели/поповеры */

  /* ── Шрифты ── */
  --font-ui:      'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, serif;

  /* ── Display-шкала (заголовки Cormorant) — 5 ступеней вместо россыпи ── */
  --d-1: 18px;   /* section-title, set-card-hd */
  --d-2: 20px;   /* card-title, reftree-title */
  --d-3: 22px;   /* modal h2, placeholder, cc-stat-value, login h1 */
  --d-4: 28px;   /* page-title */
  --d-5: 32px;   /* cc-name, cc-avatar-big */

  /* ── Числовые метрики (акцентные цифры) — единая шкала ── */
  --m-sm: 28px;  /* вторичные метрики (аналитика/футер) */
  --m-md: 30px;  /* конверсия и т.п. */
  --m-lg: 36px;  /* главная цифра дашборд-плашки */
  --m-xl: 44px;  /* крупный итог («Оплаты») */

  /* ── Отступы (шаг 4px) ── */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;  --sp-4: 16px;  --sp-5: 20px;  --sp-6: 24px;

  /* ── Размеры / веса шрифта (UI) ── */
  --fs-xs: 11px;  --fs-sm: 12px;  --fs-base: 13px;  --fs-lg: 14px;
  --fw-normal: 400;  --fw-medium: 500;  --fw-semibold: 600;  --fw-bold: 700;

  /* ── Единое выделение строки при наведении (плоская заливка эталона) ── */
  --row-hover:   rgba(194,147,47,0.05);

  /* ── Графики: единая заливка баров/столбиков (лёгкий градиент = объём) ── */
  --bar-fill:  linear-gradient(180deg, #DBB25A 0%, var(--primary) 100%);
  --bar-track: var(--cream);
}