.menu-dialog{
    position:fixed;

    inset:
        0
        0
        0
        auto;

    width:
        min(92vw,420px);

    height:100dvh;
    max-height:100dvh;

    margin:0;
    padding:0;

    overflow:hidden;

    direction:rtl;

    color:#161a21;

    background:
        linear-gradient(
            180deg,
            #fffdf8,
            #f8f3e8
        );

    border:0;

    border-inline-start:
        1px solid
        rgba(211,161,38,.55);

    border-radius:0;

    box-shadow:
        -28px 0 80px
        rgba(10,13,18,.24);
}

.menu-dialog::backdrop{
    background:
        rgba(7,10,14,.58);

    backdrop-filter:
        blur(3px);
}

.bbox-mobile-menu-shell{
    height:100%;

    display:grid;

    grid-template-rows:
        auto
        minmax(0,1fr);

    background:
        radial-gradient(
            circle at 50% -8%,
            rgba(223,178,57,.14),
            transparent 27%
        );
}

.menu-dialog
.dialog-heading{
    position:relative;

    min-height:88px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:14px;

    margin:0;

    padding:
        17px
        18px;

    color:#f7e7b2;

    background:
        linear-gradient(
            145deg,
            #11161d,
            #1b222b
        );

    border-bottom:
        1px solid
        rgba(214,166,43,.46);
}

.menu-dialog
.dialog-heading:after{
    content:"";

    position:absolute;

    inset-inline:
        18px
        18px;

    inset-block-end:0;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d9a72b,
            transparent
        );
}

.bbox-mobile-menu-heading{
    min-width:0;

    display:flex;
    align-items:center;

    gap:11px;
}

.bbox-mobile-menu-eyebrow{
    flex:0 0 auto;

    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border:
        1px solid
        rgba(236,197,91,.52);

    border-radius:13px;

    background:
        linear-gradient(
            145deg,
            #e6b83f,
            #b9800c
        );

    color:#10141a;

    font-size:10px;
    font-weight:950;
    letter-spacing:.6px;

    box-shadow:
        0 8px 18px
        rgba(161,110,8,.21);
}

.bbox-mobile-menu-heading h2{
    margin:0;

    color:#fff9e8;

    font-size:17px;
    font-weight:900;
    line-height:1.5;
}

.bbox-mobile-menu-heading p{
    margin:
        2px
        0
        0;

    color:#c9c3b5;

    font-size:10.5px;
    font-weight:500;
}

.bbox-mobile-menu-close{
    flex:0 0 auto;

    width:42px;
    height:42px;

    min-width:42px;
    min-height:42px;

    display:grid;
    place-items:center;

    padding:0;

    border:
        1px solid
        rgba(236,197,91,.28);

    border-radius:12px;

    background:
        rgba(255,255,255,.055);

    color:#f8e5a8;
}

.bbox-mobile-menu-nav{
    min-height:0;

    overflow-y:auto;

    overscroll-behavior:contain;

    padding:
        12px
        12px
        calc(
            24px
            + env(safe-area-inset-bottom)
        );

    scrollbar-width:thin;

    scrollbar-color:
        #d1a02a
        #eee6d4;
}

.bbox-mobile-menu-nav::-webkit-scrollbar{
    width:5px;
}

.bbox-mobile-menu-nav::-webkit-scrollbar-track{
    background:#eee6d4;
}

.bbox-mobile-menu-nav::-webkit-scrollbar-thumb{
    background:
        linear-gradient(
            #e2b94b,
            #b9810c
        );

    border-radius:99px;
}

.drawer-menu{
    margin:0;
    padding:0;

    list-style:none;
}

.drawer-menu li{
    position:relative;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        46px;

    align-items:center;

    margin:
        0
        0
        7px;

    overflow:hidden;

    border:
        1px solid
        #e8dcc1;

    border-radius:14px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(251,247,237,.95)
        );

    box-shadow:
        0 6px 17px
        rgba(40,31,13,.035);

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.drawer-menu
li.bbox-menu-open{
    border-color:
        rgba(205,154,28,.68);

    background:
        linear-gradient(
            145deg,
            #fff,
            #fbf2d9
        );

    box-shadow:
        0 10px 24px
        rgba(161,113,9,.075);
}

