/* EUROPA SVET: перенесённые стили навигации и мегаменю */

/* Исходный блок 1; строки 88-1233 */

/* === ВЫПАДАЮЩЕЕ МЕНЮ === */
.es-mega-grid {
    /* Резервное число колонок; ниже переопределяется медиазапросами */
    grid-template-columns: repeat(5, 1fr) !important;
}


.es-mega-grid > .b-mega-menu__column-banner {
    display: block !important;
    grid-column: -2 / -1 !important; /* Жестко бросаем в последнюю правую колонку */
    grid-row: 1 / span 10 !important; /* Позволяем растягиваться вниз */
}

.b-nav-categories-01__dropdown-menu {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    padding-bottom: 24px !important;
}



/* 1. Жестко убиваем гигантский gap-6 между словами и выравниваем по центру */
.b-nav-categories-01 ul.gap-6,
ul:has(> .b-nav-categories__nav-item) {
    gap: 12px !important; 
    justify-content: center !important; 
}

/* 2. Настраиваем компактный шрифт для ссылок, убивая fs-md */
.b-nav-categories__nav-link,
.b-nav-categories__nav-link.nav-link {
    font-family: 'Outfit', 'Inter', sans-serif !important;
    font-size: 16px !important; 
    font-weight: 500 !important;
    letter-spacing: normal !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
}

/* === ИДЕАЛЬНЫЙ БАЛАНС МЕНЮ === */

/* 1. Увеличиваем расстояние МЕЖДУ соседними пунктами */
.b-nav-categories-01 ul.gap-6,
ul:has(> .b-nav-categories__nav-item) {
    gap: 16px !important; /* Было 10px, делаем чуть свободнее и просторнее */
}

/* 2. Настройки шрифта */
.b-nav-categories__nav-link,
.b-nav-categories__nav-link.nav-link {
    font-family: 'Outfit', 'Inter', sans-serif !important;
    font-size: 16px !important; 
    font-weight: 500 !important;
    letter-spacing: normal !important; /* Убрали микро-сплющивание букв */
    padding-left: 4px !important;
    padding-right: 4px !important;
}

/* 3. Аккуратное расстояние от слова до треугольничка */
.b-nav-categories__nav-link.gap-2,
.b-nav-categories__nav-link.d-flex {
    gap: 5px !important; /* Дали стрелочке воздуха */
}

/* 4. Отменяем жесткий наезд стрелочек на текст */
.b-nav-categories__nav-link i,
.b-nav-categories__nav-link .icon,
.b-nav-categories__nav-link::after {
    transform: none !important; /* Убрали сдвиг, который ломал верстку */
    margin-left: 0 !important;
}


.l-desktop-header-bottom {
    position: relative !important;
    z-index: 900 !important;
    background: linear-gradient(180deg, rgba(12,12,12,.95) 0%, rgba(5,5,5,.92) 48%, rgba(9,9,9,.95) 100%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(150%);
    backdrop-filter: blur(24px) saturate(150%);
    border-top: 1px solid rgba(255,255,255,.025) !important;
    border-bottom: 1px solid rgba(255,193,7,.14) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), inset 0 -1px 0 rgba(255,193,7,.05), 0 6px 28px rgba(0,0,0,.24);
}

.l-desktop-header-bottom__row {
    position: relative !important;
    z-index: 901 !important;
    overflow: visible !important;
}

.b-nav-categories {
    position: relative !important;
    z-index: 902 !important;
    isolation: isolate;
    overflow: visible !important;
}

.b-nav-categories > .navbar-nav {
    position: relative !important;
    z-index: 1104 !important;
    overflow: visible !important;
}

.b-nav-categories .dropdown-menu,
.b-nav-categories .b-nav-categories-01__dropdown-menu {
    z-index: 1500 !important;
}

.l-desktop-header-bottom,
.l-desktop-header-bottom__row,
.b-nav-categories,
.b-nav-categories > .navbar-nav,
.b-nav-categories__nav-item {
    overflow: visible !important;
}

