/* ШАПКА (rf) — общий элемент всех страниц. Принята, работает без ?test.
   Верхняя полоса — зелёный градиент как в футере; ниже светлая строка
   лого (logo_white.png, тёмный) + поиск rf-search + корзина; меню rf-nav.
   Хуки, которые нельзя терять: #search input[name=search] + button,
   #cart > button + #cart > ul (common.js), .mobile_menu_button.
   Этап 3 (поп-ап корзины) и этап 4 (фикс-панель, мобильный дровер) — в плане.
   Старая шапка удалена 2026-08-23, top-account из _legacy.css убран. */

/* ===== Верхняя полоса ===== */
.rf-topbar {
    background: linear-gradient(135deg, #1a3324 0%, #2d6a3e 100%); /* --rf-accent-deep → --rf-accent */
    color: #fff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, sans-serif;
    font-size: 13px;
}

.rf-topbar__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 40px;
    padding: 4px 0;
}

.rf-topbar__left,
.rf-topbar__right {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.rf-topbar__tg {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 4px 12px 4px 8px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s, border-color .15s;
}

.rf-topbar__tg:hover,
.rf-topbar__tg:focus {
    background: rgba(255, 255, 255, .2);
    border-color: rgba(255, 255, 255, .35);
    color: #fff;
    text-decoration: none;
}

.rf-topbar__tg svg {
    width: 15px;
    height: 15px;
}

.rf-topbar__mail {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, .8);
    text-decoration: none;
    transition: color .15s;
}

.rf-topbar__mail:hover,
.rf-topbar__mail:focus {
    color: #fff;
}

.rf-topbar__mail svg {
    width: 14px;
    height: 14px;
    opacity: .8;
}

.rf-topbar__link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0;
    background: none;
    border: none;
    color: rgba(255, 255, 255, .8);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: color .15s;
}

.rf-topbar__link:hover,
.rf-topbar__link:focus,
.rf-topbar__link:focus:active {
    color: #fff;
}

.rf-topbar__link svg {
    width: 14px;
    height: 14px;
    opacity: .8;
}

.rf-topbar__caret {
    width: 12px !important;
    height: 12px !important;
}

.dropdown-menu.rf-topbar__menu {
    margin-top: 8px;
    min-width: 190px;
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 12px;
    box-shadow: 0 4px 8px rgba(15, 30, 18, .06), 0 12px 30px rgba(15, 30, 18, .08);
    padding: 6px;
}

.rf-topbar__menu li > a {
    display: block;
    padding: 8px 12px;
    border-radius: 8px;
    color: #1a1f1a; /* --rf-text */
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.rf-topbar__menu li > a:hover,
.rf-topbar__menu li > a:focus {
    background: #e8f3ec; /* --rf-accent-soft */
    color: #1f4a2c; /* --rf-accent-dark */
}

/* ===== Основная строка ===== */
.rf-header {
    background: #fff;
    border-bottom: 1px solid #e3e8e3; /* --rf-border */
}

.rf-header__row {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 0;
}

.rf-header__logo {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
}

.rf-header__logo img {
    display: block;
    width: 190px;
    height: auto;
}

.rf-header__search {
    flex: 1 1 auto;
    max-width: 620px;
    margin: 0 auto;
}

.rf-header__mobile {
    flex: 0 0 auto;
}

.rf-header__burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #fff;
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 10px;
    color: #1a1f1a; /* --rf-text */
    cursor: pointer;
}

.rf-header__burger svg {
    width: 20px;
    height: 20px;
}

.rf-header__cart {
    flex: 0 0 auto;
    min-width: 170px;
}

/* Лёгкий полиш старой кнопки корзины, скоуп под новую шапку
   (полноценный поп-ап корзины — отдельный этап) */
.rf-header__cart #cart > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    background: #2d6a3e; /* --rf-accent */
    border: 1px solid #2d6a3e;
    border-radius: 10px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    box-shadow: none;
    text-shadow: none;
}

.rf-header__cart #cart > .btn:hover,
.rf-header__cart #cart > .btn:focus,
.rf-header__cart #cart.open > .btn {
    background: #1f4a2c; /* --rf-accent-dark */
    color: #fff;
}

.rf-header__cart #cart > .btn .fa-shopping-cart {
    margin-right: 4px;
}

/* ===== Главное меню ===== */
.rf-nav {
    background: #fff;
    border-bottom: 1px solid #e3e8e3; /* --rf-border */
}

