/* BBOX 5.5.0 MOBILE ISOLATION — migrated from former shared base.css. */
.site-header{
    position:relative;
    overflow:visible;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.985),
            rgba(255,253,248,.985)
        );

    border-bottom:
        1px solid
        rgba(191,142,23,.24);

    box-shadow:
        0 8px 32px
        rgba(17,21,34,.045);

    color:var(--bbox-text);
}

.site-header .container{
    position:relative;
}

.brand{
    display:flex;
    align-items:center;
    gap:var(--bbox-space-3);
}

.brand b{
    display:block;
    font-family:Arial,sans-serif;
}

.brand-mark{
    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border-radius:12px;

    background:
        linear-gradient(
            145deg,
            #e6b63b,
            #c79012
        );

    color:#101318;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.55),
        0 8px 18px rgba(175,124,9,.14);
}

.announcement{
    position:relative;

    background:
        linear-gradient(
            90deg,
            #12161d,
            #1a2028 48%,
            #12161d
        );

    color:#f0cf70;

    font-size:var(--bbox-text-xs);

    border-bottom:
        1px solid
        rgba(213,164,42,.32);
}

.announcement:before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 50% -150%,
            rgba(221,177,58,.2),
            transparent 58%
        );
}

.announcement .container{
    position:relative;
    z-index:1;

    min-height:var(--bbox-announcement-height);

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

    gap:var(--bbox-space-4);
}

.announcement a{
    color:#f7dd93;
    font-weight:800;
    text-decoration:none;
}

.announcement a:hover{
    color:#fff1c7;
}

.bbox-secondary-menu{
    border-top:
        1px solid
        rgba(213,164,42,.15);
}

.bbox-secondary-menu ul{
    display:flex;
    flex-wrap:wrap;
    align-items:center;

    gap:var(--bbox-space-6);

    list-style:none;

    margin:0;
    padding:9px 0;
}

.bbox-secondary-menu a{
    color:#5d6470;

    font-size:12px;

    text-decoration:none;
}

.bbox-cart-count{
    min-width:18px;
    min-height:18px;

    display:inline-grid;
    place-items:center;

    padding-inline:3px;

    border-radius:999px;

    background:
        linear-gradient(
            145deg,
            #e7b83e,
            #c99418
        );

    color:#11151b;

    font-size:10px;
    font-weight:900;
    line-height:1.6;

    box-shadow:
        0 3px 8px
        rgba(184,132,14,.22);
}

.header-actions .icon-button{
    position:relative;
}

.header-actions .bbox-cart-count{
    position:absolute;

    inset-block-start:-4px;
    inset-inline-end:-4px;
}

.bbox-transparent-header.home .site-header{
    background:
        rgba(255,253,248,.96);
}

:root{
    --bbox-logo-width:
        var(--bbox-setting-logo-width,160px);

    --bbox-logo-height:
        var(--bbox-setting-logo-height,42px);

    --bbox-desktop-header-height:
        var(--bbox-setting-header-height,88px);

    --bbox-announcement-height:25px;

    --bbox-mobile-header-height:70px;
}

/* BBOX 5.2.0 canonical luxury header finish */
.site-header{border-bottom-color:var(--bbox-gold-line);box-shadow:0 8px 32px rgb(17 15 10 / 5%);}
.header-actions .icon-button{transition:background var(--bbox-transition),border-color var(--bbox-transition),transform var(--bbox-transition);}
.header-actions .icon-button:hover{background:var(--bbox-gold-soft);border-color:var(--bbox-gold-line);transform:translateY(-1px);}

:root{
    --bbox-header-height:
        var(--bbox-mobile-header-height,70px);
}

.desktop-only,
.desktop-menu,
.announcement,
.bbox-secondary-menu{
    display:none;
}

.site-header{
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.99),
            rgba(253,250,243,.99)
        );

    box-shadow:
        0 6px 22px
        rgba(19,22,28,.055);
}

.header-main{
    min-height:
        var(--bbox-header-height);

    display:grid;

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

    grid-template-rows:
        1fr;

    align-items:center;

    direction:rtl;

    gap:8px;

    padding-inline:10px;
}

.header-main
> .mobile-only{
    grid-column:1;
    grid-row:1;
}

.header-main
> button.mobile-only{
    width:42px;
    height:42px;

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

    display:grid;
    place-items:center;

    padding:0;

    border:
        1px solid
        #ead9b4;

    border-radius:12px;

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

    color:#171b22;

    box-shadow:
        0 5px 13px
        rgba(28,23,13,.035);
}

.bbox-header-brand{
    grid-column:2;
    grid-row:1;

    justify-self:center;

    min-width:0;
}

.bbox-header-logo{
    display:block;

    line-height:0;
}

.bbox-header-logo>img,
.custom-logo{
    display:block;

    width:auto;
    height:36px;

    max-width:128px;

    object-fit:contain;

    padding:
        4px
        9px;

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

    border:
        1px solid
        #d7a72e;

    border-radius:12px;

    box-shadow:
        0 5px 14px
        rgba(151,108,12,.06);
}

.header-actions{
    grid-column:3;
    grid-row:1;

    justify-self:end;

    display:flex;
    align-items:center;

    gap:5px;
}

.header-actions
.icon-button.mobile-only{
    width:42px;
    height:42px;

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

    display:grid;
    place-items:center;

    padding:0;

    border:
        1px solid
        #ead9b4;

    border-radius:12px;

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

    color:#171b22;

    box-shadow:
        0 5px 13px
        rgba(28,23,13,.035);
}

.brand small{
    display:none;

    font-size:
        var(--bbox-text-xs);
}

.bbox-mobile-header-sticky
.site-header,

.bbox-sticky-header
.site-header{
    position:sticky;

    top:0;

    z-index:
        var(--bbox-layer-header);

    backdrop-filter:
        blur(15px)
        saturate(125%);
}

.admin-bar
.bbox-mobile-header-sticky
.site-header,

.admin-bar
.bbox-sticky-header
.site-header{
    top:46px;
}


/* BBOX 5.3.0 mobile premium compact header. */
.site-header{border-bottom:1px solid var(--bbox-gold-line);}
.header-main{padding-inline:12px;}
.header-main>button.mobile-only,
.header-actions .icon-button.mobile-only{box-shadow:0 8px 20px rgb(27 22 12 / 5%);}