.b-nav-categories .es-nav-liquid-glass {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    border-radius: 13px;
    background: radial-gradient(ellipse at 20% 12%, rgba(255,255,255,.075) 0%, rgba(255,255,255,0) 42%), radial-gradient(ellipse at 78% 95%, rgba(255,193,7,.10) 0%, rgba(255,193,7,0) 46%), linear-gradient(180deg, rgba(40,40,40,.48) 0%, rgba(15,15,15,.72) 46%, rgba(5,5,5,.78) 100%) !important;
    border: 1px solid rgba(255,193,7,.11) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.095), inset 0 -1px 0 rgba(255,193,7,.08), inset 0 0 20px rgba(255,255,255,.018), 0 10px 28px rgba(0,0,0,.28), 0 0 22px rgba(255,193,7,.035);
    -webkit-backdrop-filter: blur(18px) saturate(180%);
    backdrop-filter: blur(18px) saturate(180%);
    transform: translate3d(0,0,0) scale(.92);
    transform-origin: center center;
    transition: left .46s cubic-bezier(.22,1,.36,1), top .46s cubic-bezier(.22,1,.36,1), width .46s cubic-bezier(.22,1,.36,1), height .46s cubic-bezier(.22,1,.36,1), opacity .22s ease, transform .46s cubic-bezier(.22,1,.36,1);
}

.b-nav-categories .es-nav-liquid-glass::before {
    content: "";
    position: absolute;
    left: 8%;
    right: 8%;
    top: 1px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.08) 14%, rgba(255,255,255,.28) 43%, rgba(255,193,7,.16) 58%, rgba(255,255,255,.08) 78%, transparent 100%) !important;
    filter: blur(.15px);
    opacity: .9;
}

.b-nav-categories .es-nav-liquid-glass::after {
    content: "";
    position: absolute;
    width: 46%;
    height: 92%;
    right: -12%;
    top: 4%;
    border-radius: 999px;
    background: radial-gradient(ellipse at center, rgba(255,193,7,.13) 0%, rgba(255,193,7,.035) 34%, rgba(255,193,7,0) 72%) !important;
    filter: blur(10px);
    opacity: .75;
}

.b-nav-categories__nav-link {
    position: relative;
    z-index: 3;
    transition: color .22s ease, transform .32s cubic-bezier(.22,1,.36,1);
}

.b-nav-categories__nav-link:hover {
    transform: none !important;
}

.b-nav-categories__nav-link.es-nav-current::before {
    content: "";
    position: absolute;
    left: 5px;
    right: 5px;
    bottom: 3px;
    height: 2px;
    border-radius: 999px;
    background: #ffc107;
    box-shadow: 0 0 8px rgba(255,193,7,.42);
}

.b-nav-categories__nav-link:hover,
.b-nav-categories__nav-link.es-nav-hovered,
.b-nav-categories__nav-link[aria-current="page"],
.b-nav-categories__nav-item.active > .b-nav-categories__nav-link,
.b-nav-categories__nav-item.dropdown:hover > .b-nav-categories__nav-link {
    color: #ffc107 !important;
}

.b-nav-categories__nav-link:hover::before,
.b-nav-categories__nav-link.es-nav-hovered::before,
.b-nav-categories__nav-link[aria-current="page"]::before,
.b-nav-categories__nav-item.active > .b-nav-categories__nav-link::before,
.b-nav-categories__nav-item.dropdown:hover > .b-nav-categories__nav-link::before {
    content: "";
    position: absolute;
    left: 5px;
    right: 5px;
    bottom: 3px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255,193,7,0) 0%, rgba(255,193,7,.35) 14%, #ffc107 35%, #ffd54f 50%, #ffc107 65%, rgba(255,193,7,.35) 86%, rgba(255,193,7,0) 100%) !important;
    box-shadow: 0 0 7px rgba(255,193,7,.44), 0 0 16px rgba(255,193,7,.13);
}

