/*
╔═══════════════════════════════════════════════════════════════════════════════╗
║                    🏗️ STUDYHUB.AZ CSS АРХИТЕКТУРА                            ║
║                      📂 ФАЙЛ: theme-loader.css                               ║
╚═══════════════════════════════════════════════════════════════════════════════╝

🎯 НАЗНАЧЕНИЕ ФАЙЛА:
├─ Централизованная загрузка тематических стилей
├─ Активация стилей для конкретных аудиторий
├─ Управление переключением тем
└─ Оптимизация производительности

👥 ПОДДЕРЖИВАЕМЫЕ ТЕМЫ:
🧑‍💻 .theme-programmers - "Вауу! Matrix эффекты, hologram glitch, cyber pulse!"
👔 .theme-executives - "Красиво! Золото, мрамор, diamond sparkle!"
👩‍🏫 .theme-teachers - "Удобно! Читаемость, focus highlight, comfort!"
👨‍👩‍👧‍👦 .theme-parents - "Серьезная компания! Security shields, certificates!"
🎓 .theme-students - "Современный! Neon glow, gaming effects, trendy!"

💎 РЕЗУЛЬТАТ: Стили готовы к использованию и полностью соответствуют 
архитектуре StudyHub.AZ с 15+ летним опытом в IT!

📐 АРХИТЕКТУРНЫЕ ПРАВИЛА:
✅ Базовые стили для переключения тем
✅ Классы-активаторы для JavaScript
✅ Совместимость со всеми браузерами
✅ Оптимизированная загрузка
❌ Запрещены: дублирование стилей, прямые переменные

🔗 СВЯЗИ:
├─ Загружается после vars.css и base.css
├─ Активирует themes-*.css файлы
├─ Управляется через JavaScript API
└─ Интегрируется с адаптивными стилями

💡 ИСПОЛЬЗОВАНИЕ:
document.body.className = 'theme-programmers'; // Активация темы программистов
document.body.className = 'theme-executives';  // Активация темы директоров
document.body.className = 'theme-teachers';    // Активация темы учителей
document.body.className = 'theme-parents';     // Активация темы родителей
document.body.className = 'theme-students';    // Активация темы учеников
*/

/* === 🎨 БАЗОВЫЕ СТИЛИ ТЕМАТИЗАЦИИ === */

/* Базовое состояние без темы */
body {
  transition: var(--smooth-transition);
  font-family: var(--font-main);
  background: var(--color-bg-main);
  color: var(--color-text-main);
}

/* === 🧑‍💻 ПРОГРАММИСТЫ - АКТИВАЦИЯ === */
body.theme-programmers {
  --dynamic-primary: var(--tech-neon-blue);
  --dynamic-secondary: var(--tech-cyber-purple);
  --dynamic-accent: var(--tech-matrix-accent);
  --dynamic-bg: var(--tech-code-bg);
  --dynamic-glow: var(--cyber-pulse-shadow);
  
  background: var(--tech-code-bg);
  color: var(--tech-terminal-green);
  
  /* Активация tech компонентов */
  .container {
    background: var(--glass-tech);
    backdrop-filter: var(--glass-backdrop-ultra);
  }
  
  .btn-primary {
    background: var(--hologram-gradient);
    border: var(--hologram-border);
    animation: neuralPulse 3s ease-in-out infinite;
  }
  
  /* Глобальная подсветка для tech элементов */
  *:focus {
    box-shadow: 0 0 0 3px var(--tech-hologram-blue) !important;
  }
}

/* === 👔 ДИРЕКТОРА - АКТИВАЦИЯ === */
body.theme-executives {
  --dynamic-primary: var(--luxury-gold);
  --dynamic-secondary: var(--luxury-platinum);
  --dynamic-accent: var(--executive-navy);
  --dynamic-bg: var(--premium-marble);
  --dynamic-glow: var(--diamond-sparkle-shadow);
  
  background: var(--stability-bg);
  color: var(--executive-navy);
  
  /* Активация executive компонентов */
  .container {
    background: var(--premium-glass);
    backdrop-filter: var(--glass-backdrop-ultra);
    border: 2px solid var(--luxury-platinum);
  }
  
  .btn-primary {
    background: var(--royal-gradient);
    border: 2px solid var(--luxury-gold);
    animation: royalPresence 4s ease-in-out infinite;
  }
  
  /* Глобальная luxury подсветка */
  *:focus {
    box-shadow: var(--diamond-shadow), 0 0 0 3px var(--luxury-gold) !important;
  }
}

