/* ==========================================================================
   css/variables.css - Дизайн-токены [SIX]
   ========================================================================== */

:root {
  /* Цветовая палитра: Тёмная тема по умолчанию */
  --color-bg-base: #0f1117;
  --color-bg-surface: #141720;
  --color-bg-card: #181b24;
  --color-bg-card-hover: #202430;
  --color-bg-elevated: #242938;
  --color-bg-backdrop: rgba(10, 12, 17, 0.82);

  /* Границы и разделители */
  --color-border-subtle: #1e222e;
  --color-border-base: #262a36;
  --color-border-focus: #ff5a36;

  /* Типографика */
  --color-text-primary: #e8eaf0;
  --color-text-secondary: #a0a6b8;
  --color-text-muted: #8a90a2;
  --color-text-inverse: #0f1117;

  /* Фирменные акценты */
  --color-accent-primary: #ff5a36;
  --color-accent-primary-hover: #ff7252;
  --color-accent-primary-active: #e54622;
  --color-accent-primary-soft: rgba(255, 90, 54, 0.14);

  --color-accent-secondary: #ffb020; /* Золото рейтинга */
  --color-accent-secondary-soft: rgba(255, 176, 32, 0.16);

  /* Статусные цвета */
  --color-status-ongoing: #10b981;
  --color-status-released: #6366f1;
  --color-status-info: #3b82f6;
  --color-status-warning: #f59e0b;
  --color-status-danger: #ef4444;

  /* Шрифты */
  --font-family-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.84375rem; /* 13.5px */
  --font-size-base: 0.9375rem;/* 15px */
  --font-size-md: 1.0625rem;  /* 17px */
  --font-size-lg: 1.25rem;    /* 20px */
  --font-size-xl: 1.5rem;     /* 24px */
  --font-size-2xl: 1.875rem;  /* 30px */
  --font-size-3xl: 2.375rem;  /* 38px */

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-snug: 1.35;
  --line-height-base: 1.55;
  --line-height-relaxed: 1.7;

  /* Отступы */
  --spacing-1: 0.25rem;  /* 4px */
  --spacing-2: 0.5rem;   /* 8px */
  --spacing-3: 0.75rem;  /* 12px */
  --spacing-4: 1rem;     /* 16px */
  --spacing-5: 1.25rem;  /* 20px */
  --spacing-6: 1.5rem;   /* 24px */
  --spacing-8: 2rem;     /* 32px */
  --spacing-10: 2.5rem;  /* 40px */
  --spacing-12: 3rem;    /* 48px */
  --spacing-16: 4rem;    /* 64px */

  /* Скругления */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* Тени */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.65);
  --shadow-glow: 0 0 24px rgba(255, 90, 54, 0.35);
  --shadow-card-hover: 0 14px 28px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 90, 54, 0.18);

  /* Анимации и переходы (150-250 мс) */
  --duration-fast: 150ms;
  --duration-normal: 200ms;
  --duration-slow: 250ms;
  --ease-base: cubic-bezier(0.2, 0, 0, 1);

  /* Габариты */
  --container-max-width: 1400px;
  --container-padding: 1.25rem;
  --header-height: 68px;

  /* Z-index */
  --z-sticky: 100;
  --z-drawer: 200;
  --z-modal-backdrop: 300;
  --z-modal: 310;
  --z-toast: 400;
}

/* Светлая тема */
[data-theme="light"] {
  --color-bg-base: #f5f6fa;
  --color-bg-surface: #ffffff;
  --color-bg-card: #ffffff;
  --color-bg-card-hover: #f9fafc;
  --color-bg-elevated: #f0f2f7;
  --color-bg-backdrop: rgba(15, 17, 23, 0.5);

  --color-border-subtle: #ebeef5;
  --color-border-base: #dce1eb;
  --color-border-focus: #ff5a36;

  --color-text-primary: #12151c;
  --color-text-secondary: #565d70;
  --color-text-muted: #8b92a4;
  --color-text-inverse: #ffffff;

  --color-accent-primary-soft: rgba(255, 90, 54, 0.1);
  --color-accent-secondary-soft: rgba(255, 176, 32, 0.14);

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.12);
  --shadow-glow: 0 0 20px rgba(255, 90, 54, 0.22);
  --shadow-card-hover: 0 12px 28px rgba(0, 0, 0, 0.12);
}