.drawer-menu a{
    grid-column:1;

    min-width:0;
    min-height:52px;

    display:flex;
    align-items:center;

    padding:
        11px
        14px;

    color:#282d35;

    border:0;

    text-decoration:none;

    font-size:13px;
    font-weight:750;
    line-height:1.75;

    overflow-wrap:anywhere;
}

.drawer-menu
> li
> a{
    font-weight:850;
}

.drawer-menu
.current-menu-item
> a,

.drawer-menu
.current-menu-ancestor
> a{
    color:#7e5907;
}

.drawer-menu
.bbox-menu-toggle{
    grid-column:2;

    align-self:center;
    justify-self:center;

    width:38px;
    height:38px;

    min-width:38px;
    min-height:38px;

    display:grid;
    place-items:center;

    margin:0;

    padding:0;

    cursor:pointer;

    border:
        1px solid
        #e3d2aa;

    border-radius:11px;

    background:
        linear-gradient(
            145deg,
            #fff,
            #f5ecd6
        );

    color:#93670a;

    font-size:17px;
    line-height:1;

    transition:
        transform .18s ease,
        color .18s ease,
        background .18s ease,
        border-color .18s ease;
}

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle{
    transform:
        rotate(180deg);

    color:#151922;

    border-color:#d2a22d;

    background:
        linear-gradient(
            145deg,
            #f4d77c,
            #d3a02b
        );
}

.drawer-menu
> li
> .sub-menu{
    grid-column:
        1 / -1;

    width:100%;

    margin:0;

    padding:
        0
        8px
        8px;

    list-style:none;

    border-top:
        1px solid
        rgba(217,190,127,.42);
}

.drawer-menu
.sub-menu
li{
    margin-top:7px;
    margin-bottom:0;

    background:
        rgba(255,255,255,.72);

    border-color:
        #eee4cf;

    border-radius:12px;

    box-shadow:none;
}

.drawer-menu
.sub-menu
a{
    min-height:46px;

    padding:
        9px
        12px;

    color:#4b515b;

    font-size:12px;
    font-weight:680;
}

.drawer-menu
.sub-menu
.sub-menu{
    grid-column:
        1 / -1;

    margin:
        0
        7px
        7px;

    padding:
        0
        7px
        7px;

    border-inline-start:
        2px solid
        rgba(212,161,38,.35);

    border-top:0;
}

.drawer-menu
.sub-menu
.sub-menu
li{
    border:0;

    background:
        rgba(245,239,224,.7);

    border-radius:9px;
}

.drawer-menu
.sub-menu
.sub-menu
a{
    min-height:42px;

    padding:
        8px
        10px;

    font-size:11.5px;
    font-weight:600;
}

.drawer-menu
.bbox-menu-badge{
    position:absolute;

    inset-inline-end:56px;
    inset-block-start:5px;

    min-height:17px;

    padding:
        1px
        6px;

    border-radius:999px;

    background:
        linear-gradient(
            145deg,
            #f8dc86,
            #dca92d
        );

    color:#654702;

    font-size:8px;
    font-weight:900;

    pointer-events:none;
}

.drawer-menu
.bbox-hide-mobile,

.drawer-menu
.bbox-mega-banner-template,

.drawer-menu
.bbox-mega-banner{
    display:none;
}

.bbox-menu-mobile-accordion
.drawer-menu
.bbox-menu-enhanced:not(.bbox-menu-open):not(.bbox-mobile-mode-normal)
> .sub-menu,

.drawer-menu
.bbox-mobile-mode-accordion.bbox-menu-enhanced:not(.bbox-menu-open)
> .sub-menu{
    display:none;
}

body:has(.menu-dialog[open]){
    overflow:hidden;
}

/* BBOX 5.1.5 MOBILE DRAWER REFINEMENT START */

/*
 * Header:
 * one useful title, no decorative BBOX badge and no redundant title.
 */

.menu-dialog
.dialog-heading{
    min-height:72px;

    padding:
        14px
        16px;

    gap:10px;
}

.bbox-mobile-menu-heading{
    display:block;

    min-width:0;

    flex:1;
}

