/* QT STOREFRONT HEADER UPDATE 8 — POC only. */

/* Use compact Lucide-style chevrons in the announcement bar. */
.qt-announcement-bar__arrow svg {
    display: block;
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.25;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Replace the malformed fallback mask from the earlier repair. */
body.qt-design-system #header .qt-header-wishlist,
body.qt-design-system #header .qt-header-wishlist a.wishlist_products_counter {
    overflow: visible !important;
}
body.qt-design-system #header .qt-header-wishlist a.wishlist_products_counter::before {
    width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;
    background-color: currentColor !important;
    background-image: none !important;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78Z'/%3E%3C/svg%3E") !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78Z'/%3E%3C/svg%3E") !important;
    -webkit-mask-position: center !important;
    mask-position: center !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
}

/* Selected top-level links use one uniform outline and never gain an underline. */
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-item:not(#mega-menu-item-317) > a.mega-menu-link,
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-menu-ancestor:not(#mega-menu-item-317) > a.mega-menu-link,
#mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-current-page-ancestor:not(#mega-menu-item-317) > a.mega-menu-link {
    border-color: #e1c8d6 !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* Compact Lucide-style category icons for the primary navigation. */
#mega-menu-item-337 > a.mega-menu-link,
#mega-menu-item-11681 > a.mega-menu-link {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
}
#mega-menu-item-337 > a.mega-menu-link::before,
#mega-menu-item-11681 > a.mega-menu-link::before {
    content: "";
    display: block;
    width: 17px !important;
    min-width: 17px !important;
    height: 17px !important;
    min-height: 17px !important;
    flex: 0 0 17px !important;
    line-height: 1 !important;
    background-color: transparent !important;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}
#mega-menu-item-317 > a.mega-menu-link::before,
#mega-menu-item-336 > a.mega-menu-link::before,
#mega-menu-item-11679 > a.mega-menu-link::before,
#mega-menu-item-11680 > a.mega-menu-link::before,
#mega-menu-item-11682 > a.mega-menu-link::before {
    content: none !important;
    display: none !important;
}
#mega-menu-item-317 > a.mega-menu-link {
    --qt-menu-icon-color: #ffffff;
}
#mega-menu-item-317 > a.mega-menu-link::before,
#mega-menu-item-11682 > a.mega-menu-link::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='7' height='7' x='3' y='3' rx='1'/%3E%3Crect width='7' height='7' x='14' y='3' rx='1'/%3E%3Crect width='7' height='7' x='14' y='14' rx='1'/%3E%3Crect width='7' height='7' x='3' y='14' rx='1'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='7' height='7' x='3' y='3' rx='1'/%3E%3Crect width='7' height='7' x='14' y='3' rx='1'/%3E%3Crect width='7' height='7' x='14' y='14' rx='1'/%3E%3Crect width='7' height='7' x='3' y='14' rx='1'/%3E%3C/svg%3E");
}
#mega-menu-item-336 > a.mega-menu-link {
    --qt-menu-icon-color: #8f4772;
}
#mega-menu-item-336 > a.mega-menu-link::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
}
#mega-menu-item-337 > a.mega-menu-link {
    --qt-menu-icon-color: #d0527f;
}
#mega-menu-item-337 > a.mega-menu-link::before {
    -webkit-mask-image: none !important;
    mask-image: none !important;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d0527f' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
#mega-menu-item-11679 > a.mega-menu-link {
    --qt-menu-icon-color: #2f8f83;
}
#mega-menu-item-11679 > a.mega-menu-link::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13M19 12v9H5v-9M7.5 8a2.5 2.5 0 1 1 4.5-1.5V8M16.5 8A2.5 2.5 0 1 0 12 6.5V8'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13M19 12v9H5v-9M7.5 8a2.5 2.5 0 1 1 4.5-1.5V8M16.5 8A2.5 2.5 0 1 0 12 6.5V8'/%3E%3C/svg%3E");
}
#mega-menu-item-11680 > a.mega-menu-link {
    --qt-menu-icon-color: #4979aa;
}
#mega-menu-item-11680 > a.mega-menu-link::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.5-3.5L5 21'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.5-3.5L5 21'/%3E%3C/svg%3E");
}
#mega-menu-item-11681 > a.mega-menu-link {
    --qt-menu-icon-color: #d38a22;
}
#mega-menu-item-11681 > a.mega-menu-link::before {
    -webkit-mask-image: none !important;
    mask-image: none !important;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d38a22' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2c1.8 2.2 3 4.1 3 6a3 3 0 0 1-6 0c0-1.9 1.2-3.8 3-6Z'/%3E%3Cpath d='M4 14h16c0 4.4-3.6 8-8 8s-8-3.6-8-8ZM2 14h20'/%3E%3C/svg%3E") center / contain no-repeat !important;
}
#mega-menu-item-11682 > a.mega-menu-link {
    --qt-menu-icon-color: #6f4ca0;
}

/* Mobile/off-canvas menus: every expandable level shares one right-side arrow column. */
@media (max-width: 999px) {
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 ul.mega-sub-menu,
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 ul.mega-sub-menu > li.mega-menu-item,
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-item {
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
        float: none !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 ul.mega-sub-menu {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 ul.mega-sub-menu > li.mega-menu-item {
        grid-column: 1 / -1 !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item,
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item {
        width: 100% !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-item-has-children > a.mega-menu-link {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
        position: relative !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 li.mega-menu-item-has-children > a.mega-menu-link > .mega-indicator {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 32px !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        position: absolute !important;
        top: 50% !important;
        right: 0 !important;
        margin: 0 !important;
        transform: translateY(-50%) !important;
        box-sizing: border-box !important;
    }
}

@media (min-width: 1000px) {
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 {
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 > li:not(#mega-menu-item-317) > a.mega-menu-link {
        padding-right: 13px !important;
        padding-left: 13px !important;
        white-space: nowrap !important;
        font-size: 13.5px !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 > #mega-menu-item-317 > ul.mega-sub-menu {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        align-items: start !important;
        gap: 0 !important;
    }
    #mega-menu-wrap-menu_1 #mega-menu-menu_1 > #mega-menu-item-317 > ul.mega-sub-menu > li.mega-menu-item {
        float: none !important;
        grid-column: auto !important;
        width: auto !important;
        max-width: none !important;
    }
}
