/* ============================================================
   DESIGN TOKENS — все магические числа только здесь
   Меняй здесь — меняется везде
   ============================================================ */

:root {

  /* ----------------------------------------------------------
     ЦВЕТА — базовая палитра
     ---------------------------------------------------------- */

  /* Фон */
  --color-bg-base:        #13141b;   /* основной фон страницы */
  --color-bg-surface:     #191921;   /* карточки, панели */
  --color-bg-elevated:    #1e1e28;   /* дропдауны, попапы поверх surface */
  --color-bg-overlay:     #24242f;   /* hover-строки, выделение */
  --color-bg-sidebar:     #0f0f18;   /* сайдбар */
  --color-bg-header:      #141420;   /* шапка страницы */

  /* Акцент — зелёно-циановый (хакерский) */
  --color-accent:         #00ff9d;   /* основной акцент */
  --color-accent-dim:     #00cc7a;   /* акцент приглушённый */
  --color-accent-muted:   #00ff9d22; /* акцент-фон (полупрозрачный) */
  --color-accent-glow:    0 0 8px #00ff9d66; /* box-shadow свечение */

  /* Вторичный акцент — циановый */
  --color-secondary:      #00d4ff;
  --color-secondary-dim:  #00aacc;
  --color-secondary-muted:#00d4ff18;

  /* Текст */
  --color-text-primary:   #f2ede8;   /* основной текст */
  --color-text-secondary: #b8b0a8;   /* второстепенный */
  --color-text-muted:     #8a8078;   /* плейсхолдеры, disabled */
  --color-text-accent:    #00ff9d;   /* акцентный текст */
  --color-text-inverse:   #13141b;   /* текст на акцентном фоне */

  /* Границы */
  --color-border:         #28283c;   /* базовая граница */
  --color-border-subtle:  #1e1e2e;   /* едва заметная */
  --color-border-accent:  #00ff9d44; /* акцентная */
  --color-border-focus:   #00ff9d;   /* фокус-кольцо */

  /* Статусы */
  --color-success:        #00ff9d;
  --color-success-muted:  #00ff9d22;
  --color-success-row-bg: #00ff9d0d;  /* едва заметная заливка строки */
  --color-warning:        #ffcc00;
  --color-warning-muted:  #ffcc0018;
  --color-warning-row-bg: #ffcc000d;  /* едва заметная заливка строки */
  --color-danger:         #ff4455;
  --color-danger-muted:   #ff445518;
  --color-info:           #00d4ff;
  --color-info-muted:     #00d4ff18;
  --color-purple:         #a87aff;
  --color-purple-muted:   #a87aff18;

  /* Офисы-регионы — фиксированные цвета, НЕ переопределяются в [data-theme="light"],
     чтобы Урал/Питер/Сибирь выглядели одинаково в любой теме (см. reports/charts.js) */
  --color-region-ural:      #14b8a6;   /* морская волна */
  --color-region-ural-dim:  #0f9488;
  --color-region-piter:     #3b82f6;   /* синий */
  --color-region-piter-dim: #2563eb;
  --color-region-sibir:     #ef4444;   /* красный */
  --color-region-sibir-dim: #dc2626;

  /* Воронка по новым клиентам — фиксированный коралловый, НЕ переопределяется
     в [data-theme="light"], одинаковый в любой теме (см. reports/charts.js) */
  --color-funnel:       #ff6f61;
  --color-funnel-dim:   #d95e52;
  --color-funnel-muted: #ff6f6122;

  /* Блок «Успешные сделки» дашборда (донат «Этого месяца/Старые» + bar-чарты по
     категориям) — фиксированная палитра тёмной схемы, НЕ переопределяется
     в [data-theme="light"], одинаковая в любой теме (см. reports/charts.js) */
  --color-dash-green:  #00ff9d;
  --color-dash-green-dim: #00cc7a;
  --color-dash-cyan:   #00d4ff;
  --color-dash-cyan-dim: #00aacc;
  --color-dash-orange: #ff9d2e; /* не жёлтый — жёлтый сливался с тёмным фоном */
  --color-dash-purple: #a87aff;

  /* График «Лиды с источников» (directories/charts.js) — та же фиксированная тёмная
     палитра, НЕ переопределяется в [data-theme="light"] (см. комментарий выше про группу) */
  --color-dash-orange-pale: #ffc98c; /* бледно-оранжевый — «Всего лидов» */
  --color-dash-yellow:      #f0d000; /* жёлтый — «Потенциально целевые» (контрастнее чистого жёлтого на тёмном фоне) */

  /* Нейтральные */
  --color-neutral-100:    #13141b;
  --color-neutral-200:    #191921;
  --color-neutral-300:    #24242f;
  --color-neutral-400:    #2e2e42;
  --color-neutral-500:    #404060;
  --color-neutral-600:    #606088;
  --color-neutral-700:    #a0a0c0;
  --color-neutral-800:    #cec8c2;
  --color-neutral-900:    #f2ede8;

  /* ----------------------------------------------------------
     ТИПОГРАФИКА
     ---------------------------------------------------------- */

  --font-mono:    'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Courier New', monospace;
  --font-sans:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-base:    var(--font-mono); /* весь UI на моноширинном — хакерский стиль */

  --text-xs:      11px;
  --text-sm:      12px;
  --text-base:    13px;
  --text-md:      14px;
  --text-lg:      16px;
  --text-xl:      18px;
  --text-2xl:     22px;

  --font-normal:  400;
  --font-medium:  500;
  --font-semibold:600;

  --leading-tight:  1.2;
  --leading-normal: 1.5;

  /* ----------------------------------------------------------
     ОТСТУПЫ
     ---------------------------------------------------------- */

  --space-1:   2px;
  --space-2:   4px;
  --space-3:   6px;
  --space-4:   8px;
  --space-5:   12px;
  --space-6:   16px;
  --space-7:   20px;
  --space-8:   24px;
  --space-9:   32px;
  --space-10:  40px;
  --space-11:  48px;
  --space-12:  64px;

  /* ----------------------------------------------------------
     РАДИУСЫ
     ---------------------------------------------------------- */

  --radius-sm:   3px;
  --radius-md:   5px;
  --radius-lg:   8px;
  --radius-xl:   12px;
  --radius-full: 9999px;

  /* ----------------------------------------------------------
     РАЗМЕРЫ LAYOUT
     ---------------------------------------------------------- */

  --sidebar-wide:    220px;
  --sidebar-narrow:  48px;
  --header-height:   112px;   /* высота липкой шапки страницы leads */
  --table-head-h:    36px;    /* высота шапки таблицы */

  /* ----------------------------------------------------------
     ПЕРЕХОДЫ / АНИМАЦИИ
     ---------------------------------------------------------- */

  --transition-fast:   0.12s ease;
  --transition-base:   0.2s ease;
  --transition-slow:   0.35s cubic-bezier(0.4, 0, 0.2, 1);

  /* ----------------------------------------------------------
     ТЕНИ / СВЕЧЕНИЕ
     ---------------------------------------------------------- */

  --shadow-sm:      0 1px 3px #00000066;
  --shadow-md:      0 4px 12px #00000088;
  --shadow-lg:      0 8px 24px #000000aa;
  --shadow-accent:  var(--color-accent-glow);
  --shadow-inset:   inset 0 1px 0 #ffffff08;
  --shadow-header:  0 2px 12px #00000066;

  /* ----------------------------------------------------------
     ДОПОЛНИТЕЛЬНЫЕ ТОКЕНЫ (переопределяются в темах)
     ---------------------------------------------------------- */

  --progress-track-bg:    rgba(255, 255, 255, 0.12); /* трек неактивного сегмента прогресса */
  --card-glow:            0 0 24px #00ff9d14;        /* свечение WIP/ошибка карточки */
  --dropdown-extra-glow:  0 0 24px #00ff9d08;        /* свечение дропдауна */
  --chart-line-filter:    drop-shadow(0 0 3px #00ff9d66); /* свечение линии графика */
  --color-scheme:         dark;                       /* цветовая схема браузерных контролов */

  /* ----------------------------------------------------------
     АЛИАСЫ (короткие имена → семантические токены)
     ---------------------------------------------------------- */

  --accent:        var(--color-accent);
  --secondary:     var(--color-secondary);
  --bg-base:       var(--color-bg-base);
  --bg-card:       var(--color-bg-surface);
  --bg-input:      var(--color-bg-base);
  --text-primary:  var(--color-text-primary);
  --text-muted:    var(--color-text-muted);
  --border:        var(--color-border);
  --border-subtle: var(--color-border-subtle);

  /* ----------------------------------------------------------
     Z-INDEX СЛОИ
     ---------------------------------------------------------- */

  --z-sidebar:    100;
  --z-header:     200;
  --z-sticky-th:  190;   /* шапка таблицы — ниже header, но выше строк */
  --z-dropdown:   300;
  --z-modal:      400;
  --z-tooltip:    500;
}

/* ============================================================
   СВЕТЛАЯ ТЕМА — нежные тёплые оттенки рассветного неба
   Вдохновение: персиковый горизонт, лавандовый небосвод,
   первые лучи солнца, утренняя свежесть
   ============================================================ */

[data-theme="light"] {

  /* Фон — слои рассвета: от тумана к горизонту */
  --color-bg-base:        #fdf3ea;   /* тёплый крем — утренний туман */
  --color-bg-surface:     #fef8f1;   /* тонкий облачный слой — карточки */
  --color-bg-elevated:    #f8e8d5;   /* персиковый — дропдауны, попапы */
  --color-bg-overlay:     #f0d9c4;   /* hover-строки — чуть глубже персика */
  --color-bg-sidebar:     #ece0d5;   /* сайдбар — тёплый беж-терракота */
  --color-bg-header:      #fdf5ec;   /* шапка страниц */

  /* Акцент — коралловое солнце у горизонта (кнопки, ссылки, активные эл-ты) */
  --color-accent:         #c8582a;   /* тёплый коралловый — первый луч */
  --color-accent-dim:     #a84018;   /* hover — чуть глубже */
  --color-accent-muted:   #c8582a1c; /* фон-подсветка */
  --color-accent-glow:    0 0 12px #c8582a50; /* коралловое свечение */

  /* Вторичный — лавандово-фиолетовый, предрассветное небо */
  --color-secondary:      #7858c0;   /* нежный лавандовый */
  --color-secondary-dim:  #6040a0;   /* глубже */
  --color-secondary-muted:#7858c018;

  /* Текст — тёплые земляные тона */
  --color-text-primary:   #241408;   /* тёмный шоколадно-коричневый */
  --color-text-secondary: #6a3c20;   /* тёплый каштановый */
  --color-text-muted:     #a07868;   /* тёплый дымчато-розовый */
  --color-text-accent:    #c8582a;   /* коралловый акцент */
  --color-text-inverse:   #fdf3ea;   /* крем — текст на тёмном/акцентном фоне */

  /* Границы — тёплые персиково-бежевые */
  --color-border:         #e4baa0;   /* тёплый персиковый */
  --color-border-subtle:  #edd5c0;   /* едва заметная */
  --color-border-accent:  #c8582a40; /* акцентная */
  --color-border-focus:   #7858c0;   /* ЛАВАНДОВЫЙ — визуально отличает инпуты от кнопок */

  /* Статусы — рассветные тона (у каждого свой оттенок) */
  --color-success:        #488848;   /* травяной зелёный — утренняя свежесть */
  --color-success-muted:  #48884818;
  --color-success-row-bg: #4888480a;  /* едва заметная заливка строки */
  --color-warning:        #b87c18;   /* янтарный — первые золотые лучи */
  --color-warning-muted:  #b87c1818;
  --color-warning-row-bg: #b87c180a;  /* едва заметная заливка строки */
  --color-danger:         #c02838;   /* малиновый — яркий сигнал тревоги */
  --color-danger-muted:   #c0283818;
  --color-info:           #3458b0;   /* небесно-синий — высокое рассветное небо */
  --color-info-muted:     #3458b018;
  --color-purple:         #7040c0;   /* лавандово-фиолетовый */
  --color-purple-muted:   #7040c018;

  /* Нейтральная шкала — персиково-розовая гамма */
  --color-neutral-100:    #fdf3ea;
  --color-neutral-200:    #f8e8d5;
  --color-neutral-300:    #edd5c0;
  --color-neutral-400:    #ddc0a4;
  --color-neutral-500:    #c8a080;
  --color-neutral-600:    #a07860;
  --color-neutral-700:    #704838;
  --color-neutral-800:    #402418;
  --color-neutral-900:    #241408;

  /* Тени — тёплые, персиково-коричневые */
  --shadow-sm:      0 1px 4px #6a3c2018;
  --shadow-md:      0 4px 16px #6a3c2222;
  --shadow-lg:      0 8px 32px #6a3c202e;
  --shadow-inset:   inset 0 1px 0 #ffffff70;
  --shadow-header:  0 1px 8px #6a3c2014;

  /* Дополнительные токены — светловая перекраска hardcoded-значений */
  --progress-track-bg:    rgba(0, 0, 0, 0.07);           /* трек неактивного прогресса */
  --card-glow:            0 0 24px #c8582a12;            /* свечение WIP/ошибка карточки */
  --dropdown-extra-glow:  0 0 20px #c8582a08;            /* свечение дропдауна */
  --chart-line-filter:    drop-shadow(0 0 3px #c8582a55); /* свечение линии графика */
  --color-scheme:         light;                          /* браузерные контролы — светлые */
}