/* Luxntek future navigation */

@media (min-width: 990px) {
    .top-header {
        height: auto !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    .top-header .container-fluid {
        display: block;
        padding-left: 15px;
        padding-right: 15px;
    }

    .top-header .container-fluid > .row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        gap: 0;
        width: 100% !important;
        max-width: none;
        margin: 0 !important;
    }

    .top-header .container-fluid > .row > [class*="col-"] {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .top-header .col-10.col-sm-8.col-md-5.col-lg-4 {
        flex: 0 0 33.333% !important;
        max-width: 33.333% !important;
    }

    .top-header .col-sm-4.col-md-4.col-lg-4.d-none.d-lg-none.d-md-block.d-lg-block {
        flex: 0 0 33.333% !important;
        max-width: 33.333% !important;
        display: block !important;
    }

    .top-header .col-2.col-sm-4.col-md-3.col-lg-4.text-right {
        flex: 0 0 33.333% !important;
        max-width: 33.333% !important;
    }

    .top-header .phone-no,
    .top-header .top-header_middle-text {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-height: 22px;
        line-height: 1.2;
        margin: 0 !important;
    }

    .top-header .text-right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        text-align: right !important;
    }

    .top-header .customer-links {
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px;
        margin: 0 !important;
    }

    .top-header .customer-links > li {
        position: relative;
        border-radius: 999px !important;
    }

    .top-header .customer-links > li > a {
        position: relative;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-height: 30px;
        padding: 0 12px !important;
        border-radius: 999px !important;
        color: #f7fbff !important;
        font-weight: 700 !important;
        letter-spacing: .055em !important;
        text-transform: uppercase;
        text-decoration: none !important;
        text-shadow: 0 1px 10px rgba(49, 189, 189, .15);
        transition: color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
    }

    .top-header .customer-links > li > a::after {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: 4px;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, transparent, #31bdbd, #ffcc00, transparent);
        opacity: 0;
        transform: scaleX(.35);
        transition: opacity .18s ease, transform .18s ease;
    }

    .top-header .customer-links > li > a:hover,
    .top-header .customer-links > li > a:focus {
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .1) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 10px 24px rgba(0, 0, 0, .18);
        transform: translateY(-1px);
        opacity: 1 !important;
    }

    .top-header .customer-links > li > a:hover::after,
    .top-header .customer-links > li > a:focus::after {
        opacity: 1;
        transform: scaleX(1);
    }

    #AccessibleNav {
        position: relative;
        display: flex !important;
        align-items: center;
        justify-content: center;
        min-height: 74px;
        z-index: 20;
    }

    #siteNav.nav-future {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: auto;
        max-width: calc(100vw - 440px);
        margin: 0 auto !important;
        padding: 8px !important;
        list-style: none;
        background: rgba(3, 28, 47, .84);
        border: 1px solid rgba(49, 189, 189, .38);
        border-radius: 999px !important;
        box-shadow: 0 18px 48px rgba(1, 28, 47, .22), inset 0 1px 0 rgba(255, 255, 255, .18);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
    }

    #siteNav.nav-future > li {
        display: inline-flex !important;
        position: relative;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 999px !important;
    }

    #siteNav.nav-future > li.parent.megamenu:before {
        content: "";
        position: absolute;
        left: -90px;
        right: -90px;
        top: 100%;
        height: 26px;
        z-index: 1000;
        background: transparent;
    }

    #siteNav.nav-future > li > a {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        padding: 0 17px !important;
        color: #f7fbff !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 40px !important;
        letter-spacing: .055em !important;
        text-transform: uppercase;
        text-decoration: none !important;
        text-shadow: 0 1px 10px rgba(49, 189, 189, .15);
        transition: color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
        white-space: nowrap;
    }

    #siteNav.nav-future > li > a:after {
        content: "";
        position: absolute;
        left: 18px;
        right: 18px;
        bottom: 7px;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, transparent, #31bdbd, #ffcc00, transparent);
        opacity: 0;
        transform: scaleX(.35);
        transition: opacity .18s ease, transform .18s ease;
    }

    #siteNav.nav-future > li:hover > a,
    #siteNav.nav-future > li > a:focus {
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .1) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 10px 24px rgba(0, 0, 0, .18);
        transform: translateY(-1px);
        opacity: 1 !important;
    }

    #siteNav.nav-future > li:hover > a:after,
    #siteNav.nav-future > li > a:focus:after {
        opacity: 1;
        transform: scaleX(1);
    }

    #siteNav.nav-future > li:last-child > a {
        color: #011c2f !important;
        background: linear-gradient(135deg, #ffcc00, #ffe46b) !important;
        box-shadow: 0 10px 26px rgba(255, 204, 0, .32);
        text-shadow: none;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 {
        top: 58px !important;
        left: var(--nav-future-mega-left, 0px) !important;
        right: auto !important;
        width: max-content !important;
        max-width: min(920px, calc(100vw - 100px)) !important;
        min-width: 0 !important;
        padding: 16px !important;
        overflow: hidden !important;
        pointer-events: auto !important;
        background: linear-gradient(145deg, #011c2f, #06364b) !important;
        border: 1px solid rgba(49, 189, 189, .42) !important;
        border-radius: 14px !important;
        box-shadow: 0 24px 56px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .14) !important;
        transform: translateY(10px) !important;
        transition: opacity .2s ease, visibility .2s ease, transform .2s ease !important;
    }

    #siteNav.nav-future > li.parent.megamenu:hover > .megamenu.style2,
    #siteNav.nav-future > li.parent.megamenu:focus-within > .megamenu.style2 {
        top: 54px !important;
        transform: translateY(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2:before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        border-radius: 14px;
        background: radial-gradient(circle at 18% 0%, rgba(49, 189, 189, .16), transparent 34%),
            radial-gradient(circle at 92% 8%, rgba(255, 204, 0, .10), transparent 30%);
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-grid,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid {
        position: relative;
        display: grid !important;
        grid-template-columns: repeat(var(--nav-mega-cols, 4), minmax(200px, 1fr));
        gap: 14px !important;
        padding: 0 !important;
        margin: 0 !important;
        width: max-content;
        max-width: 100%;
        white-space: normal !important;
        align-items: stretch !important;
        justify-content: start !important;
        justify-items: stretch !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .subLinks:empty {
        display: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        height: 0 !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-card--no-links {
        padding-bottom: 14px !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-card--no-links > a.site-nav.lvl-1 {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        border-bottom: 0 !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-card,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid > li {
        display: block !important;
        float: none !important;
        flex: none !important;
        grid-column: auto !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 16px !important;
        overflow: hidden !important;
        white-space: normal !important;
        background: rgba(255, 255, 255, .08) !important;
        border: 1px solid rgba(255, 255, 255, .12) !important;
        border-radius: 12px !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
        transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-card *,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid > li * {
        box-sizing: border-box !important;
        max-width: 100% !important;
        white-space: normal !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-card:hover,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid > li:hover {
        background: rgba(255, 255, 255, .13) !important;
        border-color: rgba(49, 189, 189, .5) !important;
        box-shadow: 0 18px 40px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
        transform: translateY(-2px);
    }

    #siteNav.nav-future > li .megamenu li.lvl-1 a.lvl-1 {
        display: block !important;
        align-items: center;
        justify-content: flex-start !important;
        gap: 5px;
        width: 100% !important;
        padding: 0 0 10px !important;
        color: #ffffff !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        line-height: 1.28 !important;
        letter-spacing: .01em !important;
        text-transform: uppercase;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: break-word !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    #siteNav.nav-future > li .megamenu li.lvl-1 a.lvl-1 .anm {
        display: none !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 li.has-product-submenu > ul.subLinks {
        display: block !important;
        position: static !important;
        min-width: 0 !important;
        padding: 2px 0 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 li.has-product-submenu > ul.subLinks > li {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 li.has-product-submenu > ul.subLinks > li > a,
    #siteNav.nav-future > li .megamenu li.lvl-1 li .site-nav {
        display: block !important;
        padding: 7px 0 !important;
        color: rgba(232, 250, 255, .78) !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1.35 !important;
        letter-spacing: .02em !important;
        text-transform: none;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 li.has-product-submenu > ul.subLinks > li > a:hover,
    #siteNav.nav-future > li .megamenu li.lvl-1 li .site-nav:hover {
        color: #ffcc00 !important;
        opacity: 1 !important;
        padding-left: 6px !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 ul.subLinks > li .site-nav:before {
        background-color: #31bdbd !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 a.site-nav.lvl-1:before,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 a.site-nav.lvl-1:after {
        display: none !important;
        content: none !important;
    }
}

@media (min-width: 990px) and (max-width: 1240px) {
    #siteNav.nav-future {
        max-width: calc(100vw - 360px);
        gap: 5px;
    }

    #siteNav.nav-future > li > a {
        padding-right: 13px !important;
        padding-left: 13px !important;
        font-size: 11px !important;
    }

    .top-header .customer-links > li > a {
        padding-right: 10px !important;
        padding-left: 10px !important;
        font-size: 11px !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 {
        width: min(860px, calc(100vw - 80px)) !important;
        max-width: calc(100vw - 80px) !important;
    }

    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-grid,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid {
        grid-template-columns: repeat(var(--nav-mega-cols, 4), minmax(170px, 1fr)) !important;
    }
}

@media (min-width: 990px) and (max-width: 1080px) {
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .nav-future-grid,
    #siteNav.nav-future > li.parent.megamenu > .megamenu.style2 .grid.mmWrapper > li > .grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
    }
}

@media only screen and (max-width: 991.98px) {
    .mobile-nav-wrapper {
        width: min(88vw, 360px) !important;
        left: min(-88vw, -360px) !important;
        background: linear-gradient(160deg, #011c2f, #06364b 58%, #042536) !important;
        border-right: 1px solid rgba(49, 189, 189, .35) !important;
        box-shadow: 18px 0 48px rgba(0, 0, 0, .34) !important;
        overflow: hidden !important;
    }

    .mobile-nav-wrapper.active {
        left: 0 !important;
    }

    .mobile-nav-wrapper:before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(circle at 18% 0%, rgba(49, 189, 189, .22), transparent 32%),
            radial-gradient(circle at 95% 12%, rgba(255, 204, 0, .14), transparent 30%);
        z-index: 0;
    }

    .mobile-nav-wrapper .closemobileMenu {
        position: relative;
        z-index: 1;
        min-height: 54px;
        padding: 18px 18px 14px !important;
        color: #ffffff !important;
        background: rgba(255, 255, 255, .08) !important;
        border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
        font-size: 12px !important;
        font-weight: 800;
        letter-spacing: .08em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .mobile-nav-wrapper .closemobileMenu .anm {
        color: #ffcc00 !important;
        font-size: 14px !important;
    }

    #MobileNav.mobile-future {
        position: relative;
        z-index: 1;
        height: calc(100% - 54px) !important;
        padding: 12px 12px 28px !important;
        margin: 0 !important;
        overflow: auto;
        list-style: none;
    }

    #MobileNav.mobile-future li {
        margin: 0 0 8px !important;
        border: 0 !important;
        position: relative;
    }

    #MobileNav.mobile-future li a {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        min-height: 46px;
        padding: 12px 14px !important;
        color: rgba(232, 250, 255, .92) !important;
        background: rgba(255, 255, 255, .08) !important;
        border: 1px solid rgba(255, 255, 255, .11) !important;
        border-radius: 12px !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
        font-size: 13px !important;
        font-weight: 750 !important;
        line-height: 1.25 !important;
        letter-spacing: .03em !important;
        text-transform: uppercase;
        text-decoration: none !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        opacity: 1 !important;
        position: relative;
    }

    #MobileNav.mobile-future li a::after {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: 6px;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, transparent, #31bdbd, #ffcc00, transparent);
        opacity: 0;
        transform: scaleX(.35);
        transition: opacity .18s ease, transform .18s ease;
        pointer-events: none;
    }

    #MobileNav.mobile-future li a:hover,
    #MobileNav.mobile-future li a:focus,
    #MobileNav.mobile-future li a:active,
    #MobileNav.mobile-future li a.mobile-link-active {
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .13) !important;
        border-color: rgba(49, 189, 189, .42) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 8px 20px rgba(0, 0, 0, .18);
        transform: translateY(-1px);
        opacity: 1 !important;
    }

    #MobileNav.mobile-future li a.mobile-link-active .anm {
        background: rgba(255, 204, 0, .18) !important;
    }

    #MobileNav.mobile-future li a:hover::after,
    #MobileNav.mobile-future li a:focus::after,
    #MobileNav.mobile-future li a:active::after,
    #MobileNav.mobile-future li a.mobile-link-active::after {
        opacity: 1;
        transform: scaleX(1);
    }

    #MobileNav.mobile-future > li:first-child > a,
    #MobileNav.mobile-future > li:nth-child(2) > a {
        background: rgba(49, 189, 189, .13) !important;
        border-color: rgba(49, 189, 189, .32) !important;
    }

    #MobileNav.mobile-future > li:nth-child(5) > a,
    #MobileNav.mobile-future > li > a[href*="shop"] {
        color: #011c2f !important;
        background: linear-gradient(135deg, #ffcc00, #ffe46b) !important;
        border-color: rgba(255, 204, 0, .48) !important;
        box-shadow: 0 12px 26px rgba(255, 204, 0, .24) !important;
    }

    #MobileNav.mobile-future li a .anm {
        position: static !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 30px;
        width: 30px !important;
        height: 30px !important;
        line-height: 30px !important;
        margin: -4px -4px -4px 0;
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .10);
        border-radius: 50% !important;
        text-align: center;
    }

    #MobileNav.mobile-future li ul {
        display: none;
        margin: 8px 0 2px 10px !important;
        padding: 8px 0 0 10px !important;
        background: transparent !important;
        border-left: 1px solid rgba(49, 189, 189, .30);
        list-style: none;
    }

    #MobileNav.mobile-future li li {
        margin-bottom: 7px !important;
    }

    #MobileNav.mobile-future li li a {
        min-height: 40px;
        padding: 10px 12px !important;
        color: rgba(232, 250, 255, .78) !important;
        background: rgba(255, 255, 255, .055) !important;
        border-color: rgba(255, 255, 255, .08) !important;
        font-size: 12px !important;
        font-weight: 650 !important;
        text-transform: none;
    }

    #MobileNav.mobile-future li li li a {
        min-height: 38px;
        padding: 9px 11px !important;
        color: rgba(232, 250, 255, .72) !important;
        background: rgba(0, 0, 0, .12) !important;
        font-size: 12px !important;
    }

    #MobileNav.mobile-future li.mobile-dropdown-open > a {
        color: #ffcc00 !important;
        border-color: rgba(49, 189, 189, .48) !important;
        background: rgba(255, 255, 255, .14) !important;
    }

    #MobileNav.mobile-future li.mobile-dropdown-open > a .anm {
        background: rgba(255, 204, 0, .18);
    }

    /* Match top-header dropdown pill style for main mobile nav links */
    #MobileNav.mobile-future > li > a {
        min-height: 34px !important;
        padding: 0 12px !important;
        color: #f7fbff !important;
        background: rgba(255, 255, 255, .08) !important;
        border: 1px solid rgba(255, 255, 255, .12) !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .05em !important;
        text-transform: uppercase !important;
        line-height: 1.2 !important;
        box-shadow: none !important;
    }

    #MobileNav.mobile-future > li > a::after {
        left: 12px;
        right: 12px;
        bottom: 5px;
    }

    #MobileNav.mobile-future > li > a:hover,
    #MobileNav.mobile-future > li > a:focus,
    #MobileNav.mobile-future > li > a:active,
    #MobileNav.mobile-future > li > a.mobile-link-active {
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .1) !important;
        border-color: rgba(255, 255, 255, .14) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 8px 20px rgba(0, 0, 0, .18) !important;
        transform: translateY(-1px);
        opacity: 1 !important;
    }

    #MobileNav.mobile-future > li > a:hover::after,
    #MobileNav.mobile-future > li > a:focus::after,
    #MobileNav.mobile-future > li > a:active::after,
    #MobileNav.mobile-future > li > a.mobile-link-active::after {
        opacity: 1;
        transform: scaleX(1);
    }

    /* Remove special one-off colors so all top-level links match */
    #MobileNav.mobile-future > li:first-child > a,
    #MobileNav.mobile-future > li:nth-child(2) > a,
    #MobileNav.mobile-future > li:nth-child(5) > a,
    #MobileNav.mobile-future > li > a[href*="shop"] {
        color: #f7fbff !important;
        background: rgba(255, 255, 255, .08) !important;
        border-color: rgba(255, 255, 255, .12) !important;
        box-shadow: none !important;
    }
}

