/* ============================================================
   ДВ МОРОЗ — экспериментальная тема "Арктика" (ice-theme)
   Ледяной glassmorphism, снег, плавные линии.
   Активируется классом body.theme-ice — старая тема (style.css)
   остаётся нетронутой и работает по умолчанию.
   ============================================================ */

body.theme-ice {
    --ice-deep: #071427;
    --ice-mid: #0e2a4a;
    --ice-cyan: #4fd1ff;
    --ice-cyan-2: #8ff0ff;
    --ice-white: #f2fbff;
    --accent-mint: #00d4aa;
    --glass-bg: rgba(255,255,255,0.07);
    --glass-bg-strong: rgba(255,255,255,0.12);
    --glass-border: rgba(255,255,255,0.22);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    color: var(--ice-white) !important;
    background:
        radial-gradient(ellipse 900px 500px at 15% -10%, rgba(79,209,255,0.35), transparent 60%),
        radial-gradient(ellipse 700px 500px at 110% 10%, rgba(126,71,240,0.28), transparent 55%),
        radial-gradient(ellipse 800px 600px at 50% 120%, rgba(0,212,170,0.18), transparent 60%),
        linear-gradient(180deg, var(--ice-deep) 0%, var(--ice-mid) 55%, var(--ice-deep) 100%) !important;
    background-attachment: fixed !important;
    position: relative;
    overflow-x: hidden;
}

body.theme-ice h1, body.theme-ice h2, body.theme-ice h3 {
    font-family: 'Space Grotesk', 'Inter', sans-serif !important;
    letter-spacing: -0.01em;
}

body.theme-ice h2 {
    color: var(--ice-white) !important;
    text-shadow: 0 0 24px rgba(79,209,255,0.35);
}

body.theme-ice a { color: var(--ice-cyan-2); }

/* ── Snowfall overlay ── */
.ice-snow {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    overflow: hidden;
}
.ice-flake {
    position: absolute;
    top: -10px;
    color: rgba(255,255,255,0.85);
    text-shadow: 0 0 6px rgba(143,240,255,0.6);
    animation: ice-fall linear infinite, ice-sway ease-in-out infinite;
    will-change: transform;
}
@keyframes ice-fall {
    to { transform: translateY(110vh); }
}
@keyframes ice-sway {
    0%, 100% { margin-left: 0; }
    50% { margin-left: 30px; }
}

/* ── Контейнер ── */
body.theme-ice .container {
    position: relative;
    z-index: 3;
}

/* ── Hero / header ──
   min-height убран: он был рассчитан только под большую hero-карточку index.php
   и создавал огромный пустой отступ на простых заголовках других страниц
   (например calculator.php) — там нет вложенной стеклянной карточки,
   и высота должна определяться содержимым. */
