/* ============================ АДАПТИВ ШАПКИ =============================== */
/* ≤781: строка шапки переносит элементы, поиск на всю ширину — убирает
 * горизонтальный скролл (правый блок иконок больше не выталкивается за край). */
@media (max-width: 781px) {
    /* основная строка (лого · поиск · иконки) — разрешаем перенос */
    .wp-block-template-part .wp-block-group.is-content-justification-space-between.is-nowrap,
    .wp-block-template-part .alignwide.is-content-justification-space-between {
        flex-wrap: wrap !important;
        row-gap: 12px;
    }
    /* поиск — на всю ширину, отдельной строкой */
    .wp-block-template-part .wp-block-search {
        order: 3;
        flex-basis: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    .wp-block-template-part .wp-block-search .wp-block-search__input { width: 100%; }
    /* телефонный блок в основной шапке — скрыт на мобиле (по макету) */
    .rv-header-phone { display: none !important; }
}
/* ≤679: WordPress переключает навигацию на бургер. Контейнер нельзя делать
 * прокручиваемым: overflow обрезает fixed-оверлей мобильного меню. */
@media (max-width: 679px) {
    .rv-navbar .alignwide { overflow: visible; }
    .rv-navbar .wp-block-navigation { flex-wrap: nowrap; }
    .rv-navbar .rv-nav-kp a,
    .rv-navbar .wp-block-navigation a { white-space: nowrap; }
    /* тач-таргет бургера ≥44px (макет: 44×44) */
    .rv-navbar .wp-block-navigation__responsive-container-open {
        min-width: 44px;
        min-height: 44px;
        padding: 10px;
        color: #fff;
    }
}

/* rv:critical-end — TASK-008: выше этой строки стили шапки/бургера, которые
 * входят в инлайновый критический CSS карточки товара (inc/performance.php);
 * оверлей меню ниже раскрывается только по клику и приезжает с полным CSS. */

/* ===================== МОБИЛЬНОЕ БУРГЕР-МЕНЮ (оверлей) =====================
 * По макету (README): раскрывается вертикальным списком на тёмно-синем фоне
 * (#0E3A63 brand-hover), пункты белые, разделители #1C4066. Чинит: белый
 * нечитаемый оверлей, прижатые к левому краю пункты, мелкие тач-таргеты,
 * просвечивание контента страницы (stacking-context ловушка scroll-reveal).
 */

/* (г) Stacking-context: .scroll-reveal--visible оставлял transform:translateY(0)
 * (identity, но всё равно создаёт stacking context) → карточки страницы рисовались
 * ПОВЕРХ оверлея. Даём шапке собственный stacking context с высоким z-index —
 * тогда fixed-оверлей меню (её потомок) всегда над контентом страницы. */
.wp-site-blocks > header,
header.wp-block-template-part {
    position: relative;
    z-index: 1000;
}

/* Оверлей открытого меню — только когда реально открыт (is-menu-open). */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open {
    background: var(--rv-brand-hover) !important; /* тёмно-синий фон, как в макете */
    z-index: 100000;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content {
    padding: 64px 0 24px !important; /* горизонтальный отступ — на самих пунктах */
    width: 100%;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container {
    width: 100%;
    gap: 0 !important;
    flex-direction: column;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item {
    width: 100%;
    position: relative;
}

/* (в/г) СБРОС протёкших десктопных декораций навигации внутри оверлея:
 *  - вертикальные разделители item+item::before (белые чёрточки слева),
 *  - анимированная синяя черта-подчёркивание __content::after,
 *  - фон-плашка/box-shadow/скругление первого пункта «кнопка КАТАЛОГ»,
 *  - hover/current-подсветка.
 * В оверлее пункты — плоский вертикальный список по макету. */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item::before,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content::after {
    content: none !important;
    display: none !important;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item:first-child > .wp-block-navigation-item__content,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    transform: none !important;
}

/* (а) читаемые пункты: белый текст, крупнее; (в) тач-таргеты, разделитель — на всю ширину */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open a,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.3;
    display: flex !important;
    align-items: center;
    width: 100%;
    min-height: 52px;
    box-sizing: border-box;
    padding: 14px 24px !important;
    text-transform: none !important;
    letter-spacing: 0.01em !important;
    border-bottom: 1px solid var(--rv-border-dark); /* разделители #1C4066 на всю ширину */
}
/* (б) активным выглядит ТОЛЬКО реально текущий раздел — приглушённый акцент,
 * без посторонней черты (её убрали выше). */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
    color: var(--rv-accent-soft) !important;
    font-weight: 700 !important;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open a:hover {
    color: var(--rv-accent-soft) !important;
    background: rgba(255, 255, 255, 0.04) !important;
}

/* (а) фокус-ринг ТОЛЬКО для клавиатуры: авто-фокус модалки/мышь не рисуют рамку.
 * Сбрасываем :focus-outline, оставляем видимый только на :focus-visible. */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content:focus,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    a:focus {
    outline: none !important;
    box-shadow: none !important;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content:focus-visible,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    a:focus-visible {
    outline: 2px solid var(--rv-accent-soft) !important;
    outline-offset: -2px;
    border-radius: 2px;
}
/* пока в меню не было клавиатурного ввода (открыто кликом/тачем) — ринг не рисуем,
 * даже если браузер поставил :focus-visible на авто-фокус первого пункта. */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open.rv-menu-no-kbd
    .wp-block-navigation-item__content:focus-visible,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open.rv-menu-no-kbd
    a:focus-visible,
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open.rv-menu-no-kbd
    .wp-block-navigation-item__content:focus {
    outline: none !important;
}

/* (д) низ оверлея: телефон + CTA «Заявка на КП» (композиция, чтобы не было пустоты).
 * Вставляется JS'ом (nav-mobile.js) как .rv-mobmenu-cta в контейнер навигации,
 * который WP держит в DOM ВСЕГДА (и в десктопном состоянии). Поэтому по умолчанию
 * блок СКРЫТ, показываем ТОЛЬКО внутри реально открытого мобильного оверлея. */
.rv-mobmenu-cta { display: none !important; }
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open .rv-mobmenu-cta {
    display: flex !important;
    margin-top: 8px;
    padding: 20px 24px 0;
    flex-direction: column;
    gap: 12px;
}
.rv-mobmenu-cta__phone {
    color: #fff !important;
    font-size: 20px;
    font-weight: 800;
    text-decoration: none;
    letter-spacing: 0.01em;
}
.rv-mobmenu-cta__hours { color: var(--rv-on-dark, #B8C6D6); font-size: 13px; margin-top: -6px; }
.rv-mobmenu-cta__kp {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 20px;
    background: var(--rv-accent);
    color: #fff !important;
    font-size: 15px;
    font-weight: 700;
    border-radius: var(--rv-radius);
    text-decoration: none;
}
.rv-mobmenu-cta__kp:hover { background: var(--rv-accent-hover); }
.rv-mobmenu-cta__kp:active { background: var(--rv-accent-active); }

/* (5) бейдж/иконки корзины и аккаунта из шапки не всплывают над оверлеем меню.
 * badge — position:absolute z-index:1 в своём стек-контексте, из-за чего «1»/«6»
 * протекали поверх тёмного оверлея. Пока меню открыто — прячем иконки шапки. */
header:has(.wp-block-navigation__responsive-container.is-menu-open)
    .wp-block-woocommerce-mini-cart,
header:has(.wp-block-navigation__responsive-container.is-menu-open)
    .wc-block-mini-cart,
header:has(.wp-block-navigation__responsive-container.is-menu-open)
    .wp-block-woocommerce-customer-account {
    visibility: hidden;
}


/* (в) кнопка закрытия — крупный тач-таргет с отступом от угла */
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-close {
    top: 12px;
    right: 12px;
    width: 44px;
    height: 44px;
    padding: 10px;
    color: #fff;
}
.rv-navbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-close svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}