/* ===== THEME SYSTEM - MAIN IMPORT FILE ===== */
/* static/css/themes/themes.css */

/* 1. Сначала базовые переменные (НЕЙТРАЛЬНЫЕ) */
@import url('./core-variables.css');

/* 2. Потом темы (в порядке специфичности - светлая ПЕРВОЙ!) */
@import url('./light-theme.css');    /* Первой для правильного cascade! */
@import url('./dark-theme.css');

/* 3. Затем компоненты */
@import url('./theme-components.css');

/* 4. ПРИНУДИТЕЛЬНОЕ переопределение для светлой темы (для отладки) */
[data-theme="light"] {
  --bg-primary: #ffffff !important;    /* Белый фон */
  --bg-secondary: #f8fafc !important;  /* Очень светлый */
  --text-primary: #0f172a !important;  /* Очень темный текст */
  --border-color: #e2e8f0 !important;  /* Светлая граница */
  --bg-gradient: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 25%, #f0f4ff 50%, #fef7f0 75%, #fff7ed 100%) !important;  /* Уникальный светлый градиент */
  --hero-bg-gradient: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 25%, #f0f4ff 50%, #fef7f0 75%, #fff7ed 100%) !important;  /* ПРАВИЛЬНАЯ ПЕРЕМЕННАЯ! */
}

/* ===== Mentora THEMES SYSTEM ===== */
/* static/css/themes/themes.css - ЕДИНСТВЕННАЯ ТОЧКА ПОДКЛЮЧЕНИЯ */

/* ===== THEME INITIALIZATION ===== */
/* Устанавливаем светлую тему по умолчанию если не задана */
html:not([data-theme]) {
  color-scheme: light;
}

html[data-theme="light"] {
  color-scheme: light;  
}

html[data-theme="dark"] {
  color-scheme: dark;
}

/* ===== THEME TRANSITION ===== */
*, *::before, *::after {
  transition: 
    background-color var(--transition-speed) ease,
    color var(--transition-speed) ease,
    border-color var(--transition-speed) ease,
    box-shadow var(--transition-speed) ease;
}

/* ===== SMOOTH THEME SWITCHING ===== */
html {
  transition: color-scheme var(--transition-speed) ease;
}

body {
  transition: 
    background var(--transition-speed) ease,
    color var(--transition-speed) ease;
}

/* ===== FALLBACKS ===== */
@supports not (color: var(--primary)) {
  body {
    background: #ffffff;
    color: #0f172a;
  }
  
  .btn-primary {
    background: #3ECDC1;
    color: white;
  }
}

/* ===== PRINT STYLES ===== */
@media print {
  html[data-theme] {
    color-scheme: light;
  }
  
  body {
    background: white !important;
    color: black !important;
  }
} 