/*
|=============================================================================
| 🎨 STUDYHUB.AZ - ГЛАВНЫЙ ФАЙЛ СТИЛЕЙ
|=============================================================================
| 
| 📁 ФАЙЛ: style.css
| 👨‍💻 АВТОР: Ostwind by Dr.FC
| 🎯 НАЗНАЧЕНИЕ: Базовый стиль для всех устройств
| 🔗 СОВМЕСТИМОСТЬ: Работает с desktop.css, tablet.css, mobile.css
| 
|=============================================================================
*/

/*
|=============================================================================
| 🏗️ StudyHub.AZ CSS АРХИТЕКТУРА
|=============================================================================
| 
| 📂 СТРУКТУРА ФАЙЛОВ:
| ├── vars.css        ✅ Только переменные и цвета
| ├── base.css        ✅ Reset, body, глобальные настройки
| ├── layout.css      ✅ Контейнеры, сетки, секции
| ├── animations.css  ✅ Все keyframes и анимационные эффекты
| ├── buttons.css     ✅ Система btn-modern, старые классы
| ├── cards.css       ✅ stat-card, feature-card, department-cards
| ├── components.css  ✅ Формы, модальные окна, утилиты
| ├── utilities.css   ✅ .d-flex, .mt-4, .text-center
| ├── style.css       ✅ Базовый стиль (этот файл)
| ├── forms.css       ✅ Стили форм и элементов ввода
| ├── header.css      ✅ Стили заголовка и навигации
| ├── schedule_conflicts.css ✅ Стили конфликтов расписания
| │   (Стили расписания в layout.css, cards.css, components.css, mobile.css, tablet.css, responsive.css)
| ├── scroll-to-top.css ✅ Стили кнопки прокрутки вверх
| ├── tables.css      ✅ Стили таблиц и данных
| ├── theme-loader.css ✅ Загрузчик тем и переключение
| ├── typography.css  ✅ Типографика и шрифты
| ├── logo-gen.php    ✅ Генератор логотипа (PHP)
| │
| 📱 АДАПТИВНЫЕ МОДУЛИ:
| ├── mobile.css      ✅ ≤ 767px - Мобильные устройства
| ├── tablet.css      ✅ 768px-1024px - Планшеты
| └── desktop.css     ✅ ≥ 1025px - Десктопы
|
| 🎨 ТЕМАТИЧЕСКИЕ СТИЛИ:
| ├── themes-executives.css   ✅ Тема для руководителей
| ├── themes-parents.css      ✅ Тема для родителей
| ├── themes-programmers.css  ✅ Тема для программистов
| ├── themes-students.css     ✅ Тема для студентов
| └── themes-teachers.css     ✅ Тема для учителей
|
|=============================================================================
| 📱 ПРАВИЛЬНАЯ АДАПТИВНОСТЬ:
|=============================================================================
|
| ✅ mobile.css (до 480px):
|    • 2-колоночная сетка для статистики
|    • Компактные размеры: padding 16px, font-size уменьшены
|    • Вертикальная раскладка для feature-header
|    • Оптимизированы кнопки и карточки
|    • Touch-friendly элементы: min-height 44px
|
| ✅ tablet.css (768px-1024px):
|    • Сбалансированные размеры: padding 24px
|    • Auto-fit grid с minmax(200px) для статистики
|    • Средние размеры шрифтов и элементов
|    • Удобная навигация на планшетах
|
| ✅ desktop.css (от 1025px):
|    • Полные размеры: padding до 40px
|    • Максимальный функционал: все AI эффекты
|    • Hover анимации только на desktop
|    • Clamp размеры для адаптивности
|
|=============================================================================
| 🏗️ АРХИТЕКТУРНЫЕ ПРАВИЛА:
|=============================================================================
|
| ✅ vars.css - только переменные и цвета:
|    --color-primary, --gradient-executive, --neural-pulse
|
| ✅ animations.css - все анимации включая AI:
|    @keyframes premiumFloat, professionalGlow, executiveSlide
|
| ✅ buttons.css - система кнопок btn-modern:
|    .btn-modern-primary, .btn-modern-secondary
|
| ✅ cards.css - карточки stat-card и feature-card:
|    .stat-card-modern, .feature-card-modern
|
| ✅ components.css - только контейнеры и сетки:
|    .admin-container-modern, .stats-grid-modern, .features-grid-modern
|
|=============================================================================
| 📱 RESPONSIVE АРХИТЕКТУРА:
|=============================================================================
|
| ❌ ЗАПРЕЩЕНО: Media queries в основных файлах
| ❌ ЗАПРЕЩЕНО: Дублирование переменных и анимаций
| ❌ ЗАПРЕЩЕНО: Адаптивные стили в components.css
|
| ✅ ПРАВИЛЬНО: Все адаптивные стили в device-файлах
| ✅ ПРАВИЛЬНО: Последовательность загрузки файлов
| ✅ ПРАВИЛЬНО: Модульность и четкое разделение
|
|=============================================================================
*/

