/*
 * SEO-72 — глобальні фікси chrome (header dropdown + footer).
 * Завантажується безумовно на всіх сторінках з components/loadComponents/loadStyles.php.
 */

/* ===== Header dropdown (mega-menu) =====
 * Панель .header-menu__nested-wrapper має background: hsla(0,0%,100%,.7) + м'який синій
 * drop-shadow — розрахований на синій hero homepage. На світлих сторінках (mining-hosting
 * тощо) панель зливається з фоном і стає невидимою. Додаємо нейтральну рамку + тінь, щоб
 * панель була визначена на будь-якому фоні; bridge-псевдоелемент закриває зазор між пунктом
 * меню і панеллю (top: calc(100% + 25px)), щоб курсор міг дістатися до підменю. */
/* 3-class специфічність (.header …) навмисно: переб'є per-page CSS (2 класи: background .7,
   --max-height:0px), але ПРОГРАЄ inline-стилю від JS — тож на сторінках, де menu-init JS
   відпрацьовує (home), його inline --max-height лишається чинним і анімація не змінюється. */
.header .header-menu--item .header-menu__nested-wrapper {
    /* fallback: на частині шаблонів (page-hosting) JS не виставляє inline --max-height →
       лишається 0px з per-page CSS → панель колапсує і фон зникає. Даємо запасну висоту. */
    --max-height: 1000px;
    /* near-opaque білий: панель видима на будь-якому фоні (на світлих сторінках .7 зливався) */
    background: hsla(0, 0%, 100%, .94);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 12px;
    -webkit-box-shadow: 0 14px 40px rgba(20, 40, 80, .22);
    box-shadow: 0 14px 40px rgba(20, 40, 80, .22);
    /* Нормалізація позиції між шаблонами: per-page `top: calc(100% + 25px)` дає різну висоту,
       бо висота пункту меню різна (home ~50px, page-hosting ~11px). Анкоримось до ЦЕНТРУ пункта
       (50% = центр пункта = центр header ~27px на всіх сторінках) + фіксований відступ → панель
       сидить на однаковій абсолютній висоті скрізь. */
    top: calc(50% + 15px) !important;
}

.header-menu--item:hover > .header-menu__nested-wrapper::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: calc(-1 * max(28px, 2.6vw));
    height: max(28px, 2.6vw);
}

/* ===== Footer — завжди видимий =====
 * .footer — position:fixed; видимість залежить від JS, який резервує висоту на зовнішньому
 * <footer>-плейсхолдері. На частині шаблонів (page-hosting тощо) ця висота лишається 0 +
 * overflow:hidden → контент перекриває fixed-футер і він зникає. Робимо футер нормальним
 * блоком у потоці, щоб він завжди був видимий незалежно від JS. */
/* `body footer` (0,0,2) навмисно > `footer` (0,0,1): blog.css має `footer{height:606px!important}`
   (хардкод), який вантажиться після ui-fix.css і без вищої специфічності перебивав би наш height. */
body footer {
    height: auto !important;
    overflow: visible !important;
}

footer > .footer {
    position: relative !important;
    bottom: auto !important;
    opacity: 1 !important;
}

/* Прибрати reveal-«runway»: на home `.footer-container` отримує padding-top ≈100vh (для
   проявлення fixed-футера знизу). Зі static-футером це стає величезним порожнім блоком зверху.
   !important — джерело padding-top JS-залежне/умовне (тільки home), longhand перекриває все. */
footer > .footer .footer-container {
    padding-top: clamp(40px, 4vw, 72px) !important;
}