.bbox-mobile-menu-heading h2{
    margin:0;

    color:#fff7df;

    font-size:18px;
    font-weight:900;
    line-height:1.65;

    letter-spacing:-.1px;
}

.bbox-mobile-menu-heading p,
.bbox-mobile-menu-eyebrow{
    display:none !important;
}

.bbox-mobile-menu-close{
    width:38px;
    height:38px;

    min-width:38px;
    min-height:38px;

    border-radius:11px;
}


/*
 * More compact vertical rhythm.
 */

.bbox-mobile-menu-nav{
    padding:
        10px
        10px
        calc(
            22px
            + env(safe-area-inset-bottom)
        );
}

.drawer-menu li{
    /*
     * Leaf items get no empty toggle column.
     */
    grid-template-columns:
        minmax(0,1fr);

    margin-bottom:5px;

    border-radius:13px;
}

/*
 * Only real parents receive a second grid column.
 */
.drawer-menu
li.menu-item-has-children{
    grid-template-columns:
        minmax(0,1fr)
        38px;
}


/*
 * Level 1
 */

.drawer-menu
> li
> a{
    min-height:46px;

    padding:
        9px
        12px;

    font-size:13.75px;
    font-weight:850;
    line-height:1.65;
}


/*
 * Premium Chevron — no textual arrows.
 */

.drawer-menu
.bbox-menu-toggle{
    width:32px;
    height:32px;

    min-width:32px;
    min-height:32px;

    font-size:0;

    border:
        1px solid
        rgba(216,179,88,.55);

    border-radius:10px;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #f6efdf
        );

    color:#93680a;

    box-shadow:
        inset 0 1px 0 #fff;

    transform:none;
}

.drawer-menu
.bbox-menu-chevron{
    display:block;

    width:7px;
    height:7px;

    border-inline-end:
        1.6px solid
        currentColor;

    border-block-end:
        1.6px solid
        currentColor;

    transform:
        rotate(45deg)
        translate(-1px,-1px);

    transform-origin:center;

    transition:
        transform .2s ease,
        color .2s ease;
}

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle{
    transform:none;

    color:#16191f;

    border-color:#d0a02a;

    background:
        linear-gradient(
            145deg,
            #f4d77c,
            #d3a02b
        );
}

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle
> .bbox-menu-chevron{
    transform:
        rotate(225deg)
        translate(-1px,-1px);
}


/*
 * Level 1 submenu container.
 */

.drawer-menu
> li
> .sub-menu{
    padding:
        4px
        6px
        6px;

    border-top:
        1px solid
        rgba(217,190,127,.38);
}


/*
 * Level 2:
 * substantially less dead space and more readable typography.
 */

.drawer-menu
.sub-menu
li{
    margin-top:5px;

    border-radius:11px;
}

.drawer-menu
.sub-menu
a{
    min-height:42px;

    padding:
        8px
        11px;

    font-size:13.25px;
    font-weight:720;
    line-height:1.65;

    color:#3d434c;
}


/*
 * Parents at level 2 retain a compact toggle column.
 */

.drawer-menu
.sub-menu
li.menu-item-has-children{
    grid-template-columns:
        minmax(0,1fr)
        36px;
}

.drawer-menu
.sub-menu
.bbox-menu-toggle{
    width:30px;
    height:30px;

    min-width:30px;
    min-height:30px;

    border-radius:9px;
}


/*
 * Level 3:
 * no tiny text and no oversized cards.
 */

.drawer-menu
.sub-menu
.sub-menu{
    margin:
        0
        5px
        5px;

    padding:
        3px
        5px
        5px;

    border-inline-start:
        2px solid
        rgba(210,159,34,.3);
}

.drawer-menu
.sub-menu
.sub-menu
li{
    margin-top:4px;

    border-radius:8px;

    background:
        rgba(247,241,226,.8);
}

.drawer-menu
.sub-menu
.sub-menu
a{
    min-height:38px;

    padding:
        7px
        9px;

    font-size:12.75px;
    font-weight:650;
    line-height:1.6;
}


/*
 * Leaf rows must span the full available width.
 */