/* === 👩‍🏫 УЧИТЕЛЯ - АКТИВАЦИЯ === */
body.theme-teachers {
  --dynamic-primary: var(--teacher-calm-blue);
  --dynamic-secondary: var(--teacher-warm-green);
  --dynamic-accent: var(--readable-blue);
  --dynamic-bg: var(--teacher-soft-bg);
  --dynamic-glow: var(--gentle-shadow);
  
  background: var(--teacher-soft-bg);
  color: var(--comfort-text);
  line-height: 1.7;
  
  /* Активация teacher компонентов */
  .container {
    background: white;
    border: var(--gentle-border);
    animation: gentleBreathing 4s ease-in-out infinite;
  }
  
  .btn-primary {
    background: var(--productivity-gradient);
    min-height: 48px;
    font-weight: 600;
  }
  
  /* Accessibility-первая подсветка */
  *:focus {
    box-shadow: var(--focus-ring) !important;
    outline: none !important;
  }
  
  /* Улучшенная читаемость */
  h1, h2, h3, h4, h5, h6 {
    color: var(--readable-blue);
    line-height: 1.4;
  }
}

/* === 👨‍👩‍👧‍👦 РОДИТЕЛИ - АКТИВАЦИЯ === */
body.theme-parents {
  --dynamic-primary: var(--trust-shield-blue);
  --dynamic-secondary: var(--trust-secure-green);
  --dynamic-accent: var(--trust-certificate-gold);
  --dynamic-bg: var(--institutional-bg);
  --dynamic-glow: var(--authority-shadow);
  
  background: var(--stability-bg);
  color: var(--trust-shield-blue);
  
  /* Активация parent компонентов */
  .container {
    background: var(--institutional-bg);
    border: var(--security-border);
    animation: stabilityPulse 5s ease-in-out infinite;
  }
  
  .btn-primary {
    background: var(--reliability-gradient);
    border: 2px solid var(--trust-shield-blue);
    animation: securityValidation 4s ease-in-out infinite;
  }
  
  /* Институциональная подсветка */
  *:focus {
    box-shadow: var(--certification-shadow), 0 0 0 3px var(--trust-secure-green) !important;
  }
}

/* === 🎓 УЧЕНИКИ - АКТИВАЦИЯ === */
body.theme-students {
  --dynamic-primary: var(--student-vibrant-purple);
  --dynamic-secondary: var(--student-electric-blue);
  --dynamic-accent: var(--student-neon-pink);
  --dynamic-bg: var(--trendy-glass);
  --dynamic-glow: var(--gaming-shadow);
  
  background: linear-gradient(135deg, 
    var(--trendy-glass) 0%, 
    rgba(139, 92, 246, 0.05) 100%);
  color: var(--student-vibrant-purple);
  
  /* Активация student компонентов */
  .container {
    background: var(--glass-ultra);
    backdrop-filter: var(--glass-backdrop-ultra);
    border: var(--neon-border);
    animation: neonGlow 3s ease-in-out infinite;
  }
  
  .btn-primary {
    background: var(--trendy-gradient);
    animation: cosmicDance 6s linear infinite;
  }
  
  /* Gaming подсветка */
  *:focus {
    box-shadow: var(--gaming-shadow), 0 0 0 3px var(--student-neon-pink) !important;
  }
  
  /* Holographic эффекты */
  .card, .feature-item, .stat-card {
    position: relative;
    overflow: hidden;
  }
  
  .card::before, .feature-item::before, .stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--holographic-foil);
    animation: holographicReveal 4s ease-in-out infinite;
    z-index: 1;
    pointer-events: none;
  }
}

/* === 🎯 УНИВЕРСАЛЬНЫЕ УЛУЧШЕНИЯ === */

/* Плавное переключение между темами */
body * {
  transition: 
    background-color var(--smooth-transition),
    color var(--smooth-transition),
    border-color var(--smooth-transition),
    box-shadow var(--smooth-transition);
}

/* Оптимизация анимаций для слабых устройств */
@media (prefers-reduced-motion: reduce) {
  body.theme-programmers *,
  body.theme-executives *,
  body.theme-teachers *,
  body.theme-parents *,
  body.theme-students * {
    animation: none !important;
    transition: var(--micro-interaction) !important;
  }
}

/* Высококонтрастный режим */
@media (prefers-contrast: high) {
  body.theme-teachers {
    --readable-blue: #003d82;
    --comfort-text: #000000;
    filter: contrast(120%);
  }
  
  body.theme-parents {
    --trust-shield-blue: #003d82;
    --reliable-gray: #333333;
    filter: contrast(115%);
  }
}