.b-nav-categories.es-liquid-hover .b-nav-categories__nav-link:not(.es-nav-hovered):not(.es-nav-discount) {
    color: rgba(255,255,255,.86);
}

.b-nav-categories__nav-link.es-nav-discount {
    color: #ffc107 !important;
    text-shadow: 0 0 9px rgba(255,193,7,.08);
}

.b-nav-categories__nav-link.es-nav-discount:hover {
    color: #ffd54f !important;
}

@media (min-width: 768px) {
    .b-nav-categories__nav-item.dropdown > .dropdown-menu {
        position: absolute;
        pointer-events: auto;
    }
}

@media (max-width: 767.98px) {
    .b-nav-categories .es-nav-liquid-glass {
        display: none;
    }

    .b-nav-categories__nav-link:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .b-nav-categories .es-nav-liquid-glass,
    .b-nav-categories__nav-link {
        transition: none !important;
    }
}

/* ============================================================
 * ES_NAV_LIQUID_GLASS_DROPDOWN_REPAIR_V3
 * Restore native mega-menu geometry.
 * Only stacking order is controlled here.
 * ============================================================ */

@media (min-width: 768px) {

    .l-desktop-header-bottom {
        position: relative !important;
        z-index: 900 !important;
    }

    .l-desktop-header-bottom__row {
        position: relative !important;
        z-index: 1101 !important;
        overflow: visible !important;
    }

    .b-nav-categories {
        position: relative !important;
        z-index: 1102 !important;
        overflow: visible !important;
    }

    .b-nav-categories .dropdown-menu,
    .b-nav-categories .b-nav-categories-01__dropdown-menu {
        z-index: 1500 !important;
    }
}

/* ES_NAV_LIQUID_GLASS_DROPDOWN_REPAIR_V3 */


@media (min-width: 768px) {
    .b-nav-categories-01__dropdown-menu,
    .b-nav-categories-01__dropdown-menu *,
    .b-nav-categories-01__dropdown-menu .b-mega-menu {
        font-family: 'Montserrat', Arial, Helvetica, sans-serif !important;
        letter-spacing: -.008em;
    }

    .b-nav-categories-01__dropdown-menu a {
        font-weight: 500 !important;
    }

    .b-nav-categories-01__dropdown-menu img {
        box-sizing: border-box;
        border: 1px solid rgba(70,70,70,.16) !important;
        border-radius: 9px;
        background: #ffffff;
    }
}

@media (min-width: 768px) and (prefers-reduced-motion: reduce) {
    .b-nav-categories__nav-item.dropdown:hover
    > .b-nav-categories-01__dropdown-menu .b-mega-menu,
    .b-nav-categories__nav-item.dropdown:hover
    > .b-nav-categories-01__dropdown-menu .es-nav-polish-tail {
        animation: none !important;
    }
}

/* Исходный блок 2; строки 1608-1835 */