.rf-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 8px 0;
    list-style: none;
}

.rf-nav__item a {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 999px;
    color: #1a1f1a; /* --rf-text */
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s, color .15s;
}

.rf-nav__item a:hover,
.rf-nav__item a:focus {
    background: #e8f3ec; /* --rf-accent-soft */
    color: #1f4a2c; /* --rf-accent-dark */
}

/* ===== Поиск ===== */
.rf-search {
    display: flex;
    width: 100%;
}

.rf-search__input {
    flex: 1 1 auto;
    height: 44px;
    padding: 0 16px;
    background: #f6f8f6; /* --rf-surface */
    border: 1px solid #e3e8e3; /* --rf-border */
    border-right: none;
    border-radius: 10px 0 0 10px;
    font-size: 15px;
    color: #1a1f1a; /* --rf-text */
    box-shadow: none;
    outline: none;
    transition: background .15s, border-color .15s;
}

.rf-search__input::placeholder {
    color: #9aa49a; /* --rf-neutral-400 */
}

.rf-search__input:focus {
    background: #fff;
    border-color: #2d6a3e; /* --rf-accent */
}

.rf-search__btn {
    flex: 0 0 auto;
    width: 52px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #2d6a3e; /* --rf-accent */
    border: 1px solid #2d6a3e;
    border-radius: 0 10px 10px 0;
    color: #fff;
    cursor: pointer;
    transition: background .15s;
}

.rf-search__btn:hover,
.rf-search__btn:focus {
    background: #1f4a2c; /* --rf-accent-dark */
    color: #fff;
}

.rf-search__btn svg {
    width: 18px;
    height: 18px;
}

/* Кнопка профиля в основной шапке (только мобайл, иконка) */
.rf-header__profile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #fff;
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 10px; /* --rf-radius-sm */
    color: #1a1f1a; /* --rf-text */
    text-decoration: none;
    transition: border-color .15s, color .15s;
}

.rf-header__profile:hover,
.rf-header__profile:focus {
    border-color: #2d6a3e; /* --rf-accent */
    color: #1f4a2c; /* --rf-accent-dark */
}

.rf-header__profile svg {
    width: 18px;
    height: 18px;
}

/* ===== Адаптив ===== */
@media (max-width: 767px) {
    .rf-header__row {
        flex-wrap: wrap;
        gap: 12px;
        padding: 12px 0;
    }

    .rf-header__logo {
        order: 1;
    }

    .rf-header__logo img {
        width: 150px;
    }

    /* [лого] ..... [профиль] [корзина] [бургер], поиск — строкой ниже */
    .rf-header__profile {
        display: inline-flex !important; /* перекрыть hidden-xs */
        order: 2;
        margin-left: auto;
    }

    .rf-header__cart {
        order: 3;
        min-width: 0;
        margin-left: 0;
    }

    .rf-header__mobile {
        order: 4;
    }

    .rf-header__search {
        order: 5;
        flex-basis: 100%;
        max-width: none;
        margin: 0;
    }

    .rf-header__cart #cart > .btn {
        padding: 0 10px;
    }

    .rf-topbar__row {
        justify-content: center;
    }

    .rf-topbar__left {
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .rf-topbar__mail span {
        display: none;
    }

    .rf-header__logo img {
        width: 130px;
    }
}

/* ===== Перебивки старых правил темы (stylesheet.min.css) =====
   Старая тема стилизует #search (id — рамка, margin) и .mobile_menu_button
   (margin) глобально; её id-специфичность выше классов .rf-search/.rf-header__burger,
   поэтому перебиваем явно. */
#search.rf-search,
#search.rf-search:hover {
    margin: 0;
    border: none;
    border-radius: 0;
}

.rf-header .mobile_menu_button {
    margin: 0;
    overflow: visible;
}

.rf-header .mobile_menu_button:hover {
    background: none;
}

/* ===== ФИКС-ПАНЕЛЬ при скролле (rf, ?test) =====
   Появление/скрытие — старый механизм common.js (.fixed-topbar + .is-active).
   ПК: лого + ссылки верхней панели + менеджер + профиль + корзина.
   Мобайл: лого + TG + бургер (каталог/поиск убраны по постановке). */
.rf-fixedtop__row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 0;
}

.rf-fixedtop__logo {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
}

.rf-fixedtop__logo img {
    width: 104px;
    height: auto;
    display: block;
}