/* Темная тема системы */
@media (prefers-color-scheme: dark) {
  body.theme-programmers {
    --tech-code-bg: rgba(5, 8, 12, 0.98);
    --tech-terminal-green: #00ff88;
  }
  
  body.theme-executives {
    --premium-marble: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 50%, #404040 100%);
    --luxury-gold: #ffd700;
  }
  
  body.theme-teachers {
    --teacher-soft-bg: #f8f9fa;
    /* Учителя остаются светлыми для читаемости */
  }
  
  body.theme-parents {
    --institutional-bg: #f5f7fa;
    /* Родители остаются светлыми для доверия */
  }
  
  body.theme-students {
    background: linear-gradient(135deg, 
      rgba(13, 17, 23, 0.95) 0%, 
      rgba(139, 92, 246, 0.1) 100%);
  }
}

/* === 🔧 УТИЛИТЫ ДЛЯ РАЗРАБОТЧИКОВ === */

/* Отладочные классы */
.debug-theme-info::before {
  content: 'Theme: ' attr(class);
  position: fixed;
  top: 10px;
  right: 10px;
  background: rgba(0, 0, 0, 0.8);
  color: white;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  z-index: 9999;
  font-family: monospace;
}

/* Предварительная загрузка ресурсов */
.theme-preloader {
  display: none;
  background-image: 
    var(--hologram-gradient),
    var(--royal-gradient),
    var(--productivity-gradient),
    var(--reliability-gradient),
    var(--trendy-gradient);
}

/* === 📱 АДАПТИВНЫЕ ТЕМЫ === */

/* Мобильная оптимизация тем */
@media (max-width: 768px) {
  body.theme-programmers .tech-dashboard-wow,
  body.theme-executives .executive-dashboard-luxury,
  body.theme-teachers .teacher-workspace-comfort,
  body.theme-parents .parent-dashboard-trust,
  body.theme-students .student-hub-modern {
    padding: 16px;
    border-radius: 12px;
  }
  
  /* Упрощенные анимации на мобильных */
  body * {
    animation-duration: 1s !important;
    animation-iteration-count: 1 !important;
  }
}

/* === 🚀 ПРОИЗВОДИТЕЛЬНОСТЬ === */

/* GPU ускорение для анимаций */
body.theme-programmers .tech-card-wow,
body.theme-executives .executive-card-luxury,
body.theme-teachers .teacher-card-comfort,
body.theme-parents .parent-card-trust,
body.theme-students .student-card-modern {
  will-change: transform, opacity;
  transform: translateZ(0);
}

/* Оптимизация перерисовки */
body.theme-programmers,
body.theme-executives,
body.theme-teachers,
body.theme-parents,
body.theme-students {
  contain: layout style paint;
}

/* === 💡 ПРИМЕР ИСПОЛЬЗОВАНИЯ В HTML === */
/*
<!DOCTYPE html>
<html lang="ru">
<head>
  <link rel="stylesheet" href="styles/vars.css">
  <link rel="stylesheet" href="styles/base.css">
  <link rel="stylesheet" href="styles/theme-loader.css">
  
  <!-- Тематические файлы загружаются по требованию -->
  <link rel="stylesheet" href="styles/themes-programmers.css" media="none" onload="if(media!='all')media='all'">
  <link rel="stylesheet" href="styles/themes-executives.css" media="none" onload="if(media!='all')media='all'">
  <link rel="stylesheet" href="styles/themes-teachers.css" media="none" onload="if(media!='all')media='all'">
  <link rel="stylesheet" href="styles/themes-parents.css" media="none" onload="if(media!='all')media='all'">
  <link rel="stylesheet" href="styles/themes-students.css" media="none" onload="if(media!='all')media='all'">
</head>
<body class="theme-programmers">
  <!-- Контент сайта -->
</body>
</html>

JavaScript API:
function setTheme(themeName) {
  document.body.className = `theme-${themeName}`;
  localStorage.setItem('studyhub-theme', themeName);
}

// Автоматическое определение темы по роли пользователя
function setThemeByUserRole(userRole) {
  const themeMap = {
    'programmer': 'programmers',
    'executive': 'executives', 
    'teacher': 'teachers',
    'parent': 'parents',
    'student': 'students'
  };
  setTheme(themeMap[userRole] || 'teachers');
}
*/