/**
 * Mobile ≤768px: хедер фиксирован сверху, при скролле вниз уезжает вверх (как нижняя навигация);
 * при скролле вверх снова появляется. Топбар в обычном потоке (не трогаем — меньше поломок).
 * body.mobile-chrome-menu-open — шторка открыта: хедер всегда виден (без transform, чтобы не ломать position:fixed у .bc-menu-mobile).
 */

@media (max-width: 768px) {
    html {
        --bc-mobile-header-h: 88px;
        --bc-mobile-chrome-top: 88px;
    }

    .bc_wrap {
        padding-top: var(--bc-mobile-chrome-top, 88px) !important;
    }

    /* Только хедер: без transform в покое — иначе ломается position:fixed у .bc-menu-mobile внутри */
    .bc_header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 10020 !important;
        margin: 0 !important;
        transform: none !important;
        transition: transform 0.28s ease, opacity 0.22s ease, visibility 0.22s ease !important;
        will-change: transform;
    }

    .mobile-bottom-nav {
        transform: translate3d(0, 0, 0) !important;
        transition: transform 0.26s ease, box-shadow 0.22s ease !important;
        will-change: transform;
    }

    body.mobile-chrome-scroll-hidden:not(.mobile-chrome-menu-open) .bc_header {
        transform: translate3d(0, -100%, 0) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.mobile-chrome-scroll-hidden:not(.mobile-chrome-menu-open) .mobile-bottom-nav {
        transform: translate3d(0, 110%, 0) !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }

    body.mobile-chrome-menu-open .bc_header {
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        max-height: none !important;
        height: auto !important;
        min-height: 0 !important;
    }

    body.mobile-chrome-scroll-hidden {
        padding-bottom: calc(8px + env(safe-area-inset-bottom, 0)) !important;
    }

    body.mobile-chrome-scroll-hidden .bc_wrap {
        margin-bottom: 8px !important;
    }

    body.mobile-chrome-menu-open .bc_header {
        overflow: visible !important;
    }
}

/*
 * Шторка: тема показывает её при max-width 1023px; mobile-header-fix вешает .bc_header * { display:none … }.
 * Инлайн display:none на шторке убран — правила ниже (как у header.css) + !important перебивают fix.
 */
@media (max-width: 1023px) {
    html body .bc_wrap .bc_header .bc-menu-mobile {
        display: flex !important;
        flex-direction: column !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: min(300px, 92vw) !important;
        height: 100vh !important;
        max-height: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        pointer-events: auto !important;
        z-index: 100050 !important;
        transform: translate3d(-105%, 0, 0) !important;
        transition: transform 0.3s ease, opacity 0.25s ease, visibility 0.25s ease !important;
    }

    html body .bc_wrap .bc_header .bc-menu-mobile.active {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}

@media (min-width: 1024px) {
    html body .bc_wrap .bc_header .bc-menu-mobile {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/*
 * Login / Register modal: Bootstrap .modal ~1050 must be above fixed header (10020) and drawer (100050).
 * This file loads after mobile-bottom-nav-active.css, so repeat the override here for reliable cascade.
 */
body.modal-open .bc_header {
    z-index: 1020 !important;
}

@media (max-width: 1023px) {
    body.modal-open html body .bc_wrap .bc_header .bc-menu-mobile {
        z-index: auto !important;
    }
}