/* Google Font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* Change the header font */
header.site-header {
    font-family: 'Poppins', sans-serif !important;
}

.site-header.scrolled {
    background-color: #F4EDE5 !important;
}

header.site-header.site-header--filled {
    background: #F4EDE5 !important;
}

/* Change the header bg color at different states */
header.mega-menu-open.site-header.site-header--filled {
    background: #F4EDE5 !important;
}

/* header.site-header.site-header--filled {
    background: #FDF8F4 !important;
} */

header.header-top-open.site-header.site-header--inverted {
    background: #F4EDE5 !important;
}

.site-header .navbar .site-header-action .user-icon .cart-user-name {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
}

header.mega-menu-open.site-header.site-header--inverted {
    background: #F4EDE5 !important;
}

.site-header.header-hover-active.site-header--inverted {
    background-color: #F4EDE5 !important;
}

.site-header.header-hover-active.site-header--inverted .primary-menu .menu>li>a {
    color: #000 !important;
}

.navigation .primary-menu li:hover>a {
    color: #7e967c !important;
}


.site-header .l-megamenu--dark {
    display: none !important;
}

.site-header.mega-menu-open .l-inverted--dark-desktop {
    display: none !important;
}

.site-header.mega-menu-open .l-megamenu--dark {
    display: block !important;
}

.site-header--inverted.header-top-open .l-inverted--dark-logo {
    display: block !important;
}

.site-header--inverted.site-header.header-top-open .mb-logo-inverted--active {
    display: none !important;
}

.navigation .primary-menu>.menu>li>a {
    letter-spacing: 0.2rem !important;

}

.navigation .primary-menu .menu-depth-1>li>a {
    letter-spacing: 0.15rem !important;
}

.l-inverted--dark-logo {
    display: none !important;
}

.active-logo {
    display: block !important;
}

.l-inverted--dark-logo.active-logo {
    display: block !important;
}

.inactive-logo {
    display: none !important;
}

.site-header .site-header-menu {
    align-items: center !important;
}

@media (min-width: 1200px) {
    .site-header .site-header-menu {
        align-items: stretch !important;
    }

    .navigation .site-header-menu .site-header-menu__item .primary-menu {
        height: 100% !important;
    }

    .navigation .site-header-menu .site-header-menu__item .primary-menu ul {
        height: 100% !important;
    }

    .navigation .primary-menu li {
        margin-right: 24px !important;
        font-size: 14px !important;
        /* height: 100% !important; */
    }

    .navigation .primary-menu a {
        padding: 2rem 0 !important;
    }
}

@media (min-width: 1400px) {
    .navigation .primary-menu li {
        /* margin-right: 24px !important; */
        font-size: 16px !important;
    }
}


/* Ensure it respects desktop breakpoint */
@media (min-width: 1200px) {
    .site-header--inverted.mega-menu-open .primary-menu ul li>a {
        color: #000 !important;
    }

    .site-header--inverted.mega-menu-open .primary-menu ul li>a:hover {
        color: #7e967c !important;
    }

    .navigation.mega-menu-open .primary-menu>.menu>li.menu-item-has-children:hover {
        /* background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_936_4193)'%3E%3Cpath d='M16.59 8.59L12 13.17L7.41 8.59L6 10L12 16L18 10L16.59 8.59Z' fill='%237E967C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_936_4193'%3E%3Crect width='24' height='24' fill='%23FDF8F4'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") !important; */
        background-image: none !important;
    }

    .site-header.mega-menu-open .l-megamenu--dark {
        display: block !important;
    }

    .site-header.mega-menu-open .l-inverted--dark-desktop {
        display: none !important;
    }

    .navigation .primary-menu li.menu-item-has-children {
        background-image: none !important;
        padding-right: 0 !important;
    }
}


@media (min-width: 1200px) {
    .navigation .primary-menu li.menu-item-has-children:hover {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_936_4193)'%3E%3Cpath d='M16.59 8.59L12 13.17L7.41 8.59L6 10L12 16L18 10L16.59 8.59Z' fill='%237e967c'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_936_4193'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }
}

@media (min-width: 1200px) {

    .navigation .primary-menu li.menu-item-has-children.current-menu-ancestor,
    .navigation .primary-menu li.menu-item-has-children.current-menu-item,
    .navigation .primary-menu li.menu-item-has-children.current-menu-parent {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_936_4193)'%3E%3Cpath d='M16.59 8.59L12 13.17L7.41 8.59L6 10L12 16L18 10L16.59 8.59Z' fill='%237e967c'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_936_4193'%3E%3Crect width='24' height='24' fill='%23F4EDE5'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") !important;
    }
}

.navigation .primary-menu .current-menu-ancestor>a,
.navigation .primary-menu .current-menu-item>a,
.navigation .primary-menu .current_page_ancestor>a,
.navigation .primary-menu .current_page_item>a {
    color: #7e967c !important;
}

.site-header .navbar.desktop-menu {
    align-items: stretch !important;
}

.site-header .navbar .site-header-action a.btn.btn-outline-primary.btn-custom-outline-primary {
    font-weight: 600 !important;
    background-color: transparent !important;
    color: #7e967c !important;
    border-color: #7e967c !important;
    /* border: 0.0625rem solid #7e967c !important; */
}

.site-header .navbar .site-header-action a.btn.btn-primary.btn-custom-outline-primary:hover {
    color: #7e967c !important;
    border: 0.0625rem solid #7e967c !important;
}

.mega-menu-btn.btn-primary.btn-custom-primary-filled {
    border: none !important;
    box-shadow: none !important;
}

.mega-menu-btn.btn-primary.btn-custom-primary-filled>a {
    font-weight: 600 !important;
    background-color: #7e967c !important;
    color: #fff !important;
    border-color: #7e967c !important;
    border: 0.0625rem solid #7e967c !important;
}


