/* ================================================================
   00 - CSS ПЕРЕМЕННЫЕ + ТЕМЫ
   Содержит :root и настройки для data-theme (dark / accessible)
================================================================ */
:root {
    /* Основные цвета светлой темы — глубокий синий */
    --bg-primary: #2e5488;
    --bg-secondary: #264878;
    --bg-tertiary: #1f3d68;

    /* Синие акцентные цвета САФУ */
    --primary-blue: #4684ca;
    --primary-blue-light: #7db4ff;
    --primary-blue-dark: #1b3a6b;
    --accent-cyan: #38bdf8;
    --accent-teal: #2dd4bf;

    /* Текст */
    --text-primary: #ffffff;
    --text-secondary: #ffffff;
    --text-muted: #ffffff;

    /* Границы и разделители */
    --border-color: #3e6a9e;
    --border-light: rgba(91, 155, 245, 0.12);

    /* Стекло-эффект */
    --glass: rgba(38, 72, 120, 0.92);
    --glass-border: rgba(91, 155, 245, 0.15);

    /* Градиенты */
    --gradient-primary: linear-gradient(135deg, #3b7ddb, #5b9bf5);
    --gradient-accent: linear-gradient(135deg, var(--accent-cyan), var(--accent-teal));
    --gradient-hero: linear-gradient(135deg, #0f2d5c 0%, #1a4b8c 50%, #2563eb 100%);

    /* Шрифты */
    --font-display: 'Unbounded', cursive;
    --font-body: 'Raleway', sans-serif;

    /* Размеры */
    --container: 1400px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 30px;

    /* Тени — глубокие на тёмно-синем фоне */
    --shadow-sm: 0 1px 3px rgba(0, 10, 30, 0.25);
    --shadow-md: 0 4px 8px rgba(0, 10, 30, 0.3);
    --shadow-lg: 0 10px 25px rgba(0, 10, 30, 0.35);
    --shadow-xl: 0 20px 50px rgba(0, 10, 30, 0.4);
    --shadow-glow: 0 0 40px rgba(91, 155, 245, 0.2);

    /* Переходы */
    --transition: 0.3s ease;
    --transition-slow: 0.6s ease;

    /* Переменные для элементов, которые были захардкожены белым — темы могут их переопределять */
    --progress-color: #ffffff;
    --cta-btn-bg: #ffffff;

    /* Z-index слои */
    --z-bg: -1;
    --z-default: 1;
    --z-card: 10;
    --z-nav: 100;
    --z-mobile-menu: 150;
    --z-theme-toggle: 200;
    --z-preloader: 1000;
}

/* ================================================================
   ТЁМНАЯ ТЕМА
================================================================ */
[data-theme="dark"] {
    --bg-primary: #0f172a;
    --bg-secondary: #1e293b;
    --bg-tertiary: #334155;

    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #64748b;

    --border-color: #334155;
    --border-light: rgba(255, 255, 255, 0.1);

    --glass: rgba(15, 23, 42, 0.9);
    --glass-border: rgba(255, 255, 255, 0.1);

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 40px rgba(14, 165, 233, 0.3);
}

/* Улучшение контраста для тёмной темы: более светлые акценты и адаптированные градиенты */
[data-theme="dark"] {
    /* Акцентные/брендовые цвета, скорректированные для видимости на тёмном фоне */
    --primary-blue: #60a5fa; /* более светлый синий */
    --primary-blue-light: #93c5fd;
    --primary-blue-dark: #1e3a8a;
    --accent-cyan: #38bdf8;
    --accent-teal: #2dd4bf;

    /* Градиенты, настроенные для тёмных поверхностей */
    --gradient-primary: linear-gradient(135deg, var(--primary-blue-dark), var(--primary-blue));
    --gradient-accent: linear-gradient(135deg, var(--accent-cyan), var(--accent-teal));
    --gradient-hero: linear-gradient(135deg, rgba(2,6,23,1) 0%, rgba(15,23,42,1) 50%, rgba(30,41,59,1) 100%);

    /* Немного более прозрачный стеклянный фон, чтобы видеть фон за контролами */
    --glass: rgba(2, 6, 23, 0.65);
    --glass-border: rgba(255, 255, 255, 0.04);

    /* Элементы интерфейса, ранее захардкоженные белым, должны адаптироваться */
    --progress-color: var(--primary-blue-light);
    --cta-btn-bg: #ffffff;
}

[data-theme="dark"] .hero__video-overlay {
    background: linear-gradient(135deg, rgba(2,6,23,0.9) 0%, rgba(6,12,24,0.85) 50%, rgba(2,6,23,0.9) 100%);
}

[data-theme="dark"] .hero__video-placeholder,
[data-theme="dark"] .hero__video-placeholder-text,
[data-theme="dark"] .hero__video-placeholder-path {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .hero__badge {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.04);
    color: var(--text-primary);
}

[data-theme="dark"] .hero__dots {
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.12) 2px, transparent 2px);
}