/*
|--------------------------------------------------------------------------
| StudyHub.AZ CSS Architecture Overview
|--------------------------------------------------------------------------
| Этот файл: style.css — БАЗОВЫЙ стиль (основа для всех устройств).
| Он подключается на всех страницах и не содержит адаптивных размеров.
|
| ➤ Адаптивность реализуется через отдельные файлы:
|    - mobile.css  — подключается параллельно для устройств ≤ 767px;
|    - tablet.css  — подключается параллельно для устройств от 768px до 1024px;
|    - desktop.css — подключается параллельно для устройств ≥ 1025px;
|
| !!! ВАЖНО:
| - style.css НЕ должен содержать размеры под устройства или медиа-запросы.
| - Все адаптивные правки размещаются в соответствующих device-специфичных файлах.
|
| Используйте данную структуру, чтобы поддерживать модульность и читаемость кода.
*/


/* === АНИМАЦИИ ПЕРЕНЕСЕНЫ В animations.css === */
/* Дублирование убрано для соблюдения архитектуры */

/* === ACCESSIBILITY & THEME SUPPORT === */

/* === REDUCED MOTION === */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  .logos-container::before,
  .welcome-box::before,
  .form-block::before {
    animation: none;
  }
}

/* === HIGH CONTRAST MODE === */
@media (prefers-contrast: high) {
  :root {
    --color-border: #000;
    --color-text-main: #000;
    --color-bg-main: #fff;
  }
  
  button,
  .button,
  .welcome-button,
  .button-link {
    border: 2px solid #000;
  }
}

/* === DARK THEME SUPPORT === */
@media (prefers-color-scheme: dark) {
  /* Dark theme styles integrated into main stylesheet */
}

/* === PRINT STYLES === */
@media print {
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: var(--color-text-main) !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  .logos-container,
  .welcome-button,
  .button,
  button {
    display: none;
  }

  body {
    background: #ffffff;
    font-size: 12pt;
    line-height: 1.6;
    font-family: var(--font-main);
    color: var(--color-text-main);
  }

  h1, h2, h3, h4, h5, h6 {
  color: #1c1c1e !important;
    font-family: var(--font-title);
    font-weight: bold;
    break-inside: avoid;
    page-break-after: avoid;
  }

  table {
    page-break-inside: auto;
    border-collapse: collapse !important;
    width: 100%;
  }

  th, td {
    border: 1px solid var(--color-border);
    padding: 8px;
  }

  a {
    text-decoration: underline;
    color: var(--color-primary);
  }
}

/* === ДОПОЛНИТЕЛЬНЫЕ УТИЛИТАРНЫЕ КЛАССЫ === */
/* Стили перенесены в соответствующие файлы согласно архитектуре:
   - Кнопки → buttons.css
   - Утилиты → utilities.css
   - Формы → forms.css
*/

/* === СТИЛИ OTP ФОРМЫ === */
/* Стили перенесены в forms.css согласно архитектуре */

/* === 🎯 СТИЛИ РАЗДЕЛЕННОГО БЛОКА === */
/* Стили перенесены в layout.css согласно архитектуре */

/*
|=============================================================================
| ✅ АРХИТЕКТУРА СОБЛЮДЕНА
|=============================================================================
| 
| 🎯 style.css теперь содержит только:
|    • Базовые стили для всех устройств
|    • Accessibility поддержку (reduced motion, high contrast, print)
|    • Архитектурную документацию
| 
| ❌ Удалено согласно архитектуре:
|    • Дублирующиеся стили кнопок → buttons.css
|    • Стили форм → forms.css  
|    • Утилитарные классы → utilities.css
|    • Адаптивные стили → mobile.css/tablet.css/desktop.css
|    • Стили контейнеров → layout.css
|    • Анимации → animations.css
| 
| 🔗 Все стили распределены по соответствующим файлам
|=============================================================================
*/

