/* ==========================================================================
   DESIGN TOKENS — ЛВН Менеджмент · Единая дизайн-система v2
   Семантические CSS-переменные. НЕ называть по конкретному цвету.
   ========================================================================== */

/* ===== Светлая тема (по умолчанию) ===== */
:root {
  /* Бренд */
  --color-brand: #2c5f8a;
  --color-brand-hover: #1e4666;
  --color-brand-strong: #16344d;
  --color-brand-soft: #eaf1f7;
  --color-brand-contrast: #ffffff;

  /* Фоны */
  --color-background: #f4f5f7;
  --color-surface: #ffffff;
  --color-surface-raised: #fafbfc;
  --color-surface-hover: #eef1f4;

  /* Текст */
  --color-text: #1e2a38;
  --color-text-muted: #5c6b7a;
  --color-text-inverse: #ffffff;

  /* Границы и фокус */
  --color-border: #d9dfe6;
  --color-border-strong: #b9c3ce;
  --color-focus: #2c7fba;
  --color-focus-ring: rgba(44, 127, 186, 0.25);

  /* Семантические */
  --color-success: #1f7a46;
  --color-success-bg: #e5f4ec;
  --color-warning: #9a6200;
  --color-warning-bg: #f9efd8;
  --color-danger: #b3362b;
  --color-danger-bg: #f8e9e7;
  --color-info: #1d5fa8;
  --color-info-bg: #e8f0fa;

  /* Состояния */
  --color-disabled-bg: #e9ecef;
  --color-disabled-text: #9aa5b0;
  --color-disabled-border: #d4d9df;

  /* Типографика */
  --font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.875rem;   /* 14px */
  --font-size-md: 1rem;       /* 16px */
  --font-size-lg: 1.25rem;    /* 20px */
  --font-size-xl: 1.75rem;    /* 28px */
  --font-size-2xl: 2.25rem;   /* 36px */
  --line-height: 1.55;
  --line-height-tight: 1.3;

  /* Отступы */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* Радиусы */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-full: 999px;

  /* Тени */
  --shadow-sm: 0 1px 2px rgba(15, 25, 40, 0.06);
  --shadow-md: 0 4px 14px rgba(15, 25, 40, 0.09);
  --shadow-lg: 0 10px 32px rgba(15, 25, 40, 0.14);

  /* Компоновка */
  --container-width: 1160px;
  --header-height: 64px;
  --sidebar-width: 240px;

  /* Прочее */
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s ease;
  --z-index-header: 100;
  --z-index-dropdown: 200;
  --z-index-modal: 1000;
  --z-index-toast: 1100;
}

/* ===== Тёмная тема ===== */
[data-theme="dark"] {
  --color-brand: #5a9bd4;
  --color-brand-hover: #79b4e3;
  --color-brand-strong: #8fc6ee;
  --color-brand-soft: #1c3144;
  --color-brand-contrast: #0f1a24;

  --color-background: #10161d;
  --color-surface: #1a222b;
  --color-surface-raised: #202a34;
  --color-surface-hover: #26323e;

  --color-text: #e8edf2;
  --color-text-muted: #9aa7b4;
  --color-text-inverse: #0f1a24;

  --color-border: #2b3742;
  --color-border-strong: #3d4c5a;
  --color-focus: #6aaede;
  --color-focus-ring: rgba(106, 174, 222, 0.3);

  --color-success: #3ddb8f;
  --color-success-bg: rgba(61, 219, 143, 0.13);
  --color-warning: #e8b45a;
  --color-warning-bg: rgba(232, 180, 90, 0.13);
  --color-danger: #f0857c;
  --color-danger-bg: rgba(240, 133, 124, 0.13);
  --color-info: #6ba7e8;
  --color-info-bg: rgba(107, 167, 232, 0.13);

  --color-disabled-bg: #2a3540;
  --color-disabled-text: #6e7c8a;
  --color-disabled-border: #384450;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 10px 32px rgba(0, 0, 0, 0.55);
}

/* ==========================================================================
   Системная тёмная тема (если пользователь не выбрал вручную)
   JS выставляет data-theme на раннем этапе (FOUC-защита).
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-brand: #5a9bd4;
    --color-brand-hover: #79b4e3;
    --color-brand-strong: #8fc6ee;
    --color-brand-soft: #1c3144;
    --color-brand-contrast: #0f1a24;

    --color-background: #10161d;
    --color-surface: #1a222b;
    --color-surface-raised: #202a34;
    --color-surface-hover: #26323e;

    --color-text: #e8edf2;
    --color-text-muted: #9aa7b4;
    --color-text-inverse: #0f1a24;

    --color-border: #2b3742;
    --color-border-strong: #3d4c5a;
    --color-focus: #6aaede;
    --color-focus-ring: rgba(106, 174, 222, 0.3);

    --color-success: #3ddb8f;
    --color-success-bg: rgba(61, 219, 143, 0.13);
    --color-warning: #e8b45a;
    --color-warning-bg: rgba(232, 180, 90, 0.13);
    --color-danger: #f0857c;
    --color-danger-bg: rgba(240, 133, 124, 0.13);
    --color-info: #6ba7e8;
    --color-info-bg: rgba(107, 167, 232, 0.13);

    --color-disabled-bg: #2a3540;
    --color-disabled-text: #6e7c8a;
    --color-disabled-border: #384450;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.45);
    --shadow-lg: 0 10px 32px rgba(0, 0, 0, 0.55);
  }
}