/* 1. Открытие меню по ховеру пункта и удержание при наведении на само меню */
.b-nav-categories__nav-item:hover > .b-nav-categories-01__dropdown-menu,
.b-nav-categories__nav-item.show > .b-nav-categories-01__dropdown-menu,
.b-nav-categories__nav-item.open > .b-nav-categories-01__dropdown-menu,
.b-nav-categories-01__dropdown-menu:hover {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* 2. Капсула: во всю ширину, темный фон, overflow: visible */
.b-nav-categories-01__dropdown-menu {
    top: 100% !important;
    margin-top: 8px !important;
    padding: 16px 18px 24px 18px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    background: linear-gradient(180deg, #1e2125 0%, #15171a 100%) !important;
    border: 1px solid rgba(255, 193, 7, 0.16) !important;
    border-radius: 14px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    z-index: 99999 !important;
    box-sizing: border-box !important;
}

/* 3. Невидимый мостик 30px с заходом на 16px вверх в панель меню */
.b-nav-categories-01__dropdown-menu::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: -24px !important;
    height: 30px !important;
    background: transparent !important;
    pointer-events: auto !important;
    z-index: 999999 !important;
}

.b-nav-categories-01__dropdown-menu .es-nav-polish-tail,
.b-nav-categories-01__dropdown-menu::after {
    display: none !important;
}

.b-mega-menu {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 4px !important;
    overflow: visible !important;
}

/* 4. Адаптивная сетка: 5 колонок ПК, 4 ноутбук, 3 планшет */
.b-mega-menu .es-mega-grid {
    display: grid !important;
    gap: 20px 14px !important;
    width: 100% !important;
    align-items: stretch !important;
    grid-auto-rows: 86px !important;
}

@media (min-width: 1360px) {
    .b-mega-menu .es-mega-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1024px) and (max-width: 1359.98px) {
    .b-mega-menu .es-mega-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1023.98px) {
    .b-mega-menu .es-mega-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

.b-mega-menu .es-mega-grid > .b-mega-menu__column,
.b-mega-menu .es-mega-grid > .b-mega-menu__column.d-flex {
    display: contents !important;
}

/* 5. Карточки фиксированной высоты 86px */
.b-mega-menu .b-mega-menu__column-item {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 86px !important;
    min-height: 86px !important;
    max-height: 86px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 8px 12px 8px 10px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

.b-mega-menu .b-mega-menu__column-item:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 193, 7, 0.4) !important;
    border-color: rgba(255, 193, 7, 0.45) !important;
}

/* 6. Неоновая золотая полоска СНИЗУ карточки НА ТЕМНОМ ФОНЕ */
.b-mega-menu .b-mega-menu__column-item::before {
    content: "" !important;
    position: absolute !important;
    left: 14px !important;
    right: 14px !important;
    bottom: -10px !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: linear-gradient(
        90deg,
        rgba(255, 193, 7, 0) 0%,
        rgba(255, 193, 7, 0.45) 15%,
        #ffc107 40%,
        #ffd54f 50%,
        #ffc107 60%,
        rgba(255, 193, 7, 0.45) 85%,
        rgba(255, 193, 7, 0) 100%
    ) !important;
    box-shadow:
        0 0 8px rgba(255, 193, 7, 0.75),
        0 0 18px rgba(255, 193, 7, 0.35) !important;
    opacity: 0 !important;
    transform: scaleX(0.6) !important;
    transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
    pointer-events: none !important;
    z-index: 10 !important;
}

.b-mega-menu .b-mega-menu__column-item:hover::before {
    opacity: 1 !important;
    transform: scaleX(1) !important;
}

.b-mega-menu .b-mega-menu__column-item > .d-flex {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    margin: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 10px !important;
}

.b-mega-menu .b-mega-menu__column-item a.link-emphasis {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100% !important;
    height: 100% !important;
    text-decoration: none !important;
    gap: 8px !important;
    color: #151515 !important;
    font-family: "Outfit", "Inter", sans-serif !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

/* 7. Крупные фото (58px) с зумом внутри плитки */


.b-mega-menu .b-mega-menu__column-item img,
.b-mega-menu--img {
    max-width: 58px !important;
    max-height: 58px !important;
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    object-fit: contain !important;
    border: none !important;
    background: transparent !important;
    flex-shrink: 0 !important;
    transition: transform 0.25s ease-out !important;
    will-change: transform !important;
}

.b-mega-menu .b-mega-menu__column-item:hover .b-mega-menu--img,
.b-mega-menu .b-mega-menu__column-item:hover img {
    transform: scale(1.09) !important;
}

/* 8. Золотистый треугольник без вылета за край */
.b-mega-menu .b-mega-menu__column-item a.link-emphasis::after {
    content: "▸" !important;
    color: #d8a63c !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    margin-left: auto !important;
    margin-right: 10px !important;
    padding-left: 6px !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

.b-mega-menu .b-mega-menu__column-item:hover a.link-emphasis::after {
    transform: translateX(2px) !important;
    color: #b88628 !important;
}

.b-mega-menu .b-mega-menu__column-item .link-gray {
    display: none !important;
}