body.theme-ice header {
    background: transparent !important;
    box-shadow: none !important;
    padding: 28px 20px !important;
    margin-bottom: 0 !important;
    overflow: visible !important;
}
body.theme-ice div[style*="margin: 50px 0"] {
    margin: 18px 0 !important;
}
body.theme-ice header > div[style*="position: relative"] {
    background: var(--glass-bg-strong) !important;
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid var(--glass-border) !important;
    border-radius: 28px !important;
    padding: 46px 34px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.25);
    animation: ice-rise 0.9s cubic-bezier(.2,.9,.2,1) both;
}
body.theme-ice header h1 {
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 700 !important;
    background: linear-gradient(90deg, #fff, var(--ice-cyan-2) 60%, var(--accent-mint));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none !important;
}
@keyframes ice-rise {
    from { opacity: 0; transform: translateY(24px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Динамический фон: светлые/тёмные зоны медленно смещаются ── */
body.theme-ice::before {
    content: '';
    position: fixed;
    inset: -15%;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 700px 500px at 20% 20%, rgba(79,209,255,0.4), transparent 60%),
        radial-gradient(ellipse 650px 550px at 80% 15%, rgba(126,71,240,0.30), transparent 58%),
        radial-gradient(ellipse 750px 600px at 55% 85%, rgba(0,212,170,0.22), transparent 60%),
        radial-gradient(ellipse 500px 500px at 10% 80%, rgba(143,240,255,0.22), transparent 55%);
    filter: blur(10px);
    animation: ice-bg-drift 15s ease-in-out infinite alternate;
    will-change: transform;
}
@keyframes ice-bg-drift {
    0%   { transform: translate(0%, 0%) scale(1) rotate(0deg); }
    33%  { transform: translate(-5%, 4%) scale(1.08) rotate(2deg); }
    66%  { transform: translate(4%, -3%) scale(1.05) rotate(-2deg); }
    100% { transform: translate(-3%, -4%) scale(1.1) rotate(1deg); }
}
@media (max-width: 640px) {
    body.theme-ice::before { animation-duration: 11s; }
}

/* ── Кнопки / CTA ── */
body.theme-ice a[href="#requestForm"],
body.theme-ice a[href="/calculator.php"],
body.theme-ice .btn {
    background: linear-gradient(120deg, var(--accent-mint), var(--ice-cyan)) !important;
    box-shadow: 0 8px 24px rgba(79,209,255,0.4) !important;
    border-radius: 50px !important;
    transition: transform .25s ease, box-shadow .25s ease !important;
}
body.theme-ice a[href="#requestForm"]:hover,
body.theme-ice a[href="/calculator.php"]:hover,
body.theme-ice .btn:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 14px 34px rgba(79,209,255,0.55) !important;
}

/* ── Большие блоки (услуги, календарь, форма, контакты...): спокойное ледяное стекло,
      плавные скруглённые углы, БЕЗ hover-анимации на самом блоке ── */
body.theme-ice .services,
body.theme-ice .calendar-section,
body.theme-ice .form-section,
body.theme-ice .contact,
body.theme-ice .links-section,
body.theme-ice .ads-section,
body.theme-ice .calc-section {
    position: relative;
    background:
        linear-gradient(135deg, rgba(200,236,255,0.16) 0%, rgba(255,255,255,0.05) 45%, rgba(120,200,255,0.11) 100%) !important;
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    border: 1px solid rgba(255,255,255,0.28) !important;
    border-radius: 22px !important;
    box-shadow:
        0 10px 30px rgba(0,30,70,0.28),
        inset 0 1px 0 rgba(255,255,255,0.3) !important;
    color: var(--ice-white) !important;
}

/* ── Мелкие элементы ВНУТРИ блоков: лёгкое подпрыгивание при наведении,
      как у карточек "Расценки" — именно этот паттерн просили везде ── */
body.theme-ice .services li,
body.theme-ice #pricing-list > div,
body.theme-ice .date-popup__day.is-free {
    transition: transform .2s ease, box-shadow .2s ease !important;
}
body.theme-ice .services li:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(79,209,255,0.35);
}
body.theme-ice #pricing-list > div {
    background: linear-gradient(135deg, rgba(200,236,255,0.18), rgba(255,255,255,0.06)) !important;
    border: 1px solid rgba(255,255,255,0.3) !important;
    border-radius: 14px !important;
}
body.theme-ice #pricing-list > div:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 26px rgba(79,209,255,0.4) !important;
}
body.theme-ice .services p,
body.theme-ice .services li,
body.theme-ice .form-section label,
body.theme-ice .contact p,
body.theme-ice #pricing-list div,
body.theme-ice .calc-section,
body.theme-ice .calc-section * {
    color: var(--ice-white) !important;
}
body.theme-ice #pricing-list > div div[style*="color: #333"],
body.theme-ice #pricing-list > div div[style*="color: #aaa"] {
    color: var(--ice-white) !important;
    opacity: .85;
}

/* ── Поля формы (везде на сайте, включая обычный input) ── */
body.theme-ice input[type="text"],
body.theme-ice input[type="tel"],
body.theme-ice input[type="email"],
body.theme-ice input[type="number"],
body.theme-ice textarea,
body.theme-ice select {
    background: rgba(255,255,255,0.9) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: 12px !important;
    color: #0e2a4a !important;
}
body.theme-ice input::placeholder, body.theme-ice textarea::placeholder { color: #6a86a6; }

/* ── ВАЖНО: поля калькулятора (input/select внутри .calc-section) ──
   Правило ".calc-section *" выше красит ВСЁ внутри в белый текст (это нужно
   для подписей/текста), но так же случайно красило текст в белый и ВНУТРИ
   input/select, из-за более высокой специфичности (2 класса против 1
   класса+тега) — получался белый текст на белом/светлом поле, невидимо.
   Здесь специфичность выше (2 класса + тег), поэтому побеждает эта пара
   правил, и поля остаются тёмный текст на светлом фоне — как и задумано. */
body.theme-ice .calc-section input,
body.theme-ice .calc-section select,
body.theme-ice .calc-section textarea {
    background: rgba(255,255,255,0.92) !important;
    color: #0e2a4a !important;
    border: 1px solid var(--glass-border) !important;
}
body.theme-ice .calc-section input::placeholder {
    color: #6a86a6 !important;
}

/* ── Чекбоксы техники в калькуляторе (та же логика: перебиваем ".calc-section *") ── */
body.theme-ice .calc-section .checkbox-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    color: var(--ice-white) !important;
}
body.theme-ice .calc-section .checkbox-card:hover {
    background: rgba(255,255,255,0.12) !important;
    border-color: var(--ice-cyan) !important;
}
body.theme-ice .calc-section .checkbox-card.checked {
    background: rgba(0,212,170,0.18) !important;
    border-color: var(--accent-mint) !important;
    color: var(--ice-white) !important;
}