/* Target the top level menu item */
/* .site-header-menu__item .primary-menu>.menu>li.menu-item.menu-item-has-children.has-mega {} */

/* Mega menu Desktop */
@media (min-width: 1200px) {
    .bendo-megamenu {
        background: #F4EDE5 !important;
        border-bottom-left-radius: 24px;
        position: fixed;
        top: 116.97px;
        display: none;
        left: 50%;
        transform: translateX(-50%);
        border-bottom-right-radius: 24px;
        box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.15);
    }

    .logged-in .site-header .bendo-megamenu {
        top: 148.99px !important;
    }
}

.bendo-megamenu .main-ul-wrap {
    display: flex;
    flex-wrap: wrap;
    box-shadow: unset;
    border-bottom: unset;
}

.bendo-megamenu .main-ul-wrap.menu-depth-1 li {
    max-width: 320px;
    margin-right: 56px;
}

.bendo-megamenu .main-ul-wrap.menu-depth-1 li.current-menu-item>a {
    color: var(--primary-color) !important;
}

@media (min-width: 1200px) {
    .bendo-megamenu .main-ul-wrap.menu-depth-1.open-menu {
        height: auto !important;
    }
}

@media (min-width: 1200px) {
    .bendo-megamenu .main-ul-wrap+.menu-item {
        width: auto;
    }

    .bendo-megamenu .main-ul-wrap .menu-item-has-children>a {
        font-size: 20px;
        font-weight: 600 !important;
    }
}

.bendo-megamenu .main-ul-wrap>li {
    width: auto;
    background-image: unset !important;
}

.bendo-megamenu .main-ul-wrap>li ul {
    box-shadow: unset;
    border-bottom: unset;
}

