/* Дизайн-токены. Единственный файл с цветами: в остальных CSS и шаблонах — только var(--…).
   --brand, --brand-dark, --brand-ink — значения по умолчанию (бренд rpharm); на странице их переопределяет
   base.html из settings.BRAND (config/brands/<имя>.py). Всё остальное выводится из них через color-mix(). */
:root{
  --brand:#009d4f;--brand-dark:#007f40;--brand-ink:#173126;

  /* Бренд: производные от трёх цветов инсталляции */
  --brand-surface:color-mix(in srgb,var(--brand) 4%,#fff); /* фон карточек-подсказок, hero */
  --brand-light:color-mix(in srgb,var(--brand) 11%,#fff); /* активный пункт меню, мягкие кнопки */
  --brand-line:color-mix(in srgb,var(--brand) 20%,#fff); /* рамки и hover в цвет бренда */
  --brand-soft:color-mix(in srgb,var(--brand) 45%,#fff); /* фокус, точки ленты */
  --brand-text:color-mix(in srgb,var(--brand) 45%,var(--brand-ink)); /* тёмный текст в цвет бренда */
  --brand-hero-from:var(--brand);
  --brand-hero-to:color-mix(in srgb,var(--brand) 66%,#000);
  --on-brand:#fff; /* текст и иконки на бренде */
  --on-brand-muted:color-mix(in srgb,var(--brand) 20%,#fff); /* второстепенный текст на бренде */
  --on-brand-soft:color-mix(in srgb,var(--brand) 40%,#fff); /* надзаголовок на бренде */
  --focus:var(--brand-dark); /* рамка фокуса: ≥ 3:1 к белому и фону (WCAG 1.4.11); на тёмных плашках — --on-brand, app.css */

  /* Нейтральные: серые с лёгким оттенком --brand-ink, поэтому перекрашиваются вместе с брендом */
  --gray-25:color-mix(in srgb,var(--brand-ink) 2%,#fff);
  --gray-50:color-mix(in srgb,var(--brand-ink) 4%,#fff);
  --gray-75:color-mix(in srgb,var(--brand-ink) 5%,#fff);
  --gray-100:color-mix(in srgb,var(--brand-ink) 7%,#fff);
  --gray-150:color-mix(in srgb,var(--brand-ink) 11%,#fff);
  --gray-200:color-mix(in srgb,var(--brand-ink) 14%,#fff);
  --gray-250:color-mix(in srgb,var(--brand-ink) 17%,#fff);
  --gray-300:color-mix(in srgb,var(--brand-ink) 28%,#fff);
  --gray-400:color-mix(in srgb,var(--brand-ink) 43%,#fff);
  --gray-500:color-mix(in srgb,var(--brand-ink) 53%,#fff);
  --gray-600:color-mix(in srgb,var(--brand-ink) 62%,#fff);
  --gray-700:color-mix(in srgb,var(--brand-ink) 70%,#fff);
  --gray-800:color-mix(in srgb,var(--brand-ink) 76%,#fff);
  --ink:var(--brand-ink);
  --surface:#fff;
  --bg:var(--gray-50);
  --line:var(--gray-150);
  --line-soft:var(--gray-100);
  --line-strong:var(--gray-200);
  --muted:var(--gray-700);
  --muted-2:color-mix(in srgb,var(--brand-ink) 66%,#fff); /* ≥ 4.5:1 к белому (в прототипе — 62 %) */
  --photo-bg:#111;

  /* Смысловые цвета — не зависят от бренда: «Свободна» зелёная при любом бренде */
  --success:#237452;
  --success-strong:#3c9b6e;
  --success-bar:#9fd3b7;
  --success-light:#e5f3ea;
  --warning:#a96c16;
  --warning-text:#8a6519;
  --warning-strong:#e0a23c;
  --warning-bar:#e8b04f;
  --warning-line:#f0d9a8;
  --warning-light:#fff4df;
  --warning-surface:#fffaf0;
  --vip:#d5a53a;
  --vip-text:#76500c;
  --vip-light:#f8e7b9;
  --vip-surface:#fffbf1;
  --danger:#b54a41; /* ≥ 4.5:1 к --danger-light (в прототипе #b84c43) */
  --danger-text:#984b43;
  --danger-deep:#8f3d35;
  --danger-strong:#d0574c;
  --danger-bar:#d77a70;
  --danger-line:#f0c7bf;
  --on-danger-muted:#f4c7c1;
  --danger-light:#fceeea;
  --danger-surface:#fff6f3;
  --info:#47718f;
  --info-text:#2f6690;
  --info-deep:#24527a;
  --info-bar:#7ea6c4;
  --on-info-muted:#c9dcec;
  --info-line:#c9dcec;
  --info-light:#e8f1f8;
  --info-surface:#f5f9fd;

  /* Категории расходов и графики (CATS прототипа) */
  --chart-1:#5b9f84;
  --chart-2:#d77a70;
  --chart-3:#e8b04f;
  --chart-4:#7ea6c4;
  --chart-5:#b8c2bd;

  /* Тёмная тема экрана водителя (prefers-color-scheme: dark) */
  --dk-bg:color-mix(in srgb,var(--brand-ink) 55%,#000);
  --dk-surface:color-mix(in srgb,var(--brand-ink) 80%,#000);
  --dk-line:color-mix(in srgb,var(--brand-ink) 92%,#fff);
  --dk-line-strong:color-mix(in srgb,var(--brand-ink) 84%,#fff);
  --dk-ink:color-mix(in srgb,var(--brand-ink) 9%,#fff);
  --dk-ink-2:color-mix(in srgb,var(--brand-ink) 20%,#fff);
  --dk-muted:color-mix(in srgb,var(--brand-ink) 35%,#fff);
  --dk-muted-2:color-mix(in srgb,var(--brand-ink) 45%,#fff);
  --dk-brand:var(--brand);
  --dk-brand-surface:color-mix(in srgb,var(--brand) 25%,var(--dk-bg));
  --dk-brand-text:color-mix(in srgb,var(--brand) 50%,#fff);
  --dk-success-bg:#173a30;
  --dk-success-text:#8fdab5;
  --dk-success-line:#3c9b6e;
  --dk-warning-bg:#3a2e14;
  --dk-warning-text:#f3d49a;
  --dk-danger-bg:#3a1f1c;
  --dk-danger-surface:#2c1b19;
  --dk-danger-line:#5a2f2a;
  --dk-danger-text:#f3c4bd;
  --dk-info-bg:#17252f;
  --dk-info-line:#2a4254;
  --dk-info-text:#9cc6e6;

  /* Тени */
  --shadow:0 12px 35px color-mix(in srgb,var(--brand-dark) 6%,transparent);
}