/* ── Календарь занятости ── */
body.theme-ice #calendar table th {
    background: rgba(255,255,255,0.12) !important;
    color: var(--ice-white) !important;
}
body.theme-ice #calendar table td[style*="background: #e8f5e9"] {
    background: rgba(0,212,170,0.25) !important;
    color: #d6fff2 !important;
}
body.theme-ice #calendar table td[style*="background: #ffebee"] {
    background: rgba(255,90,120,0.25) !important;
    color: #ffd6df !important;
}
body.theme-ice #calendar table td[style*="background: #f5f5f5"] {
    background: rgba(255,255,255,0.05) !important;
    color: rgba(255,255,255,0.35) !important;
}
body.theme-ice .calendar-nav {
    background: linear-gradient(120deg, var(--accent-mint), var(--ice-cyan)) !important;
    border-radius: 50px !important;
}

/* ── Попап выбора даты ── */
body.theme-ice .date-popup {
    background: rgba(14,42,74,0.92) !important;
    backdrop-filter: blur(18px);
    border: 1px solid var(--glass-border) !important;
}
body.theme-ice .date-popup__title { color: var(--ice-cyan-2) !important; }
body.theme-ice .date-popup__day.is-free { background: rgba(0,212,170,0.25) !important; color: #d6fff2 !important; }
body.theme-ice .date-popup__day.is-busy { background: rgba(255,90,120,0.22) !important; color: #ffd6df !important; }
body.theme-ice .date-popup__day.is-past { background: rgba(255,255,255,0.04) !important; color: rgba(255,255,255,0.3) !important; }
body.theme-ice .date-popup__legend { color: rgba(255,255,255,0.7) !important; }

/* ── Плавное появление секций при скролле ── */
body.theme-ice .ice-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1);
}
body.theme-ice .ice-reveal.is-shown {
    opacity: 1;
    transform: translateY(0);
}

/* ── Переключатель темы (кнопка отключена в theme.php, стили оставлены
      на случай, если решите вернуть) ── */
.theme-switcher {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 9998;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 50px;
    background: rgba(20,30,45,0.85);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.15);
    transition: transform .2s ease;
}
.theme-switcher:hover { transform: translateY(-2px); color: #fff; }
body.theme-ice .theme-switcher {
    background: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.3);
}
@media (max-width: 480px) {
    .theme-switcher { left: 12px; bottom: 12px; padding: 8px 12px; font-size: 12px; }
}

/* ── Мобильная адаптация ── */
@media (max-width: 640px) {
    body.theme-ice header > div[style*="position: relative"] { padding: 30px 20px !important; border-radius: 20px !important; }
    body.theme-ice .services,
    body.theme-ice .calendar-section,
    body.theme-ice .form-section,
    body.theme-ice .contact { border-radius: 16px !important; padding: 20px !important; }
}

/* ── Фикс читаемости: список услуг (li c белым фоном из style.css) ── */
body.theme-ice .services li {
    background: rgba(255,255,255,0.09) !important;
    border-left: 4px solid var(--ice-cyan) !important;
    color: var(--ice-white) !important;
}
body.theme-ice .services li:before {
    color: var(--ice-cyan-2) !important;
}

/* ── Фикс читаемости: блок "Не знаете какой кондиционер выбрать?" (светлый инлайн-градиент) ── */
body.theme-ice .services div[style*="e3f2fd"] {
    background: rgba(255,255,255,0.1) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: 16px !important;
}
body.theme-ice .services div[style*="e3f2fd"] p {
    color: var(--ice-white) !important;
}

/* ── Скрываем случайную фоновую картинку баннера — не сочетается с арктикой ── */
body.theme-ice #banner-img {
    display: none !important;
}

/* ── Подписи полей формы (по умолчанию тёмно-серые в style.css) ── */
body.theme-ice .form-group label {
    color: var(--ice-white) !important;
}

/* ── Общая защитная сетка: инлайновые тёмные цвета текста на всей странице,
      которые иначе остаются нечитаемыми на тёмном ледяном фоне.
      ИСКЛЮЧЕНИЕ: .result-box (карточка результата калькулятора) — это
      самостоятельный светлый блок (мятно-зелёный/белый), который и в
      обычном дизайне остаётся светлым и не темнеет под тему. Раньше эта
      сетка красила текст внутри него (например кнопки маркетплейсов) в
      белый — а фон там оставался белым, получалось невидимо. ── */
body.theme-ice [style*="color: #333"]:not(.result-box, .result-box *),
body.theme-ice [style*="color:#333"]:not(.result-box, .result-box *),
body.theme-ice [style*="color: #444"]:not(.result-box, .result-box *),
body.theme-ice [style*="color:#444"]:not(.result-box, .result-box *),
body.theme-ice [style*="color: #555"]:not(.result-box, .result-box *),
body.theme-ice [style*="color:#555"]:not(.result-box, .result-box *),
body.theme-ice [style*="color: #666"]:not(.result-box, .result-box *),
body.theme-ice [style*="color:#666"]:not(.result-box, .result-box *) {
    color: var(--ice-white) !important;
}