.drawer-menu
li:not(.menu-item-has-children)
> a{
    grid-column:
        1 / -1;
}


/*
 * Badge position follows compact geometry.
 */

.drawer-menu
.bbox-menu-badge{
    inset-inline-end:44px;
    inset-block-start:4px;
}


/*
 * No raw character should influence layout even if markup is cached.
 */

.drawer-menu
.bbox-menu-toggle{
    text-indent:-9999px;
}

.drawer-menu
.bbox-menu-toggle
.bbox-menu-chevron{
    text-indent:0;
}

/* BBOX 5.1.5 MOBILE DRAWER REFINEMENT END */

/* BBOX 5.1.6 MOBILE PLUS MINUS START */

/*
 * Reset every previous arrow/chevron visual.
 */

.drawer-menu
.bbox-menu-chevron{
    position:relative;

    display:block !important;

    width:14px !important;
    height:14px !important;

    margin:auto;

    border:0 !important;

    transform:none !important;

    text-indent:0 !important;

    color:currentColor;
}

/*
 * Horizontal stroke = minus.
 */

.drawer-menu
.bbox-menu-chevron::before{
    content:"";

    position:absolute;

    top:50%;
    left:50%;

    width:10px;
    height:1.7px;

    border-radius:99px;

    background:currentColor;

    transform:
        translate(-50%,-50%);

    transition:
        opacity .18s ease,
        transform .18s ease;
}

/*
 * Vertical stroke = plus.
 */

.drawer-menu
.bbox-menu-chevron::after{
    content:"";

    position:absolute;

    top:50%;
    left:50%;

    width:1.7px;
    height:10px;

    border-radius:99px;

    background:currentColor;

    transform:
        translate(-50%,-50%);

    transition:
        opacity .18s ease,
        transform .18s ease;
}

/*
 * Closed state.
 */

.drawer-menu
.bbox-menu-toggle{
    width:32px !important;
    height:32px !important;

    min-width:32px !important;
    min-height:32px !important;

    padding:0 !important;

    display:grid !important;
    place-items:center !important;

    border:
        1px solid
        rgba(207,158,35,.48) !important;

    border-radius:10px !important;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #f4ead1
        ) !important;

    color:#8d6409 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 4px 10px rgba(136,95,7,.055) !important;

    text-indent:0 !important;

    transform:none !important;

    transition:
        color .18s ease,
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

/*
 * Hover/focus/touch affordance.
 */

.drawer-menu
.bbox-menu-toggle:hover,

.drawer-menu
.bbox-menu-toggle:focus-visible{
    color:#5f4203 !important;

    border-color:
        rgba(201,146,17,.78) !important;

    background:
        linear-gradient(
            145deg,
            #fff9e8,
            #eddaa4
        ) !important;

    box-shadow:
        0 6px 14px
        rgba(148,102,6,.10) !important;
}

/*
 * Open state:
 * Plus becomes Minus by removing vertical stroke.
 */

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle{
    color:#16191f !important;

    border-color:#c99313 !important;

    background:
        linear-gradient(
            145deg,
            #f1ce68,
            #d49d18
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,246,202,.72),
        0 6px 14px rgba(157,108,6,.14) !important;

    transform:none !important;
}

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle
> .bbox-menu-chevron{
    transform:none !important;
}

.drawer-menu
.bbox-menu-open
> .bbox-menu-toggle
> .bbox-menu-chevron::after{
    opacity:0;

    transform:
        translate(-50%,-50%)
        scaleY(.15);
}

/*
 * Level 2 buttons stay slightly smaller while using the same visual system.
 */

.drawer-menu
.sub-menu
.bbox-menu-toggle{
    width:29px !important;
    height:29px !important;

    min-width:29px !important;
    min-height:29px !important;

    border-radius:9px !important;
}

.drawer-menu
.sub-menu
.bbox-menu-chevron{
    width:12px !important;
    height:12px !important;
}

.drawer-menu
.sub-menu
.bbox-menu-chevron::before{
    width:9px;
}

.drawer-menu
.sub-menu
.bbox-menu-chevron::after{
    height:9px;
}

/* BBOX 5.1.6 MOBILE PLUS MINUS END */