/* Default storefront header only; no mobile/short-header overrides. */
.aride-header-spacer { display: none; overflow-anchor: none; }
/* Shared bounds for the legacy desktop/tablet menu and the sticky header.
   Mobile drawer (<=600px) deliberately keeps its own layout. */
@media (min-width: 601px) {
    .aride-desktop-header.aride-menu--bounded .bm > .bm-main > ul {
        width: 256px;
        box-sizing: border-box;
    }
    .aride-desktop-header.aride-menu--bounded:not(.aride-header--compact) .bm > .bm-main > ul {
        left: 0;
        top: 100%;
    }
    .aride-desktop-header.aride-menu--bounded .bm > .bm-main > ul > li > ul {
        left: 256px;
        top: 0;
        width: var(--aride-menu-pane-width);
        min-width: 0;
        min-height: 0;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    .aride-desktop-header.aride-menu--bounded .bm > .bm-main > ul > li > ul > li {
        width: 100%;
        min-width: 0;
        min-height: 0;
        max-height: var(--aride-menu-max-height);
        box-sizing: border-box;
        overflow-y: auto;
    }
    .aride-desktop-header.aride-menu--bounded .bm-catalog {
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        max-height: none;
        overflow: visible;
        box-sizing: border-box;
    }
    .aride-desktop-header.aride-menu--bounded .bm-first .bm-catalog,
    .aride-desktop-header.aride-menu--bounded .bm-second .bm-catalog > ul {
        grid-template-columns: repeat(var(--aride-menu-columns, 4), minmax(0, 1fr)) !important;
    }
    .aride-desktop-header.aride-menu--bounded .bm-catalog > ul { min-width: 0; }
    .aride-desktop-header.aride-menu--bounded .bm-catalog ul ul {
        display: block;
        grid-template-columns: none !important;
    }
    .aride-desktop-header.aride-menu--bounded .bm-catalog a,
    .aride-desktop-header.aride-menu--bounded .bm-header { overflow-wrap: anywhere; }
    .aride-desktop-header.aride-menu--bounded .bm-vendor a { white-space: normal; }
}
@media (min-width: 1024px) {
    html.aride-has-compact-header { scroll-padding-top: 64px; }
    .aride-header-spacer.is-active { display: block; }
    .header.aride-desktop-header.aride-header--compact {
        position: fixed;
        inset: 0 0 auto;
        z-index: 20;
        display: grid;
        grid-template-columns: 128px 120px minmax(180px, 1fr) max-content 40px;
        align-items: center;
        gap: 12px;
        box-sizing: border-box;
        height: 56px;
        padding: 8px max(16px, calc((100% - 1280px) / 2));
        background: #fff;
        border-bottom: 1px solid #e2e5eb;
        box-shadow: 0 4px 12px rgb(31 41 55 / 10%);
        overflow-anchor: none;
    }
    .aride-header--compact .new-aride-header-2,
    .aride-header--compact .new-aride-header-2-inner,
    .aride-header--compact .bm-wrap,
    .aride-header--compact .bm { display: contents; }
    .aride-header--compact .flow-top,
    .aride-header--compact .bm-wrap > .mobile-menu-close,
    .aride-header--compact .bm > li:not(.bm-main),
    .aride-header--compact .new-mobile-part,
    .aride-header--compact .new-phones-show > .phone-replace:first-child,
    .aride-header--compact .phone-replace > div:not(:first-child),
    .aride-header--compact .head-email .user-select { display: none !important; }
    .aride-header--compact .new-logo-header { grid-column: 1; grid-row: 1; }
    .aride-header--compact .new-logo-header a { display: flex; align-items: center; }
    .aride-header--compact .new-logo-header .logo { width: 128px; height: 36px; }
    .aride-header--compact .bm > .bm-main {
        display: block !important;
        position: relative;
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        align-self: stretch;
    }
    .aride-header--compact .bm > .bm-main > a {
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 40px;
        padding: 0 12px;
        font: bold 14px/1.2 Arial, sans-serif;
        white-space: nowrap;
        color: #fff;
        background: #d91c30;
        border-radius: 8px;
    }
    .aride-header--compact .bm > .bm-main > a:hover { background: #c6172a; }
    .aride-header--compact .bm > .bm-main > a > span { display: none; }
    .aride-header--compact .bm > .bm-main::after {
        /* Keep hover while crossing the header's bottom padding. */
        content: "";
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        height: var(--aride-menu-bridge, 8px);
    }
    .aride-header--compact .bm > .bm-main > ul {
        display: none;
        /* One shared viewport-based origin for the sidebar and mega panel.
           The catalog button is intentionally not their containing block. */
        position: fixed;
        top: var(--aride-menu-top, 56px);
        left: var(--aride-menu-left, 16px);
        width: 256px;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }
    .aride-header--compact.is-catalog-open .bm > .bm-main > ul { display: block; }
    .aride-header--compact .bm > .bm-main > ul > li > ul {
        left: 256px;
        top: 0;
        width: var(--aride-menu-pane-width, calc(100vw - 304px));
        min-width: 0;
        min-height: 0;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    .aride-header--compact .bm > .bm-main > ul > li > ul > li {
        /* Bound the entire legacy wrapper, not just its inner grid. */
        width: 100%;
        min-width: 0;
        min-height: 0;
        max-height: calc(100vh - var(--aride-menu-top, 56px) - 16px);
        padding: 16px;
        box-sizing: border-box;
        overflow-y: auto;
    }
    .aride-header--compact .bm > .bm-main > ul > li:focus-within > ul { display: block !important; }
    .aride-header--compact .bm > .bm-main > ul:focus-within > li:not(:focus-within) > ul { display: none !important; }
    .aride-header--compact .bm > .bm-main > ul > li > a {
        padding: 9px 16px !important; /* Overrides the legacy inline stylesheet's !important padding. */
        display: flex;
        align-items: center;
        font-size: 14px;
        line-height: 18px;
    }
    .aride-header--compact .bm > .bm-main > ul > li > a img { width: 18px; height: 18px; object-fit: contain; }
    .aride-header--compact .bm > .bm-main > ul > li > a i { font-size: 18px !important; }
    .aride-header--compact .bm-catalog {
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
        max-height: none;
        overflow: visible;
    }
    .aride-header--compact .bm-first .bm-catalog,
    .aride-header--compact .bm-second .bm-catalog ul {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    .aride-header--compact .bm-catalog > ul { min-width: 0; }
    .aride-header--compact .bm-header { margin-bottom: 16px; font-size: 22px; line-height: 1.2; }
    .aride-header--compact .bm-catalog a,
    .aride-header--compact .bm-header { overflow-wrap: anywhere; }
    .aride-header--compact .head-search {
        grid-column: 3;
        grid-row: 1;
        min-width: 0;
        width: 100%;
    }
    .aride-header--compact .head-search input { height: 40px; padding-right: 48px; border-radius: 8px; }
    /* The input's border is its sole focus indicator: never add a second frame. */
    .aride-header--compact .head-search input:focus {
        border-color: #d91c30 !important;
        outline: none !important;
        box-shadow: none;
    }
    .aride-header--compact .head-search button {
        width: 32px;
        height: 32px;
        padding: 0;
        right: 4px;
        top: 4px;
        margin: 0;
        background: #d91c30;
    }
    .aride-header--compact .head-search button i { font-size: 16px; }
    .aride-header--compact .head-search button:hover { background: #c6172a; }
    .aride-header--compact .head-search .search-output {
        left: 0 !important;
        top: 100%;
        width: 100% !important;
        padding: 12px !important;
        max-height: calc(100vh - 80px);
        overflow-y: auto;
    }
    .aride-header--compact .new-phones-wrap { grid-column: 4; grid-row: 1; padding: 0; }
    .aride-header--compact .new-phones-show .phone-replace { display: block; }
    .aride-header--compact .new-phones-show .main_phone2 {
        display: inline-flex;
        align-items: center;
        min-height: 40px;
        color: #1f2937;
        font: 16px/1.2 Arial, sans-serif;
        white-space: nowrap;
    }
    .aride-header--compact .main_phone2::before {
        content: '\f095';
        margin-right: 8px;
        font: 900 18px/1 "Font Awesome 6 Free";
    }
    .aride-header--compact .head-email { grid-column: 5; grid-row: 1; }
    .aride-header--compact .top-buttons > .flow-cart { width: 40px; height: 40px; box-sizing: border-box; padding: 0; border-radius: 8px; }
    .aride-header--compact .flow-cart i.fa { margin-top: 12px; font-size: 16px; }
    .aride-header--compact .flow-cart > .flow-badge {
        top: 0;
        right: 0;
        margin: -5px -5px 0 0;
        border-radius: 999px;
    }
    .aride-header--compact :is(a, button, [role="button"]):focus-visible {
        outline: 2px solid #1f2937 !important;
        outline-offset: 3px;
    }
}