@media (max-width: 989px) {
    .top-header {
        min-height: 38px;
    }

    .top-header .row {
        align-items: center !important;
        min-height: 20px;
    }

    .top-header .phone-no {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 20px;
        line-height: 1.2 !important;
        margin: 0 !important;
    }

    .top-header .col-10.col-sm-8.col-md-5.col-lg-4 {
        padding-left: 8px !important;
    }

    .top-header .col-2.col-sm-4.col-md-3.col-lg-4.text-right {
        padding-right: 8px !important;
    }

    .top-header .text-right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        text-align: right !important;
        position: static !important;
        position: relative !important;
        min-height: 20px;
    }

    .top-header .user-menu {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        margin: 0 !important;
        position: absolute !important;
        right: 0 !important;
        top: 50% !important;
        transform: translateY(-48%) !important;
        color: #fff !important;
        cursor: pointer;
    }

    .top-header .customer-links {
        display: none;
        align-items: center !important;
        position: absolute !important;
        top: 38px !important;
        right: 8px !important;
        z-index: 10003 !important;
        width: 196px !important;
        margin: 0 !important;
        padding: 6px !important;
        background: #011C2F !important;
        border: 1px solid rgba(49, 189, 189, .38) !important;
        border-radius: 12px !important;
        box-shadow: 0 12px 28px rgba(1, 28, 47, .22) !important;
        flex-direction: column !important;
        gap: 6px;
    }

    .top-header .active .customer-links {
        display: flex !important;
    }

    .top-header .customer-links li {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        text-align: left !important;
    }

    .top-header .customer-links li a {
        position: relative;
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        min-height: 34px;
        padding: 0 12px !important;
        color: #f7fbff !important;
        background: rgba(255, 255, 255, .08) !important;
        border: 1px solid rgba(255, 255, 255, .12) !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .05em !important;
        text-transform: uppercase;
        text-decoration: none !important;
        line-height: 1.2 !important;
        transition: color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
    }

    .top-header .customer-links li a::after {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: 5px;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, transparent, #31bdbd, #ffcc00, transparent);
        opacity: 0;
        transform: scaleX(.35);
        transition: opacity .18s ease, transform .18s ease;
    }

    .top-header .customer-links li a:hover,
    .top-header .customer-links li a:focus,
    .top-header .customer-links li a:active,
    .top-header .customer-links li a.mobile-link-active {
        color: #ffcc00 !important;
        background: rgba(255, 255, 255, .1) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 8px 20px rgba(0, 0, 0, .18);
        transform: translateY(-1px);
        opacity: 1 !important;
    }

    .top-header .customer-links li a:hover::after,
    .top-header .customer-links li a:focus::after,
    .top-header .customer-links li a:active::after,
    .top-header .customer-links li a.mobile-link-active::after {
        opacity: 1;
        transform: scaleX(1);
    }
}
