/* ============================================================
   Дизайн-токены сайта. Единственный источник констант.
   JS-зеркало: js/theme.js (цветовые токены и брейкпоинты).
   Подключается ПЕРВЫМ из всех CSS-файлов.
   ============================================================ */

:root {
    /* ---------- Нейтральная шкала ---------- */
    --gray-0:   #ffffff;
    --gray-50:  #f8f9fa;  /* также #f8f8f8 */
    --gray-100: #f5f5f5;
    --gray-150: #f0f0f0;
    --gray-200: #e9ecef;
    --gray-250: #e0e0e0;
    --gray-300: #dadada;
    --gray-350: #dee2e6;
    --gray-400: #cccccc;
    --gray-450: #dddddd;
    --gray-500: #999999;
    --gray-525: #888888;
    --gray-550: #aaaaaa;
    --gray-600: #666666;
    --gray-650: #555555;
    --gray-700: #333333;
    --gray-900: #000000;

    /* ---------- Текст ---------- */
    --text-main:      var(--gray-900);
    --text-secondary: var(--gray-650);
    --text-muted:     var(--gray-500);
    --text-disabled:  var(--gray-550);

    /* ---------- Бренд ---------- */
    --brand: #f51f0f;

    /* ---------- Основной (синий) ---------- */
    --primary:         #007bff;
    --primary-dark:    #2563eb;
    --primary-light:   #e6f2ff;
    --primary-ghost:   #f0f8ff;

    /* ---------- Календарь (flatpickr) ---------- */
    --cal-blue:         #1976d2;
    --cal-blue-dark:    #0d47a1;
    --cal-blue-bg:      #e3f2fd;
    --cal-blue-border:  #bbdefb;
    --cal-today:        #ffeb3b;

    /* ---------- Успех (зелёный) ---------- */
    --success:            #4caf50;
    --success-light:      #81c784;
    --success-deep:       #28a745;
    --success-deep-dark:  #218838;
    --active-green:       #3bc93580;
    --active-green-solid: #45a049;
    --active-green-text:  #1b5e20;
    --status-ok-bg:       #d4edda;
    --status-ok-text:     #155724;

    /* ---------- Ошибка (красный) ---------- */
    --danger:      #dc3545;
    --danger-dark: #c82333;
    --error-bg:    #ffeaea;
    --error-border:#f3b2b2;
    --error-text:  #b00020;

    /* ---------- Предупреждение ---------- */
    --warning: #ffc107;

    /* ---------- Нейтральные кнопки (exit) ---------- */
    --neutral:        #6c757d;
    --neutral-dark:   #5a6268;
    --neutral-bg:     var(--gray-50);
    --neutral-border: var(--gray-350);

    /* ---------- Слои карты ---------- */
    --layer-default: #3388ff;
    --layer-ruaf:    #ff0000;
    --layer-afu:     #0000ff;
    --layer-city:    #999999;
    --layer-mg:      #ffffff;

    /* ---------- Поверхности ---------- */
    --surface:     #ffffff;
    --surface-alt: #fefefe;

    /* ---------- Шрифты ---------- */
    --font-main: 'Roboto', Arial, sans-serif;
    --font-logo: 'Wallpoet', monospace;
    --font-mono: monospace;

    /* ---------- Размеры шрифта ---------- */
    --font-size-xs:   12px;
    --font-size-sm:   13px;
    --font-size-md:   14px;
    --font-size-base: 1rem;
    --font-size-lg:   1.25rem;
    --font-size-xl:   1.5rem;
    --font-size-2xl:  2rem;

    /* ---------- Закругления ---------- */
    --radius-sm:  3px;
    --radius-md:  4px;
    --radius-lg:  8px;
    --radius-xl:  10px;

    /* ---------- Отступы (база 4px) ---------- */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;

    /* ---------- Тени ---------- */
    --shadow-sm:      0 1px 5px rgba(0, 0, 0, 0.4);
    --shadow-md:      0 2px 10px rgba(0, 0, 0, 0.2);
    --shadow-lg:      0 5px 15px rgba(0, 0, 0, 0.3);
    --shadow-topbar:  0 3px 10px rgba(0, 0, 0, 0.2);
    --shadow-touch:   0 1px 5px rgba(0, 0, 0, 0.65);
    --shadow-inset:   inset 0 0 3px rgba(0, 0, 0, 0.3);

    /* ---------- z-index ---------- */
    --z-map-pane:        400;
    --z-map-interactive: 500;
    --z-panel:           1000;
    --z-topbar:          1001;
    --z-topbar-menu:     1002;
    --z-filter-menu:     1500;
    --z-dropdown:        2000;
    --z-modal:           3000;

    /* ---------- Переходы ---------- */
    --transition-fast: 0.2s;
    --transition-base: 0.3s ease;
}

/* Брейкпоинты (используются в @media ниже и в js/theme.js):
   mobile:  ≤ 480px  — очень узкие экраны
   tablet:  ≤ 768px  — мобильные / планшеты
   compact: ≤ 901px  — планшеты, узкие десктопы
   desktop: ≥ 1201px — десктоп (полная панель навигации)
   CSS-переменные в @media не работают, поэтому значения продублированы
   в медиазапросах — при изменении менять ВДОВУ: здесь и в js/theme.js. */