.rf-fixedtop__nav {
    flex: 1 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
}

.rf-fixedtop__nav a {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    color: #1a1f1a; /* --rf-text */
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s, color .15s;
}

.rf-fixedtop__nav a:hover,
.rf-fixedtop__nav a:focus {
    background: #e8f3ec; /* --rf-accent-soft */
    color: #1f4a2c; /* --rf-accent-dark */
}

.rf-fixedtop__tg {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px 8px 11px;
    background: linear-gradient(135deg, #1a3324 0%, #2d6a3e 100%);
    border-radius: 999px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.rf-fixedtop__tg:hover {
    color: #fff;
    opacity: .92;
}

.rf-fixedtop__tg svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.rf-fixedtop__profile {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 13px;
    background: #fff;
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 999px;
    color: #1a1f1a; /* --rf-text */
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: border-color .15s, color .15s;
}

.rf-fixedtop__profile:hover {
    border-color: #2d6a3e; /* --rf-accent */
    color: #1f4a2c; /* --rf-accent-dark */
}

.rf-fixedtop__profile svg {
    width: 14px;
    height: 14px;
}

.rf-fixedtop__cart {
    flex: 0 0 auto;
    min-width: 0; /* сброс 170px из rf-header__cart */
}

/* бургер в фикс-панели (только мобайл, обёртка visible-xs) */
.rf-fixedtop__burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    background: #fff;
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 10px;
    color: #1a1f1a;
    cursor: pointer;
}

.rf-fixedtop__burger svg {
    width: 19px;
    height: 19px;
}

/* Панель на мобиле: старая тема держит её за экраном до 768px — включаем */
.fixed-topbar.rf-fixedtop.is-active {
    transform: translateY(0);
    visibility: visible;
    opacity: 1;
}

@media (max-width: 767px) {
    .rf-fixedtop__row {
        gap: 10px;
        padding: 7px 0;
    }

    .rf-fixedtop__logo img {
        width: 88px;
    }

    /* Раскладка: [лого] [TG] [——— spacer ———] [корзина] [бургер].
       Всем элементам явные order, spacer — flex-заполнитель между блоками. */
    .rf-fixedtop__logo {
        order: 1;
    }

    .rf-fixedtop__tg {
        order: 2;
        margin-left: 0;
        padding: 9px;
    }

    .rf-fixedtop__spacer {
        order: 3;
        flex: 1 1 auto;
        display: block !important; /* перекрыть возможные скрытия */
    }

    /* профиль — иконка, перед корзиной */
    .rf-fixedtop__profile {
        order: 4;
        padding: 8px 10px;
    }

    .rf-fixedtop__cart {
        order: 5;
        flex: 0 0 auto;
        margin-left: 0;
    }

    .rf-fixedtop__cart #cart > .btn {
        height: 40px;
    }

    .rf-fixedtop__mobilewrap {
        order: 6;
        margin-left: 0;
        display: inline-flex !important; /* перекрыть visible-xs при показе панели */
    }
}

/* ===== МОБИЛЬНОЕ МЕНЮ-дровер (rf, ?test) =====
   Выезд/скрытие — старый механизм (.mobile_menu + .show, common.js). */
.rf-mmenu {
    width: 300px;
    display: flex;
    flex-direction: column;
    z-index: 10001; /* выше фикс-панели (9999), ниже поп-апа корзины (10050) */
}

.rf-mmenu__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 16px 12px;
    border-bottom: 1px solid #e3e8e3; /* --rf-border */
}

.rf-mmenu__logo {
    padding: 0;
}

.rf-mmenu__logo img {
    width: 130px;
    height: auto;
    display: block;
}

.rf-mmenu__close {
    display: inline-flex;
    padding: 0;
}

.rf-mmenu__close .menu_close_icon {
    float: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 10px;
}

.rf-mmenu__close .menu_close_icon svg {
    width: 18px;
    height: 18px;
    color: #5a655a; /* --rf-text-muted */
}

.rf-mmenu__nav {
    padding: 8px 10px 4px;
}

.rf-mmenu__title {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #9aa49a; /* --rf-neutral-400 */
    margin: 0;
    padding: 0 10px;
    line-height: 1.6;
}

.rf-mmenu__list {
    margin: 0;
}

.rf-mmenu__list > li > a,
.rf-mmenu__parent > a {
    display: block;
    padding: 11px 10px;
    border-radius: 10px;
    color: #1a1f1a; /* --rf-text */
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}

