html {
    scrollbar-gutter: stable;
}

body.swal2-shown {
    padding-right: 0 !important;
    overflow-x: hidden !important;
}

body.swal2-iosfix {
    width: 100%;
}

body.swal2-shown .wsmenucontainer,
body.swal2-shown #headroom {
    max-width: 100%;
}

body .topbar-right-menu .notification-list > .nav-link,
body .topbar-right-menu .notification-list > a {
    position: relative;
    display: inline-flex;
    align-items: center;
}

body .topbar-right-menu .notification-list .noti-icon-badge {
    top: -4px;
    right: 4px;
}

body #headroom a:focus,
body #headroom button:focus {
    outline: none !important;
    box-shadow: none !important;
}

body #headroom a:focus-visible,
body #headroom button:focus-visible {
    outline: 2px solid #ff6002 !important;
    outline-offset: 2px;
    box-shadow: none !important;
    border-radius: 4px;
}

.cart-noti .slimScrollDiv {
    height: auto !important;
    max-height: 242px !important;
}

.cart-noti .slimScrollDiv .slimscroll,
.cart-noti > .slimscroll {
    height: auto !important;
    max-height: 242px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

@media (min-width: 1301px) {
    body #headroom {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    body #headroom .wsmobileheader {
        display: none !important;
    }

    body.headroom nav.wsmenu {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex: 1 1 auto;
        min-width: 0;
        height: 75px;
        margin: 0 !important;
        padding: 0 16px 0 0;
    }

    body #headroom nav.wsmenu > .wsmenu-list.mobile-sub {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        padding: 0 0 0 240px;
    }

    body #headroom nav.wsmenu > .wsmenu-list.mobile-sub > li {
        display: block;
        flex: 0 0 auto;
    }

    body #headroom nav.wsmenu > .brand {
        display: flex;
        align-items: center;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 16px;
        width: 224px;
        min-width: 224px;
    }

    body .wsmenucontainer nav.wsmenu .brand a {
        padding: 0;
    }

    body .wsmenucontainer nav.wsmenu .brand .logo {
        width: 224px;
        min-width: 224px;
        white-space: nowrap;
    }

    body .wsmenucontainer nav.wsmenu .wsmenu-list li > a {
        padding: 0 16px;
        white-space: nowrap;
    }

    body #headroom > .header-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex: 0 0 auto;
        min-width: 320px;
        height: 75px;
        margin: 0;
        padding-right: 12px;
        gap: 8px;
    }

    body #headroom > .header-actions.is-guest {
        min-width: 430px;
    }

    body #headroom > .header-actions > .topbar-right-menu,
    body #headroom > .header-actions > .wsmenu-right {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
        float: none !important;
    }

    body #headroom > .header-actions > .topbar-right-menu > li,
    body #headroom > .header-actions > .wsmenu-right > li {
        display: flex;
        align-items: center;
        float: none;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list:first-child {
        align-self: stretch;
        display: flex;
        align-items: center;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list > .notification-icon-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }

    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list.show > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list.open > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown.show {
        top: 75px !important;
        right: 0 !important;
        left: auto !important;
        overflow: visible !important;
        margin-top: 0 !important;
    }

    body .topbar-right-menu .notification-list.show > .dropdown-menu.notification-dropdown:before,
    body .topbar-right-menu .notification-list.open > .dropdown-menu.notification-dropdown:before,
    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown.show:before {
        top: -7px;
        right: 18px;
        border-width: 0 7px 7px 7px;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list {
        align-self: stretch;
        display: flex;
        align-items: center;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link .noti-icon {
        margin-top: 0 !important;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link .noti-icon-badge {
        top: 10px;
        right: 4px;
    }

    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list.show > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list.open > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti.show {
        top: 75px !important;
        right: 0 !important;
        left: auto !important;
        overflow: visible !important;
        margin-top: 0 !important;
    }

    body .topbar-right-menu .notification-list.cart-items-list.show > .dropdown-menu.cart-noti:before,
    body .topbar-right-menu .notification-list.cart-items-list.open > .dropdown-menu.cart-noti:before,
    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti.show:before {
        content: "";
        position: absolute;
        top: -7px;
        right: 18px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 7px 7px 7px;
        border-color: transparent transparent #232323 transparent;
        display: block !important;
        z-index: 2;
    }
}

@media (max-width: 1300px) {
    body #headroom > .header-actions {
        position: absolute;
        top: 0;
        right: 0;
        height: 75px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding-right: 10px;
        z-index: 1003;
    }

    body #headroom > .header-actions > .topbar-right-menu,
    body #headroom > .header-actions > .wsmenu-right {
        display: flex;
        align-items: center;
        height: 75px;
        margin: 0;
        padding: 0;
        float: none !important;
    }

    body #headroom > .header-actions > .topbar-right-menu > li,
    body #headroom > .header-actions > .wsmenu-right > li {
        display: flex;
        align-items: center;
        height: 75px;
        float: none;
    }

    body #headroom > .header-actions > .topbar-right-menu > li > a,
    body #headroom > .header-actions > .wsmenu-right > li > a,
    body #headroom > .header-actions > .topbar-right-menu > li > .nav-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 75px;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body #headroom > .header-actions .notification-list > .notification-icon-link,
    body #headroom > .header-actions .notification-list > .cart-icon-link {
        position: relative;
    }

    body #headroom > .header-actions .notification-list .noti-icon {
        margin-top: 0 !important;
        padding: 0 10px;
    }

    body #headroom > .header-actions .notification-list .noti-icon-badge {
        top: 16px;
        right: 1px;
    }

    body #headroom > .header-actions .nav-user {
        display: inline-flex;
        align-items: center;
        min-height: 75px;
        padding: 0 0 0 8px !important;
    }

    body #headroom > .header-actions .nav-user img {
        margin-right: 6px;
    }
}