@media (min-width: 1200px) {
    .bendo-megamenu .main-ul-wrap .menu-depth-2 {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        column-gap: 55px;
        padding-top: 0;
        row-gap: 0;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li {
        width: auto;
    }
}

.bendo-megamenu .nav-menu {
    position: unset !important;
    box-shadow: unset !important;
    background: transparent !important;
    row-gap: unset !important;
}

@media (min-width: 1200px) {}

/* 1. Show the mega panel on depth-0 hover (desktop only) */
@media (min-width: 1200px) {

    .primary-menu>ul>li.menu-item-has-children:hover>.bendo-megamenu,
    .primary-menu>ul>li.menu-item-has-children.mega-open>.bendo-megamenu {
        display: block !important;
    }

    /* 2. The inner .main-ul-wrap.menu-depth-1 must always be visible on desktop
        (it's height:0/overflow:hidden for mobile accordion — override that) */
    .bendo-megamenu .main-ul-wrap.menu-depth-1 {
        display: flex !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* 3. Keep panel open when cursor moves into it */
    .bendo-megamenu:hover {
        display: block !important;
    }
}

/* =============================================
   DESCRIPTION PATCH — add after megamenu CSS
   ============================================= */

/* Anchor wraps title + desc vertically */
.bendo-megamenu .main-ul-wrap.menu-depth-1 li>a {
    display: flex;
    flex-direction: column;
    gap: 2px !important;
}

/* All anchors get the mega-title span now —
   style it consistently across all depths */
.bendo-megamenu .main-ul-wrap.menu-depth-1 li>a .mega-title {
    display: block !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #2a2a2a !important;
    line-height: 1.3 !important;
    transition: color 0.2s ease !important;
}

.site-header.header-top-open .primary-menu>ul>li:has(>.open-menu)>a>span.mega-title,
.site-header.header-top-open .primary-menu ul.menu-depth-1>li:has(>.open-menu)>a>span.mega-title,
.site-header.header-top-open .primary-menu ul.menu-depth-2>li:has(>.open-menu)>a>span.mega-title {
    color: #7e967c !important;
}

/* .bendo-megamenu .main-ul-wrap.menu-depth-2 li:has(>.open-menu) {} */

/* Grey description line — only shows when description is filled in WP */
.bendo-megamenu .main-ul-wrap.menu-depth-1 li>a .mega-desc {
    display: block;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #212121;
    line-height: 1.5;
}

/* Hover colour */
.bendo-megamenu .main-ul-wrap.menu-depth-1 li>a:hover .mega-title {
    color: #7e967c !important;
}

.site-header.header-top-open .primary-menu ul li:hover>span.mob-chevron {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

/* =============================================
   MEGA MENU — Layout & Design Consistency Patch
   Add after all existing megamenu CSS
   ============================================= */

@media (min-width: 1200px) {

    /* ── Outer panel ────────────────────────────── */
    .bendo-megamenu {
        padding: 36px 40px;
    }

    /* ── Column row — auto-fit grid ─────────────── */
    /* Columns adjust automatically when WP menu items
     are added or removed. Each column is equal width
     and stretches to the tallest sibling. */
    .bendo-megamenu .main-ul-wrap.menu-depth-1 {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        grid-auto-rows: 1fr;
        /* all rows same height    */
        align-items: stretch;
        /* columns fill full height */
        gap: 0;
        height: auto !important;
        overflow: visible !important;
    }

    /* ── Each depth-1 li = one column ───────────── */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li {
        display: flex;
        flex-direction: column;
        /* padding: 0 36px 0 0; */
        /* margin: 0 36px 0 0 !important; */
        /* border-right: 1px solid #ececec; */
        max-width: unset !important;
        /* override existing max-width:320px */
        width: auto !important;
        background: none !important;
    }

    .bendo-megamenu .main-ul-wrap.menu-depth-1>li:last-child {
        padding-right: 0;
        margin-right: 0 !important;
        border-right: none;
    }

    /* ── Depth-1 anchor = column heading ────────── */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>a {
        display: block !important;
        /* heading is NOT flex column */
        flex-direction: unset !important;
        gap: 0 !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        letter-spacing: 0.18rem !important;
        text-transform: uppercase !important;
        color: #2a2a2a !important;
        padding: 0 0 14px 0 !important;
        /* margin-bottom: 14px !important; */
        /* border-bottom: 1px solid #ececec !important; */
        cursor: pointer;
        white-space: nowrap;
    }

    /* heading has no desc span so hide just in case */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>a .mega-desc {
        display: none !important;
    }


    /* ── Depth-2 ul = items inside a column ─────── */
    .bendo-megamenu .main-ul-wrap .menu-depth-2 {
        display: flex !important;
        flex-direction: column !important;
        flex: 1;
        /* stretch to column height */
        flex-wrap: nowrap !important;
        column-gap: unset !important;
        padding-top: 0 !important;
        row-gap: 0 !important;
        height: auto !important;
        overflow: visible !important;
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }


    /* ── Each depth-2 li ─────────────────────────── */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li {
        padding: 0 !important;
        margin: 0 0 18px 0 !important;
        border: none !important;
        width: 100% !important;
        position: static !important;
    }



    .bendo-megamenu .main-ul-wrap .menu-depth-2>li:last-child {
        margin-bottom: 0 !important;
    }

    /* ── Depth-2 anchor ──────────────────────────── */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a {
        display: flex !important;
        flex-direction: column !important;
        gap: 3px !important;
        padding: 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a .mega-title {
        font-weight: 500 !important;
        font-size: 14px !important;
        color: #2a2a2a !important;
        line-height: 1.3 !important;
        letter-spacing: 0 !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a .mega-desc {
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #888 !important;
        line-height: 1.5 !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a:hover .mega-title {
        color: #7e967c !important;
    }

    /* ── mega-badge: green pill on a depth-1 heading  ─
     Add CSS class  mega-badge  to the depth-1 menu
     item in WP Appearance → Menus                  */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.mega-badge>a {
        border-bottom: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 14px !important;
    }

    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.mega-badge>a::before {
        content: attr(data-heading);
        display: inline-block;
        background: #7e967c;
        color: #fff;
        /* font-size: 10px; */
        /* font-weight: 600; */
        /* letter-spacing: 0.18rem; */
        text-transform: uppercase;
        padding: 3px 11px;
        border-radius: 20px;
        /* line-height: 1.7; */
    }

    /* ── mega-featured: bordered card at top of col ─
     Add CSS class  mega-featured  to a depth-2 li  */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-featured {
        margin-bottom: 20px !important;
        padding-bottom: 20px !important;
        border-bottom: 1px solid #ececec !important;
    }

    /* ── mega-simple: "—" link row ──────────────────
     Add CSS class  mega-simple  to a depth-2 li    */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-simple>a {
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        /* font-size: 13px !important; */
        /* font-weight: 600 !important; */
        color: #2a2a2a !important;
        /* padding: 8px 0 !important; */
        border-bottom: 1px solid #f0f0f0 !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-simple>a::after {
        content: "→";
        color: #aaa;
        font-size: 12px;
        flex-shrink: 0;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-simple>a .mega-title {
        font-weight: 400 !important;
        font-size: 14px !important;
        color: #2a2a2a !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-simple>a:hover .mega-title {
        color: #7e967c !important;
    }

    /* ── mega-cta: green button ──────────────────────
     Add CSS class  mega-cta  to a depth-2 li        */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-cta {
        margin-top: 24px !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-cta>a {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        padding: 11px 22px !important;
        background: #7e967c !important;
        border: 2px solid #7e967c !important;
        border-radius: 6px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        letter-spacing: 0.1em !important;
        text-transform: uppercase !important;
        transition: background 0.2s ease, color 0.2s ease !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-cta>a .mega-title {
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #fff !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-cta>a:hover {
        background: #fff !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-cta>a:hover .mega-title {
        color: #7e967c !important;
    }

}


.bendo-megamenu__wrap {
    display: flex;
    flex-direction: row;
    gap: 80px;
}

.bendo-megamenu__wrap .bendo-megamenu__menucolumns {
    flex: 2;
}

.bendo-megamenu__wrap .bendo-megamenu__customcolumn {
    flex: 1;
}

.bendo-megamenu__menucolumns .nav-menu.sub-menu {
    column-gap: 80px !important;
}

.site-header-menu__item .primary-menu>ul>li>a>span,
.site-header-menu__item .primary-menu>ul>li ul.menu-depth-1>li>a>span {
    position: relative !important;
}

/* .site-header-menu__item .primary-menu>ul>li.current-menu-item>a>span::after,
.site-header-menu__item .primary-menu>ul>li.current-menu-ancestor>a>span::after,
.site-header-menu__item .primary-menu>ul>li.current-menu-parent>a>span::after,
.site-header-menu__item .primary-menu>ul>li>a:hover>span::after {
    

} */
.site-header-menu__item .primary-menu>ul>li:has(>.open-menu)>a>span::after {
    content: "" !important;
    display: inline-block !important;
    width: 75% !important;
    height: 2px !important;
    position: absolute !important;
    bottom: -8px !important;
    left: 0 !important;
    background: #7e967c !important;
}

@media (min-width: 1200px) {

    .navigation .primary-menu li.menu-item-has-children.current-menu-ancestor,
    .navigation .primary-menu li.menu-item-has-children.current-menu-item,
    .navigation .primary-menu li.menu-item-has-children.current-menu-parent {
        background-image: none !important;
    }

    .site-header-menu__item .primary-menu>ul>li.current-menu-item>a>span::after,
    .site-header-menu__item .primary-menu>ul>li.current-menu-ancestor>a>span::after,
    .site-header-menu__item .primary-menu>ul>li.current-menu-parent>a>span::after,
    .site-header-menu__item .primary-menu>ul>li>a:hover>span::after {
        content: "" !important;
        display: inline-block !important;
        width: 25px !important;
        height: 2px !important;
        position: absolute !important;
        bottom: -8px !important;
        left: 0 !important;
        background: #7e967c !important;
    }

    /* ── Panel reset ─────────────────────────────── */
    .bendo-megamenu {
        padding-left: 85px !important;
        padding-right: 85px !important;
        width: 100% !important;
        min-width: 780px;
    }

    /* ── Outer two-part layout ───────────────────── */
    /* Left: WP menu columns (flex:2)
     Right: ACF custom column (flex:1)
     Separated by a vertical divider              */
    .bendo-megamenu__wrap {
        display: flex !important;
        flex-direction: row !important;
        gap: 0 !important;
        align-items: stretch;
    }

    .bendo-megamenu__menucolumns {
        flex: 2 !important;
        padding-right: 40px;
        margin-right: 40px;
        /* border-right: 1px solid #ececec; */
    }

    .bendo-megamenu__customcolumn {
        flex: 1 !important;
        display: flex;
        flex-direction: column;
        /* min-width: 220px; */
        max-width: 215px;
    }

    /* ── Menu columns grid ───────────────────────── */
    /* Each depth-1 li = one column                  */
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1 {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
        gap: 0 40px !important;
        height: auto !important;
        overflow: visible !important;
        align-items: start !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* ── Each depth-1 li = column ───────────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li {
        display: flex !important;
        flex-direction: column !important;
        max-width: unset !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        background: none !important;
        background-image: none !important;
    }

    /* ── Depth-1 anchor = column heading ─────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a {
        display: block !important;
        flex-direction: unset !important;
        gap: 0 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        letter-spacing: 0.18rem !important;
        text-transform: uppercase !important;
        color: #2a2a2a !important;
        padding: 0 0 12px 0 !important;
        margin-bottom: 16px !important;
        /* border-bottom: 1px solid #ececec !important; */
        white-space: nowrap !important;
        text-decoration: none !important;
    }

    /* hide desc on column headings */
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a .mega-desc,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a .mega-title {
        display: inline !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        color: inherit !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a .mega-desc {
        display: none !important;
    }

    /* ── Depth-2 ul ──────────────────────────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2 {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        height: auto !important;
        overflow: visible !important;
        flex-wrap: nowrap !important;
        column-gap: unset !important;
    }

    /* ── Each depth-2 li ─────────────────────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li {
        padding: 0 !important;
        margin: 0 0 16px 0 !important;
        border: none !important;
        width: 100% !important;
        position: static !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li:last-child {
        margin-bottom: 0 !important;
    }

    /* ── Depth-2 anchor ──────────────────────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        padding: 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a .mega-title {
        display: block !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #2a2a2a !important;
        line-height: 1.3 !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a .mega-desc {
        display: block !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #2a2a2a !important;
        line-height: 1.5 !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a:hover .mega-title {
        color: #7e967c !important;
    }

    /* ── mega-cta button ─────────────────────────── */
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-cta {
        margin-top: 24px !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-cta>a {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        padding: 11px 22px !important;
        background: #7e967c !important;
        border: 2px solid #7e967c !important;
        border-radius: 6px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
        transition: background 0.2s ease !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-cta>a .mega-title {
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #fff !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-cta>a:hover {
        background: #fff !important;
    }

    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-cta>a:hover .mega-title {
        color: #7e967c !important;
    }

    /* ════════════════════════════════════════════════
     CUSTOM COLUMN (ACF Theme Options)
     Matches: Events pill + featured card + simple links
     ════════════════════════════════════════════════ */

    /* ── Badge pill (parent_mega_menu_title) ─────── */
    /* .bendo-megamenu__customcolumn .submenu-title-pill {} */

    .site-header .bendo-megamenu__wrap .bendo-megamenu__customcolumn .submenu-title-pill#events-btn {
        display: inline-block !important;
        background: #3a4421 !important;
        border: 1px solid #3a4421 !important;
        color: #ffffff !important;
        border-radius: 8px !important;
        line-height: 1 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        letter-spacing: 0.18rem !important;
        text-transform: uppercase !important;
        padding: 10px 16px !important;
        margin-bottom: 18px !important;
        text-decoration: none !important;
        cursor: pointer;
        width: fit-content !important;
    }

    .bendo-megamenu__customcolumn .submenu-title-pill#events-btn:hover {
        background: #3a4421 !important;
        color: #ffffff !important;
        opacity: 0.8 !important;
    }

    /* ── Featured card title (mega_menu_title) ───── */
    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__title {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #2a2a2a !important;
        line-height: 1.35 !important;
        margin: 0 0 8px 0 !important;
        padding: 0 !important;
    }

    /* ── Featured card description ───────────────── */
    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__description {
        font-size: 12px !important;
        color: #888 !important;
        line-height: 1.6 !important;
        margin-bottom: 20px !important;
        padding-bottom: 20px !important;
        border-bottom: 1px solid #ececec !important;
    }

    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__description p {
        margin: 0 !important;
    }

    /* ── Simple links wrapper ────────────────────── */
    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__links {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    /* ── Each simple link (Opening hours etc.) ───── */
    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__links .menu-link {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: #2a2a2a !important;
        text-decoration: none !important;
        padding: 9px 0 !important;
        border-bottom: 1px solid #f0f0f0 !important;
        transition: color 0.2s ease !important;
    }

    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__links .menu-link::after {
        content: '—';
        color: #bbb;
        font-size: 12px;
        flex-shrink: 0;
    }

    .bendo-megamenu__customcolumn .metz-megamenu--customcolumn__links .menu-link:hover {
        color: #7e967c !important;
    }

}


/* Target the list item container */
li.mega-menu-btn {
    display: inline-block;
    width: fit-content !important;
    padding: 14px 20px !important;
    background: transparent !important;
}

.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    background: #7e967c !important;
    color: #fff !important;
    border: 1px solid #7e967c !important;
}

.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a>span {
    color: #fff !important;
}


.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a:hover,
.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a:active,
.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a:focus,
.bendo-megamenu__wrap .bendo-megamenu__menucolumns>ul.nav-menu li.mega-menu-btn>a:focus-visible {
    background: transparent !important;
    border: 1px solid #7e967c !important;
    color: #7e967c !important;
}



/* Target the text inside the button */
.bendo-megamenu__menucolumns .main-ul-wrap li.btn.btn-primary.mega-menu-btn .mega-title {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    line-height: 1 !important;
    /* Prevents text from pushing the padding unevenly */
}



/* Optional Active/Click State */
/* li.btn.btn-primary.mega-menu-btn>a:active {
    transform: scale(0.98);
} */

.bendo-megamenu--customcolumn__title {
    display: block !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    color: #2a2a2a !important;
    line-height: 1.3 !important;
    transition: color 0.2s ease !important;
    margin-bottom: 8px !important;
}

.bendo-megamenu--customcolumn__description>p {
    display: block;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #2a2a2a !important;
    line-height: 1.5 !important;
}


/* ── Each simple link (Opening hours etc.) ───── */
.bendo-megamenu__customcolumn .bendo-megamenu--customcolumn__links .menu-link {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #2a2a2a !important;
    text-decoration: none !important;
    padding: 9px 0 !important;
    transition: color 0.2s ease !important;
}

.bendo-megamenu__customcolumn .bendo-megamenu--customcolumn__links .menu-link::after {
    content: '→';
    color: #bbb;
    font-size: 16px;
    flex-shrink: 0;
}

.bendo-megamenu__customcolumn .bendo-megamenu--customcolumn__links .menu-link:hover {
    color: #7e967c !important;
}

.bendo-megamenu__customcolumn .bendo-megamenu--customcolumn__links .menu-link:hover::after {
    color: #7e967c !important;
}

/* Test Style 
.dev-open>.bendo-megamenu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
} */

@media(max-width: 768px) {
    header.site-header #menu-container.site-header-menu {
        position: fixed !important;
        top: 85px !important;
    }

    .logged-in header.site-header #menu-container.site-header-menu {
        position: fixed !important;
        top: calc(85px + 46px) !important;
    }
}

/* ================================================================
   MOBILE MEGA MENU — complete mobile rules
   ================================================================ */

@media (max-width: 1199.98px) {

    .site-header-menu.open-menu {
        margin-top: 0 !important;
    }

    /* ── Scroll lock ──────────────────────────────────────────── */
    body.menu-scroll-lock {
        overflow: hidden !important;
        touch-action: none !important;
    }

    /* ── Full-screen drawer ───────────────────────────────────── */
    #menu-container.site-header-menu {
        position: fixed !important;
        top: 85px !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: auto !important;
        min-height: 100vh;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        background: #F4EDE5 !important;
        z-index: 9995 !important;
        /* padding: 28px !important; */
        box-sizing: border-box !important;
        transform: translateX(100%) !important;
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    .logged-in #menu-container.site-header-menu {
        position: fixed !important;
        top: calc(85px + 32px) !important;
    }

    #menu-container.site-header-menu.open-menu {
        transform: translateX(0) !important;
    }

    #menu-container.site-header-menu nav,
    #menu-container.site-header-menu .navigation {
        width: 100% !important;
        overflow: visible !important;
        padding-bottom: 0 !important;
    }

    /* ── Depth-0 list ─────────────────────────────────────────── */
    .primary-menu>ul {
        display: flex !important;
        flex-direction: column !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        row-gap: 0 !important;
    }

    .primary-menu>ul>li {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        border-bottom: 1px solid #3A4421 !important;
        padding: 0 !important;
        margin: 0 !important;
        position: relative !important;
        background-image: none !important;
        background: none !important;
        overflow: visible !important;
    }

    /* .primary-menu>ul>li:first-child {
        border-top: 1px solid #ddd6cc !important;
    } */

    /* Depth-0 anchor */
    .primary-menu>ul>li>a {
        flex: 1 1 0 !important;
        display: flex !important;
        align-items: center !important;
        min-height: 56px !important;
        padding: 20px 60px 20px 0 !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        letter-spacing: 0.18rem !important;
        text-transform: uppercase !important;
        color: #2a2a2a !important;
        text-decoration: none !important;
        background: none !important;
        border: none !important;
    }

    .primary-menu>ul>li.has-mega>a {
        /* pointer-events: none !important; */
        cursor: pointer !important
    }

    .primary-menu>ul>li.current-menu-item>a,
    .primary-menu>ul>li.current-menu-ancestor>a,
    .primary-menu>ul>li.current-menu-parent>a {
        color: #7e967c !important;
    }

    .primary-menu>ul>li.menu-item-has-children {
        background-image: none !important;
        padding-right: 0 !important;
    }

    /* ── navigation.js icon-wrapper (normal submenus depth-0) ─── */
    .primary-menu>ul>li>.icon-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
        width: 56px !important;
        min-height: 56px !important;
        cursor: pointer !important;
        position: static !important;
        top: auto !important;
        right: auto !important;
        transform: none !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: 20px !important;
        transition: transform 0.3s ease !important;
    }

    .primary-menu>ul>li>.icon-wrapper.open {
        transform: rotate(180deg) !important;
    }

    /* ── Mega panel at depth-0 ────────────────────────────────── */
    .primary-menu>ul>li>.bendo-megamenu,
    .primary-menu>ul>li>ul {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .primary-menu>ul>li>.bendo-megamenu {
        display: block !important;
        position: static !important;
        overflow: hidden !important;
        height: 0;
        background: transparent !important;
        padding: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transition: height 0.4s ease !important;
        width: 100% !important;
    }

    @media (min-width: 1200px) {
        .primary-menu>ul>li>.bendo-megamenu {
            height: auto !important;
            overflow: visible !important;
            position: fixed !important;
            display: none !important;
        }
    }

    .bendo-megamenu>.container {
        padding: 0 !important;
        margin: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .bendo-megamenu__wrap {
        display: block !important;
        gap: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .bendo-megamenu__menucolumns {
        display: block !important;
        flex: unset !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        width: 100% !important;
    }

    .bendo-megamenu__customcolumn {
        display: none !important;
    }

    /* ── Depth-1 list inside mega ─────────────────────────────── */
    .bendo-megamenu .main-ul-wrap.menu-depth-1,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1 {
        display: block !important;
        grid-template-columns: unset !important;
        height: auto !important;
        overflow: visible !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        list-style: none !important;
    }

    /* Each depth-1 li */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        /* border-bottom: 1px solid #ddd6cc !important; */
        margin: 0 !important;
        padding: 0 !important;
        /* padding-left: 12px !important; */
        background: none !important;
        background-image: none !important;
        position: relative !important;
    }

    .bendo-megamenu .main-ul-wrap.menu-depth-1>li:last-child,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li:last-child {
        border-bottom: none !important;
    }

    /* Depth-1 anchor */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>a,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a {
        flex: 1 1 0 !important;
        display: flex !important;
        align-items: start !important;
        min-height: unset !important;
        padding: 14px 56px 14px 0 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        letter-spacing: 0.18rem !important;
        text-transform: uppercase !important;
        color: #3d3d3d !important;
        text-decoration: none !important;
        /* pointer-events: none !important; */
        cursor: pointer !important;
        white-space: normal !important;
        border: none !important;
    }

    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.mega-menu-btn>a,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li.mega-menu-btn>a {
        min-height: 40px !important;
    }

    /* Depth-1 sub-ul spans full row */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>ul,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>ul {
        flex: 0 0 100% !important;
        width: 100% !important;
    }

    /* ── Depth-2 list ─────────────────────────────────────────── */
    .bendo-megamenu .main-ul-wrap .menu-depth-2,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2 {
        display: block !important;
        overflow: hidden !important;
        height: 0;
        transition: height 0.35s ease !important;
        padding: 0 !important;
        margin: 0 !important;
        /* margin-top: 13px !important; */
        list-style: none !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        position: static !important;
        left: auto !important;
    }

    @media (min-width: 1200px) {

        .bendo-megamenu .main-ul-wrap .menu-depth-2,
        .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2 {
            height: auto !important;
            overflow: visible !important;
        }
    }

    /* Each depth-2 li */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li {
        width: 98% !important;
        padding: 0 !important;
        margin: 0 !important;
        border-bottom: 1px solid #ede8e2 !important;
        position: static !important;
        padding-left: 8px !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.mega-menu-btn,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li.mega-menu-btn {
        padding: 13px 0 !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li:last-child,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li:last-child {
        border-bottom: none !important;
    }

    /* Depth-2 anchor */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a {
        display: flex !important;
        flex-direction: column !important;
        gap: 3px !important;
        padding: 13px 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
        pointer-events: auto !important;
    }

    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a .mega-title,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a .mega-title {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #2a2a2a !important;
        line-height: 1.3 !important;
        display: block !important;
    }

    /* .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a .mega-desc,
    .bendo-megamenu__menucolumns .main-ul-wrap .menu-depth-2>li>a .mega-desc {
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #2a2a2a !important;
        line-height: 1.5 !important;
        display: block !important;
    } */

    /* ── Normal (non-mega) submenus at depth-0 ───────────────────
     navigation.js owns these — just ensure correct base styles  */
    .primary-menu>ul>li>ul.menu-depth-1:not(.main-ul-wrap) {
        display: block !important;
        overflow: hidden !important;
        height: 0;
        transition: height 0.4s ease !important;
        background: transparent !important;
        margin: 0 !important;
        padding: 0 !important;
        box-shadow: none !important;
        position: static !important;
        left: auto !important;
        border: none !important;
        list-style: none !important;
    }

    @media (min-width: 1200px) {
        .primary-menu>ul>li>ul.menu-depth-1:not(.main-ul-wrap) {
            height: auto !important;
            overflow: visible !important;
            position: absolute !important;
        }


    }

    .primary-menu>ul>li>ul li {
        width: 100% !important;
        padding: 0 !important;
        border-bottom: 1px solid #ede8e2 !important;
    }

    .primary-menu>ul>li>ul li:last-child {
        border-bottom: none !important;
    }

    .primary-menu>ul>li>ul a {
        padding: 13px 0 !important;
        font-size: 14px !important;
        color: #2a2a2a !important;
        display: block !important;
    }

    /* ── Universal chevron (mob-chevron) ─────────────────────────
     Used by megamenu-mobile-patch.js for .bendo-megamenu items
     and depth-1 items inside mega panels.                       */
    span.mob-chevron {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        width: 56px !important;
        min-height: 56px !important;
        cursor: pointer !important;
        pointer-events: auto !important;
        z-index: 10 !important;
        flex-shrink: 0 !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%232a2a2a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: 20px !important;
        transition: transform 0.3s ease !important;
    }

    span.mob-chevron--sub {
        width: 44px !important;
        min-height: 50px !important;
        background-size: 18px !important;
        transform: translateY(-30%) rotate(0deg) !important;
    }

    span.mob-chevron.mob-chevron--sub.open {
        transform: translateY(-30%) rotate(180deg) !important;
    }

    /* CTA button in mega */
    .bendo-megamenu .menu-depth-2>li.mega-cta,
    .bendo-megamenu__menucolumns .menu-depth-2>li.mega-cta {
        border-bottom: none !important;
        padding: 16px 0 8px !important;
    }

    .bendo-megamenu .menu-depth-2>li.mega-cta>a,
    .bendo-megamenu__menucolumns .menu-depth-2>li.mega-cta>a {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 12px 24px !important;
        background: #7e967c !important;
        border: 2px solid #7e967c !important;
        border-radius: 30px !important;
        width: auto !important;
    }

    .bendo-megamenu .menu-depth-2>li.mega-cta>a .mega-title,
    .bendo-megamenu__menucolumns .menu-depth-2>li.mega-cta>a .mega-title {
        /* font-size: 11px !important; */
        /* font-weight: 600 !important; */
        /* letter-spacing: 0.1em !important; */
        text-transform: uppercase !important;
        color: #fff !important;
    }

    .bendo-megamenu.open-menu li.btn.btn-primary.mega-menu-btn {
        width: fit-content !important;
        margin-bottom: 16px;
    }
}


.site-header--inverted.header-top-open {
    background-color: #F4EDE5 !important;
}


/* ================================================================
   MOBILE — Current page & hover colours (anchors + chevrons)
   Covers depth-0, depth-1 inside mega, depth-2 inside mega,
   and normal (non-mega) submenu items.
   ================================================================ */

@media (max-width: 1199.9px) {

    /* ── DEPTH-0 — current & hover ──────────────────────────────── */

    /* Anchor text */
    .primary-menu>ul>li.current-menu-item>a,
    .primary-menu>ul>li.current-menu-ancestor>a,
    .primary-menu>ul>li.current-menu-parent>a,
    .primary-menu>ul>li>a:hover {
        color: #7e967c !important;
    }

    /* Chevron — mob-chevron (mega items) */
    .primary-menu>ul>li.current-menu-item>span.mob-chevron,
    .primary-menu>ul>li.current-menu-ancestor>span.mob-chevron,
    .primary-menu>ul>li.current-menu-parent>span.mob-chevron {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    }

    /* Chevron — icon-wrapper (normal submenu items handled by navigation.js) */
    .primary-menu>ul>li.current-menu-item>span.icon-wrapper,
    .primary-menu>ul>li.current-menu-ancestor>span.icon-wrapper,
    .primary-menu>ul>li.current-menu-parent>span.icon-wrapper {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    }

    /* ── DEPTH-1 inside mega — current & hover ───────────────────── */

    /* Anchor text */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-item>a,
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-ancestor>a,
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-parent>a,
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>a:hover {
        color: #7e967c !important;
    }

    /* Chevron */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-item>span.mob-chevron,
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-ancestor>span.mob-chevron,
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.current-menu-parent>span.mob-chevron {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    }

    /* ── DEPTH-2 inside mega — current & hover ───────────────────── */

    /* Anchor text + spans inside */
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.current-menu-item>a,
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li.current-menu-item>a .mega-title,
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a:hover,
    .bendo-megamenu .main-ul-wrap .menu-depth-2>li>a:hover .mega-title {
        color: #7e967c !important;
    }

    /* ── NORMAL non-mega submenus — current & hover ──────────────── */

    /* Depth-1 items inside regular ul */
    .primary-menu>ul>li>ul>li.current-menu-item>a,
    .primary-menu>ul>li>ul>li>a:hover {
        color: #7e967c !important;
    }

    /* ── OPEN STATE chevron colour ───────────────────────────────── */
    /* When any chevron is open (rotated to ∧), tint it primary      */

    span.mob-chevron.open {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        transform: rotate(180deg) !important;
    }

    .primary-menu>ul>li>span.icon-wrapper.open {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237e967c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        transform: rotate(180deg) !important;
    }
}


.navigation .primary-menu a {
    font-weight: 600 !important;
}

.navigation .primary-menu>ul ul a.focus,
.navigation .primary-menu>ul ul a:hover {
    color: #7e967c !important;
}

@media(min-width:1200px) {

    .site-header--inverted .navbar:has(.has-mega:hover) .site-header-action .user-icon .logout-icon,
    .site-header--inverted .navbar:has(.has-mega:hover) .site-header-action>div.header_icon_wrapper>a {
        color: #000 !important;
    }
}

.site-header--inverted.header-top-open .navbar .site-header-action .user-icon .logout-icon {
    color: #000 !important;
}

@media(max-width:1200px) {
    #menu-container .mobile-primary-menu ul.menu-depth-1>li {
        margin-bottom: 18px !important;
    }

    /* ── Depth-2 anchor ──────────────────────────── */
    #menu-container .mobile-primary-menu ul.menu-depth-1>li>a {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        padding: 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
        transition: color 0.2s ease !important;
        /* margin-bottom: 12px !important; */
    }

    #menu-container .mobile-primary-menu ul.menu-depth-1>li>a .mega-title {
        font-weight: 600 !important;
        font-size: 14px !important;
        color: #2a2a2a !important;
        line-height: 1.3 !important;
        letter-spacing: 0 !important;
        transition: color 0.2s ease !important;
        text-transform: capitalize !important;
    }

    #menu-container .mobile-primary-menu ul.menu-depth-1>li>a .mega-desc {
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #2a2a2a !important;
        line-height: 1.5 !important;
        text-transform: capitalize !important;
    }

    #menu-container .mobile-primary-menu ul.menu-depth-1>li>a:hover .mega-title {
        color: #7e967c !important;
    }

    #menu-container .mobile-primary-menu ul.menu-depth-1>li.mega-menu-btn {
        width: auto !important;
        max-width: 136px !important;
        margin-bottom: 18px !important;
        padding-left: 0 !important;
    }

    #menu-container .mobile-primary-menu ul.menu-depth-1>li.mega-menu-btn>a>span {
        color: #fff !important;
    }

    .bendo-megamenu.open-menu {
        margin-top: 8px !important;
    }
}

/* ================================================================
   MOBILE MENU — Custom Scroll Bar
   ================================================================ */

.site-header #menu-container::-webkit-scrollbar {
    width: 8px;
}

