/*
 * Desktop header — own component (>=993px)
 * Replaces GP header completely. All values measured from GP original.
 *
 * GP uses: fluid-header (full-width bg) + contained inner (grid-container)
 * grid-container = max-width: 1200px, margin: 0 auto, padding: 0 40px
 */

.hs-desktop-header { display: none; }

@media (min-width: 993px) {

    .hs-desktop-header {
        display: block;
        position: sticky;
        top: 0;
        z-index: 500;
    }
    .hs-dh-topbar {
        overflow: hidden;
        max-height: 42px;
        transition: max-height 0.3s ease, padding 0.3s ease, opacity 0.3s ease;
        opacity: 1;
    }
    .hs-desktop-header.is-scrolled .hs-dh-topbar {
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }

    header#masthead, #secondary-navigation, .topbar { display: none !important; }
    .hs-header-search { display: none !important; }
    .menu-bar-items .dgwt-wcas-menu-bar-item,
    .navigation-search,
    .menu-bar-items .search-item { display: none !important; }

    /* ===== TOPBAR ===== */
    .hs-dh-topbar { background: var(--bright-blue, #4FC6F0); padding: 10px 20px; }
    .hs-dh-topbar-inner { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 30px; }
    .hs-dh-topbar-item {
        display: flex; align-items: center; gap: 6px;
        font-size: 13px; font-weight: 600; color: #fff;
        font-family: 'Quicksand', sans-serif; white-space: nowrap;
    }
    .hs-dh-topbar-item svg { flex-shrink: 0; opacity: 0.9; }

    /* ===== HEADER ROW ===== */
    .hs-dh-header-wrap { background: var(--base, #fffcf9); border-bottom: 1px solid var(--gray, rgba(0,0,0,0.1)); }
    .hs-dh-header {
        max-width: 1200px; margin: 0 auto; padding: 10px 40px;
        display: flex; align-items: center; gap: 24px;
    }

    .hs-dh-logo { flex-shrink: 0; line-height: 0; animation: gelatine 0.5s; }
    .hs-dh-logo img { width: 140px; height: auto; transform: rotate(-5deg); }

    .hs-dh-search { flex: 1; position: relative; margin: 0 24px; }
    .hs-dh-search .dgwt-wcas-search-wrapp { max-width: 100% !important; margin: 0 !important; padding: 0 !important; }
    .hs-dh-search .dgwt-wcas-sf-wrapp { background: transparent !important; padding: 0 !important; margin: 0 !important; border: none !important; box-shadow: none !important; }
    .hs-desktop-header .hs-dh-search input[type="search"].dgwt-wcas-search-input {
        border: 1.5px solid var(--bright-blue, #4FC6F0) !important; border-radius: 999px !important;
        background: transparent !important; height: 42px !important; font-size: 14px !important;
        font-family: 'Quicksand', sans-serif !important; font-weight: 500 !important;
        box-shadow: none !important; outline: none !important;
        padding-left: 18px !important; padding-right: 44px !important;
        transition: border-color 0.2s ease !important;
    }
    .hs-desktop-header .hs-dh-search input[type="search"].dgwt-wcas-search-input:focus,
    .hs-desktop-header .hs-dh-search input[type="search"].dgwt-wcas-search-input:hover {
        border-color: var(--bright-pink, #FA69A8) !important;
    }
    .hs-dh-search .dgwt-wcas-search-submit { display: none !important; }
    .hs-dh-search .dgwt-wcas-ico-magnifier,
    .hs-dh-search .dgwt-wcas-ico-magnifier-handler,
    .hs-dh-search .dgwt-wcas-search-icon-handler { display: none !important; }
    .hs-dh-search::after {
        content: ''; position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
        width: 18px; height: 18px; pointer-events: none; z-index: 5; transition: background-image 0.2s ease;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234FC6F0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat center / contain;
    }
    .hs-dh-search:hover::after, .hs-dh-search:focus-within::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FA69A8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    }
    .hs-dh-search .dgwt-wcas-close { right: 36px !important; }

    .hs-dh-links { display: flex; gap: 16px; flex-shrink: 0; }
    .hs-dh-links a {
        font-size: 14px; color: #666; text-decoration: none;
        font-family: 'Quicksand', sans-serif; font-weight: 600; transition: color 0.15s ease;
    }
    .hs-dh-links a:hover { color: var(--bright-blue, #4FC6F0); }

    .hs-dh-cart {
        flex-shrink: 0; display: flex; align-items: center; position: relative;
        color: var(--contrast-2, #575760); text-decoration: none; padding: 4px;
        font-size: 24px; transition: color 0.15s ease;
    }
    .hs-dh-cart:hover { animation: gelatine 0.5s; color: var(--accent-pink-dark, #FA69A8); }
    .hs-dh-cart-count {
        position: absolute; top: -4px; right: -6px;
        background: var(--accent-pink-dark, #FA69A8); color: #fff;
        font-size: 14px; font-weight: 700; font-family: 'Quicksand', sans-serif;
        min-width: 18px; height: 18px; line-height: 18px;
        text-align: center; border-radius: 9px; padding: 0 4px;
    }

    /* ===== CATEGORY BAR ===== */
    .hs-dh-catbar-wrap { background: var(--base, #fffcf9); box-shadow: 0 4px 2px -2px var(--gray, rgba(0,0,0,0.1)); }
    .hs-dh-catbar { max-width: 1200px; margin: 0 auto; padding: 0 40px; display: flex; justify-content: center; gap: 0; }

    .hs-dh-cat-item { position: relative; }
    .hs-dh-cat-link {
        display: block; padding: 10px 20px; font-size: 16px; font-weight: 600;
        font-family: 'Quicksand', sans-serif; color: var(--contrast-2, #575760);
        text-decoration: none; transition: color 0.15s ease;
    }
    .hs-dh-cat-item:hover .hs-dh-cat-link,
    .hs-dh-cat-item.is-active .hs-dh-cat-link { color: var(--accent-pink-dark, #FA69A8); }

    /* ===== MEGA MENU ===== */
    .hs-dh-mega {
        position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
        opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0.2s ease;
        z-index: 1000; padding-top: 0;
    }
    .hs-dh-cat-item:hover .hs-dh-mega { opacity: 1; visibility: visible; }

    .hs-dh-mega-inner {
        background: var(--base, #fffcf9);
        border-top: 2.5px solid var(--accent-pink-dark, #FA69A8);
        border-radius: 0 0 10px 10px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.10);
        padding: 24px 28px 20px; display: grid; gap: 20px;
    }
    .hs-dh-mega[data-cols="2"] .hs-dh-mega-inner { grid-template-columns: 1fr 1fr; min-width: 420px; }
    .hs-dh-mega[data-cols="3"] .hs-dh-mega-inner { grid-template-columns: 1fr 1fr 1fr; min-width: 560px; }
    .hs-dh-mega[data-cols="4"] .hs-dh-mega-inner { grid-template-columns: 1fr 1fr 1fr 1fr; min-width: 680px; }

    .hs-dh-mega-col + .hs-dh-mega-col { border-left: 1px solid var(--base-2, #faf5f1); padding-left: 20px; }

    .hs-dh-mega-heading {
        display: block; font-size: 17px; font-weight: 700; font-family: 'Quicksand', sans-serif;
        color: var(--accent-pink-dark, #FA69A8); text-decoration: none;
        padding-bottom: 6px; margin-bottom: 6px;
        border-bottom: 1px solid var(--base-2, #faf5f1); transition: color 0.15s ease;
    }
    .hs-dh-mega-heading:hover { color: var(--accent-blue-dark, #4FC6F0); }

    .hs-dh-mega-desc { font-size: 13px; color: var(--contrast-3, #b2b2be); line-height: 1.5; margin: 0 0 8px; font-family: 'Quicksand', sans-serif; }

    .hs-dh-mega-viewall {
        font-size: 14px; color: var(--accent-blue-dark, #4FC6F0); text-decoration: none;
        font-family: 'Quicksand', sans-serif; font-weight: 600; transition: color 0.15s ease;
    }
    .hs-dh-mega-viewall:hover { color: var(--accent-pink-dark, #FA69A8); }

    .hs-dh-mega-children { list-style: none; margin: 0; padding: 0; }
    .hs-dh-mega-children li a {
        display: block; font-size: 14px; font-family: 'Quicksand', sans-serif;
        color: var(--contrast-2, #575760); text-decoration: none; padding: 5px 0;
        transition: color 0.15s ease, padding-left 0.15s ease;
    }
    .hs-dh-mega-children li a:hover { color: var(--accent-pink-dark, #FA69A8); padding-left: 4px; }
}

}

@media (max-width: 992px) { .hs-desktop-header { display: none !important; } }