@media (min-width: 768px) and (max-width: 1300px) {
    body #headroom > .header-actions > .topbar-right-menu > .notification-list:first-child,
    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list {
        align-self: stretch;
        display: flex;
        align-items: center;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list > .notification-icon-link,
    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link .noti-icon {
        margin-top: 0 !important;
    }

    body #headroom > .header-actions > .topbar-right-menu > .notification-list.cart-items-list > .cart-icon-link .noti-icon-badge {
        top: 16px;
        right: 1px;
    }

    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list.show > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list.open > .dropdown-menu.notification-dropdown,
    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown.show,
    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list.show > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list.open > .dropdown-menu.cart-noti,
    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti.show {
        top: 75px !important;
        right: 0 !important;
        left: auto !important;
        overflow: visible !important;
        margin-top: 0 !important;
    }

    body .topbar-right-menu .notification-list.show > .dropdown-menu.notification-dropdown:before,
    body .topbar-right-menu .notification-list.open > .dropdown-menu.notification-dropdown:before,
    body .topbar-right-menu .notification-list > .dropdown-menu.notification-dropdown.show:before,
    body .topbar-right-menu .notification-list.cart-items-list.show > .dropdown-menu.cart-noti:before,
    body .topbar-right-menu .notification-list.cart-items-list.open > .dropdown-menu.cart-noti:before,
    body .topbar-right-menu .notification-list.cart-items-list > .dropdown-menu.cart-noti.show:before {
        top: -7px;
        right: 18px;
        border-width: 0 7px 7px 7px;
    }
}