.site-header #menu-container::-webkit-scrollbar-track {
    background: #F4EDE5;
}

.site-header #menu-container::-webkit-scrollbar-thumb {
    background: #C1C1C1;
    border-radius: 4px;
}

.site-header .primary-menu>ul.menu>li>a .mega-title,
.site-header .menu-depth-1>li>a .mega-title {
    text-transform: uppercase !important;
}

/* ================================================================
   MOBILE MENU — Social Links Container
   ================================================================ */

@media (max-width: 1199.98px) {

    .mobile-social-links {
        display: flex !important;
        flex-direction: row !important;
        gap: 20px !important;
        padding: 20px 12px !important;
        margin-top: auto !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .mobile-social-links__item {
        font-size: 12px !important;
        font-weight: 500 !important;
        letter-spacing: 0.05rem !important;
        text-transform: none !important;
        color: #2a2a2a !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        transition: color 0.2s ease !important;
    }

    .mobile-social-links__item:hover {
        color: #7e967c !important;
    }

    /* Hide the original lis from the ul (JS removes them but just in case) */
    .primary-menu>ul>li.social-link-mb-menu {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .mobile-social-links {
        display: none !important;
    }

    .primary-menu>ul>li.social-link-mb-menu {
        display: none !important;
    }
}

/* ================================================================
   MOBILE MENU — Social Links (inside ul as li)
   ================================================================ */


@media (max-width: 1199.98px) {

    /* Reserve scrollbar width so content doesn't reflow when it appears */
    #menu-container.site-header-menu {
        scrollbar-gutter: stable !important;
        overflow-y: scroll !important;
    }

    /* Prevent mega menu content from wrapping due to scrollbar width */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li>a,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li>a {
        white-space: normal !important;
        /* allow wrap but controlled */
        word-break: break-word !important;
    }

    /* Mega menu btn — prevent overflow */
    .bendo-megamenu .main-ul-wrap.menu-depth-1>li.mega-menu-btn,
    .bendo-megamenu__menucolumns .main-ul-wrap.menu-depth-1>li.mega-menu-btn {
        overflow: visible !important;
        width: auto !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .bendo-megamenu .menu-depth-1>li.mega-menu-btn>a,
    .bendo-megamenu__menucolumns .menu-depth-1>li.mega-menu-btn>a {
        width: auto !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        white-space: nowrap !important;
    }
}


@media (max-width: 1199.98px) {
    .mobile-social-links {
        margin-top: 24px !important;
        padding-bottom: 20px !important;
    }
}

@media (max-width: 1199.98px) {

    .primary-menu.mobile-primary-menu ul li.mobile-social-links {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 20px !important;
        width: 100% !important;
        border-bottom: none !important;
        padding: 20px 0 40px 0 !important;
        margin: 0 !important;
        background: none !important;
        overflow: visible !important;
        border-bottom: 0 !important;
    }

    /* ── mobile-social-links li — no pseudo-state reactions ── */
    .primary-menu.mobile-primary-menu ul li.mobile-social-links,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links:hover,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links:active,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links:focus,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links:focus-within,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links:focus-visible {
        color: inherit !important;
        background: none !important;
        background-color: transparent !important;
        border-color: transparent !important;
        outline: none !important;
        box-shadow: none !important;
        cursor: default !important;
    }

    .primary-menu.mobile-primary-menu ul li.mobile-social-links::after,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links::before {
        display: none !important;
        content: none !important;
    }

    /* ── Individual anchors — hover only on the <a> itself ── */
    .primary-menu.mobile-primary-menu ul li.mobile-social-links .mobile-social-links__item {
        color: #2a2a2a !important;
        text-decoration: none !important;
        transition: color 0.2s ease !important;
        cursor: pointer !important;
    }

    .primary-menu.mobile-primary-menu ul li.mobile-social-links .mobile-social-links__item:hover,
    .primary-menu.mobile-primary-menu ul li.mobile-social-links .mobile-social-links__item:active {
        color: #7e967c !important;
        text-decoration: none !important;
    }

    li.mobile-social-links .mobile-social-links__item {
        font-size: 11px !important;
        font-weight: 500 !important;
        letter-spacing: 0.05rem !important;
        text-transform: none !important;
        color: #2a2a2a !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        flex: none !important;
        width: auto !important;
        padding: 0 !important;
        transition: color 0.2s ease !important;

    }

    li.mobile-social-links .mobile-social-links__item:hover {
        color: #7e967c !important;
    }
}

.site-header .navbar .site-header-action a.btn.dropdown-toggle-btn:hover {
    background-color: #FDF8F4 !important;
    color: #50413c !important;
}

.dropdown-wrapper .dropdown-menu-custom {
    background-color: #FDF8F4 !important;
}

.dropdown-menu.dropdown-menu-end.show {
    background-color: #FDF8F4 !important;

}

.navigation .primary-menu li.menu-item-has-children .icon-wrapper {
    display: none !important;
}

.navigation .primary-menu>ul ul {
    border-top: none !important;
}