[data-theme="dark"] .hero__circle {
    border-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .hero__line {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.08), transparent);
}

[data-theme="dark"] .theme-toggle {
    background: var(--glass);
    border: 1px solid var(--glass-border);
}

/* Иконка глаза светлая только в светлой теме */
html:not([data-theme]) .theme-toggle__btn[data-theme="accessible"] .icon {
    color: #ffffff !important;
}

html:not([data-theme]) .theme-toggle__btn[data-theme="accessible"]:hover .icon {
    color: var(--primary-blue) !important;
}

/* Кнопка темы 'accessible' (глаз) становится светлой когда страница в dark теме */
[data-theme="dark"] .theme-toggle__btn[data-theme="accessible"] {
    background: #ffffff;
    color: var(--primary-blue-dark);
    border-color: rgba(0,0,0,0.06);
}

[data-theme="dark"] .theme-toggle__btn[data-theme="accessible"]:hover {
    background: #f3fbf7;
}

[data-theme="dark"] .card::before {
    background: rgba(0, 0, 0, 0.7);
}



/* ================================================================
   ТЕМА ДЛЯ СЛАБОВИДЯЩИХ
================================================================ */
[data-theme="accessible"] {
    --bg-primary: #ffffff;
    --bg-secondary: #f0f0f0;
    --bg-tertiary: #e0e0e0;

    --primary-blue: #000080;
    --primary-blue-light: #0000cd;
    --primary-blue-dark: #000050;
    --accent-cyan: #008080;
    --accent-teal: #006666;

    --text-primary: #000000;
    --text-secondary: #1a1a1a;
    --text-muted: #333333;

    --border-color: #000000;
    --border-light: rgba(0, 0, 0, 0.3);

    --glass: rgba(255, 255, 255, 0.95);
    --glass-border: rgba(0, 0, 0, 0.3);

    --gradient-primary: linear-gradient(135deg, #000080, #0000cd);
    --gradient-accent: linear-gradient(135deg, #008080, #006666);

    --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.3);

    /* Увеличенные шрифты для доступности */
    font-size: 18px;
}

[data-theme="accessible"] * {
    font-weight: 500 !important;
    letter-spacing: 0.02em;
}

[data-theme="accessible"] h1,
[data-theme="accessible"] h2,
[data-theme="accessible"] h3,
[data-theme="accessible"] h4 {
    font-weight: 700 !important;
}

[data-theme="accessible"] a:focus,
[data-theme="accessible"] button:focus {
    outline: 3px solid var(--primary-blue) !important;
    outline-offset: 3px;
}

/* Иконка тёмной темы должна быть чёрной в режиме для слабовидящих */
[data-theme="accessible"] .theme-toggle__btn[data-theme="dark"] {
    background: #1e293b;
    color: #ffffff;
}

[data-theme="accessible"] .theme-toggle__btn[data-theme="dark"] .icon {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}

/* Карьера — равные колонки чтобы компании вмещались при увеличенном шрифте */
[data-theme="accessible"] .career__grid {
    grid-template-columns: 1fr 1fr;
}

[data-theme="accessible"] .career__logos div {
    white-space: normal;
}

/* CTA секция — тёмный фон для контраста с белым текстом */
[data-theme="accessible"] .cta {
    background: var(--primary-blue-dark);
}

/* Учебный план — карточки адаптируются при увеличенном шрифте */
[data-theme="accessible"] .curr-card__title {
    word-break: break-word;
    overflow-wrap: break-word;
}

[data-theme="accessible"] .card::before {
    background: rgba(157, 194, 230, 0.2);
}

[data-theme="accessible"] .curr-card__tag {
    background: #ffffff;
    border: 1px solid #000000;
    color: #000000;
}

/* Навигация — уменьшаем gap чтобы ссылки не перекрывали переключатель темы */
[data-theme="accessible"] .nav__links {
    gap: 1.25rem;
}

/* Выравниваем переключатель симметрично между «Карьера» и «Подать заявку» */
[data-theme="accessible"] .nav__container .theme-toggle {
    margin-right: 1.5rem;
}

/* Логотип — тёмная подложка чтобы логотип был виден на белом фоне */
[data-theme="accessible"] .nav__logo-img {
    mix-blend-mode: normal;
    background: #000080;
    border-radius: 6px;
    padding: 3px 5px;
}

/* Граница снизу при скролле — чтобы белый nav отделялся от белой страницы */
[data-theme="accessible"] .nav.scrolled {
    border-bottom: 2px solid #000000;
}

/* Метки карточек программы — на белом фоне должны быть тёмными */
[data-theme="accessible"] .program-info__label {
    color: #333333;
}

/* Точки галереи — крупнее и контрастнее */
[data-theme="accessible"] .gallery__dot {
    width: 14px;
    height: 14px;
    background: #555555;
    border: 2px solid #000000;
}

[data-theme="accessible"] .gallery__dot.active {
    background: #000000;
    box-shadow: none;
}