@media (max-width: 767px) {
    body #headroom {
        position: relative;
        min-height: 75px;
    }

    body .wsmenucontainer nav.wsmenu {
        position: fixed !important;
        top: 75px !important;
        left: -100vw !important;
        width: min(320px, 100vw) !important;
        max-width: 100vw !important;
        height: calc(100vh - 75px) !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-right: 1px solid #1c1c1c;
        z-index: 1004;
    }

    body .wsoffcanvasopener nav.wsmenu {
        left: 0 !important;
    }

    body .wsoffcanvasopener .overlapblackbg {
        display: block !important;
        top: 75px !important;
        height: calc(100vh - 75px) !important;
        z-index: 1003 !important;
    }

    body .wsmenucontainer nav.wsmenu .brand {
        display: block;
        width: 100%;
        float: none !important;
        margin: 0 0 12px;
        padding: 0 0 8px;
        border-bottom: 1px solid #1c1c1c;
    }

    body .wsmenucontainer nav.wsmenu .brand a {
        padding: 16px 20px 12px;
    }

    body .wsmenucontainer nav.wsmenu .wsmenu-list {
        display: block !important;
        width: 100%;
        height: auto;
        padding-bottom: 16px;
    }

    body #headroom .wsmobileheader {
        display: block !important;
        position: relative;
        height: 75px;
        z-index: 1004;
    }

    body #headroom .wsmobileheader #wsnavtoggle {
        position: absolute;
        top: 50%;
        left: 16px;
        transform: translateY(-50%);
    }

    body #headroom > .header-actions {
        position: absolute;
        top: 0;
        right: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: auto;
        max-width: calc(100% - 72px);
        height: 75px;
        margin: 0;
        padding-right: 16px;
        z-index: 1005;
    }

    body #headroom > .header-actions > .wsmenu-right {
        display: none !important;
    }

    body #headroom > .header-actions > .topbar-right-menu {
        display: flex;
        align-items: center;
        height: 75px;
        margin: 0;
        padding: 0;
        float: none !important;
    }

    body #headroom > .header-actions > .topbar-right-menu > li {
        display: flex;
        align-items: center;
        height: 75px;
        float: none;
    }

    body #headroom > .header-actions > .topbar-right-menu > li > .nav-link,
    body #headroom > .header-actions > .topbar-right-menu > li > a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 75px;
        padding: 0 8px !important;
    }

    body #headroom > .header-actions .notification-list .noti-icon {
        margin-top: 0 !important;
        padding: 0 6px;
    }

    body #headroom > .header-actions .notification-list .noti-icon-badge {
        top: 14px;
        right: 2px;
    }

    body #headroom > .header-actions .nav-user {
        display: inline-flex;
        align-items: center;
        min-height: 75px;
        padding: 0 0 0 6px !important;
    }

    body #headroom > .header-actions .nav-user img {
        margin-right: 0;
    }

    body #headroom > .header-actions .nav-user span {
        display: none;
    }

    body.front-cart-mobile-active .wsmenucontainer,
    body.front-cart-mobile-active #headroom,
    body.front-cart-mobile-active #headroom nav.wsmenu,
    body.front-cart-mobile-active #headroom .header-actions,
    body.front-cart-mobile-active .topbar-right-menu,
    body.front-cart-mobile-active .cart-items-list,
    body.front-cart-mobile-active .notification-list {
        overflow: visible !important;
    }

    .cart-items-list {
        position: relative;
    }

    .cart-items-list .cart-noti.cart-mobile-dropdown {
        position: fixed;
        top: 87px !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        min-width: 0;
        max-width: none !important;
        max-height: calc(100vh - 108px);
        margin-top: 0 !important;
        overflow: visible !important;
        transform: none !important;
        z-index: 1075;
    }

    .cart-items-list .cart-noti.cart-mobile-dropdown.show {
        visibility: visible !important;
        opacity: 1 !important;
    }

    .cart-items-list .cart-noti.cart-mobile-dropdown:before {
        display: none !important;
    }

    .cart-items-list .cart-noti.cart-mobile-dropdown .cart-mobile-tip {
        position: absolute;
        top: -12px;
        left: 50%;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 12px 12px 12px;
        border-color: transparent transparent #232323 transparent;
        transform: translateX(-50%);
        display: block;
        z-index: 2;
        pointer-events: none;
    }

    .cart-noti.cart-mobile-dropdown .slimscroll {
        max-height: min(190px, calc(100vh - 220px)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .cart-noti.cart-mobile-dropdown .notify-item {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 8px;
        padding-right: 15px;
    }

    .cart-noti.cart-mobile-dropdown .notify-item a {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        float: none;
        white-space: normal;
    }

    .cart-noti.cart-mobile-dropdown .notify-item form {
        flex: 0 0 70px;
        width: 70px;
        float: none;
        padding-left: 0;
    }

    .cart-noti.cart-mobile-dropdown .notify-item .item_price {
        flex: 0 0 auto;
        width: auto;
        float: none;
        text-align: left;
        padding-right: 0;
    }

    .cart-noti.cart-mobile-dropdown .notify-item .btn {
        float: none;
        margin-top: 0;
    }

    .swal2-container {
        z-index: 3000 !important;
    }
}