.rf-mmenu__list > li > a:hover,
.rf-mmenu__list > li > a:focus {
    background: #e8f3ec; /* --rf-accent-soft */
    color: #1f4a2c; /* --rf-accent-dark */
}

/* Категория с детьми: строка + шеврон-кнопка раскрытия (.open_cat — хук common.js) */
.rf-mmenu__parent {
    display: flex;
    align-items: center;
    gap: 4px;
}

.rf-mmenu__parent > a {
    flex: 1 1 auto;
    min-width: 0;
}

.rf-mmenu__open {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    cursor: pointer;
    transition: transform .2s, background .15s;
}

.rf-mmenu__open:hover {
    background: #f1f3f1; /* --rf-neutral-100 */
}

.rf-mmenu__open svg {
    width: 16px;
    height: 16px;
    color: #5a655a; /* --rf-text-muted */
    transition: transform .2s; /* как в сайдбаре */
}

/* common.js вешает .mobile_close_cat на кнопку при раскрытии — крутим шеврон */
.rf-mmenu__open.mobile_close_cat svg {
    transform: rotate(180deg);
}

.rf-mmenu__sub {
    display: none;
    margin: 0 0 4px 14px;
    padding: 0 0 0 12px !important;
    border-left: 2px solid #e3e8e3; /* --rf-border */
}

.rf-mmenu__sub a {
    display: block;
    padding: 8px 10px;
    border-radius: 8px;
    color: #5a655a; /* --rf-text-muted */
    font-size: 14px;
    text-decoration: none;
}

.rf-mmenu__sub a:hover {
    color: #1a1f1a;
}

/* Футер дровера: Telegram-CTA */
.rf-mmenu__foot {
    margin-top: auto;
    padding: 16px;
    border-top: 1px solid #e3e8e3; /* --rf-border */
}

/* Скоуп .rf-mmenu: иначе перебивает старое .mobile_menu a (display:block,
   uppercase, line-height:40 — из-за них кнопка «ломалась»). Иконка слева, текст справа. */
.rf-mmenu .rf-mmenu__tg {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 11px;
    padding: 14px 16px;
    line-height: 1.35;
    background: linear-gradient(135deg, #1a3324 0%, #2d6a3e 100%);
    border-radius: 10px; /* --rf-radius-sm */
    color: #fff;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
    text-transform: none;
}

.rf-mmenu .rf-mmenu__tg:hover,
.rf-mmenu .rf-mmenu__tg:focus {
    background: linear-gradient(135deg, #1a3324 0%, #2d6a3e 100%);
    color: #fff;
    opacity: .92;
}

.rf-mmenu .rf-mmenu__tg svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin: 0;
    display: block;
}

/* Старые стили list/подменю из sass не должны мешать */
.rf-mmenu .mobile_main_menu li a,
.rf-mmenu .mobile_cats_menu li a {
    line-height: 1.4;
}

/* ===== Дровер: перекрытия старых стилей меню из sass ===== */
.rf-mmenu li {
    line-height: normal;
    border-top: none;
}

.rf-mmenu a {
    text-transform: none;
}

.rf-mmenu .mobile_menu_sidebar_sub a:before {
    content: none;
}

.rf-mmenu .mobile_parent_cat .mobile_open_cat {
    position: static;
    width: 34px;
    height: 34px;
    border-left: none;
    text-align: center;
    background: none;
}

/* ===== Оверлей мобильного дровера (как у поп-апа корзины) ===== */
.rf-mmenu-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15, 30, 18, .55);
    backdrop-filter: blur(2px);
    z-index: 10000; /* ниже дровера (10001), выше фикс-панели (9999) */
}

.rf-mmenu-overlay.open {
    display: block;
    animation: rf-mmenu-fade .2s ease;
}

@keyframes rf-mmenu-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Дровер: первый пункт — профиль/вход */
.rf-mmenu__profile > a {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 12px !important;
    background: #f6f8f6; /* --rf-surface */
    border: 1px solid #e3e8e3; /* --rf-border */
    border-radius: 10px;
    font-weight: 700;
}

.rf-mmenu__profile > a:hover,
.rf-mmenu__profile > a:focus {
    background: #e8f3ec; /* --rf-accent-soft */
    border-color: #2d6a3e;
    color: #1f4a2c;
}

.rf-mmenu__profile > a svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    color: #2d6a3e;
}