/* Extracted from Danish child 36c078e. See source-manifest.json. */
/* =========================================================
   MerchShark 2026 redesign — header + footer
   Primary: #214249 (deep teal)   Secondary: #0f172a (near-black)
   Font: Inter   Motion: none (instant snap)
   ========================================================= */

:root{
    --ms-teal:       #214249;
    --ms-teal-600:   #1a3439;
    --ms-teal-050:   #e8eef0;
    --ms-ink:        #0f172a;
    --ms-ink-700:    #334155;
    --ms-ink-500:    #64748b;
    --ms-line:       #e5e7eb;
    --ms-bg:         #ffffff;
    --ms-bg-alt:     #f8fafc;
    --ms-star:       #fbbf24;
    --ms-radius-sm:  8px;
    --ms-radius-md:  12px;
    --ms-radius-lg:  16px;
    --ms-shadow:     0 1px 2px rgba(15,23,42,.04), 0 4px 12px rgba(15,23,42,.06);
}

/* =========================================================
   Global trust strip (4,8 / 2.300+ Google reviews)
   Rendered directly under the site header — same bg as header,
   so it reads as a continuation of it. A single hairline border
   closes the header+trust unit off from page content.
   ========================================================= */
.ms-topbar-trust{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
    height: 26px !important;
    padding: 0 12px !important;
    margin: 0 !important;
    background: #fff !important;              /* match header */
    border: none !important;
    border-bottom: 1px solid var(--ms-line) !important;
    font: 500 11px/1 'Inter', sans-serif !important;
    color: var(--ms-ink-700) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    position: relative !important;
    z-index: 5 !important;
}

@media (max-width: 767px) {
    .ms-home-bestseller-deferred {
        margin-top: 4rem;
    }
}
.ms-topbar-trust:hover{ color: var(--ms-ink) !important; }
.ms-topbar-trust strong{
    color: var(--ms-ink) !important;
    font-weight: 800 !important;
}
.ms-topbar-trust .ms-ct-stars{
    color: #fbbf24 !important;
    letter-spacing: 1px !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}
.ms-topbar-trust .ms-ct-sep{ color: var(--ms-ink-500) !important; }
.ms-topbar-trust .ms-ct-g{
    font-weight: 700 !important;
    background: linear-gradient(90deg,#4285F4 0 25%,#EA4335 25% 50%,#FBBC05 50% 75%,#34A853 75% 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* On desktop, the Google trust is already surfaced as a pill inside the header
   row — hide the horizontal strip to avoid duplicate signal.
   Breakpoint matches parent main.js which only renders .desktop-container
   above 1199px (below, the DOM node is removed at load). */
@media (min-width: 1200px){
    .ms-topbar-trust{ display: none !important; }
}

/* =========================================================
   MOBILE HEADER  — single compact row: logo · search · cart · menu
   DOM is flattened by child template override (header-mobile.php),
   so this CSS targets the flat ms-mobile-header directly — no
   display:contents, which some browsers render unreliably.
   Breakpoint is 1199px (not the usual 991) because the parent's main.js
   removes .desktop-container at ≤1199 — so 992-1199 is effectively a
   "mobile DOM" zone and needs our mobile header styling too.
   ========================================================= */

@media (max-width: 1199px){

    header.mobile, .header-mobile{
        position: static !important;
        top: auto !important;
        left: auto !important;
        z-index: auto !important;
        background: #fff !important;
        border-bottom: 1px solid var(--ms-line) !important;
        box-shadow: none !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .ms-mobile-header{
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-wrap: nowrap !important;
        padding: 8px 12px !important;
        margin: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    /* Logo */
    .ms-mobile-header .ms-mh__logo{
        flex: 0 0 auto !important;
        display: block !important;
        line-height: 0 !important;
    }
    .ms-mobile-header .ms-mh__logo img{
        width: 68px !important;
        height: 30px !important;
        max-width: 68px !important;
        max-height: 30px !important;
        aspect-ratio: 9 / 4 !important;
        display: block !important;
    }

    /* Search — takes all leftover space (flex-basis 0) */
    .ms-mobile-header .ms-mh__search{
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell{
        position: relative !important;
        display: block !important;
        width: 100% !important;
    }
    .ms-mobile-header .ms-mh__search .aws-container,
    .ms-mobile-header .ms-mh__search .aws-container *{
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
    .ms-mobile-header .ms-mh__search .aws-container{
        width: 100% !important;
        display: block !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-form{
        float: none !important;
        width: 100% !important;
        height: 38px !important;
        position: relative !important;
        margin: 0 !important;
        display: block !important;
    }
    /* One control inside the mobile field: magnifier while empty, then a
       larger clear button in the same slot after text is entered. */
    .ms-mobile-header .ms-mh__search .ms-search-shell .aws-container .aws-search-form .aws-search-clear{
        display: none !important;
        pointer-events: none !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open.has-value .aws-search-form .aws-search-clear{
        position: absolute !important;
        top: 50% !important;
        right: 3px !important;
        z-index: 4 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 38px !important;
        height: 38px !important;
        padding: 0 !important;
        color: var(--ms-ink-700) !important;
        text-align: center !important;
        cursor: pointer !important;
        pointer-events: auto !important;
        transform: translateY(-50%) !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open.has-value .aws-search-form .aws-search-clear span{
        position: static !important;
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        font: 400 28px/1 Arial, sans-serif !important;
        transform: translateY(2px) !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open.has-value .aws-search-form .aws-search-btn{
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-field{
        border-radius: 10px !important;
        border: 1px solid var(--ms-line) !important;
        background: var(--ms-bg-alt) !important;
        height: 38px !important;
        padding: 0 40px 0 12px !important;
        font-size: 14px !important;
        color: var(--ms-ink) !important;
        width: 100% !important;
        box-shadow: none !important;
        margin: 0 !important;
        position: relative !important;
        left: 0 !important;  /* parent AWS CSS sets left: 60px — kill it */
        right: auto !important;
        top: auto !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-field::placeholder{
        color: var(--ms-ink-500) !important;
    }
    /* The custom AWS clear button is the only clear control. Some mobile
       browsers otherwise add a second native X inside type="search" fields. */
    .ms-mobile-header .ms-mh__search .aws-search-field::-webkit-search-cancel-button{
        -webkit-appearance: none !important;
        appearance: none !important;
        display: none !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-field::-ms-clear{
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-form .aws-search-btn,
    .ms-mobile-header .ms-mh__search .aws-search-form .aws-form-btn{
        position: absolute !important;
        left: auto !important;  /* parent AWS sets left: 164.5px — kill it */
        right: 2px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        height: 32px !important;
        width: 32px !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-shadow: none !important;
    }
    .ms-mobile-header .ms-mh__search .aws-search-form svg{
        fill: var(--ms-teal) !important;
        width: 15px !important;
        height: 15px !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger::before,
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger::after{
        content: "";
        position: absolute !important;
        top: 50% !important;
        pointer-events: none !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger::before{
        right: 14px !important;
        width: 12px !important;
        height: 12px !important;
        margin-top: -8px !important;
        border: 1.8px solid var(--ms-teal) !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger::after{
        right: 11px !important;
        width: 7px !important;
        height: 1.8px !important;
        margin-top: 4px !important;
        background: var(--ms-teal) !important;
        border-radius: 999px !important;
        transform: rotate(45deg) !important;
        transform-origin: center !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-form .aws-search-btn,
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-form .aws-form-btn{
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /* Mobile open-state popup — compact slim bar pinned to the top of the
       viewport. Earlier iteration centered the panel via `transform`,
       which combined with desktop's heavy padding/box-shadow made it look
       chunky. Anchor with explicit left+right (no transform) so the panel
       sits flush across the screen, and zero out the desktop's padding/
       border/shadow so the form fills the bar with no decorative chrome.
       Backdrop blur (rule below) provides the visual separation. */
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .ms-search-panel{
        position: fixed !important;
        top: 8px !important;
        left: 8px !important;
        right: 8px !important;
        bottom: auto !important;
        transform: none !important;
        width: auto !important;
        max-width: none !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-wrap: nowrap !important;
        padding: 4px !important;
        background: #fff !important;
        border: 1px solid rgba(15, 23, 42, 0.08) !important;
        border-radius: 12px !important;
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16) !important;
    }

    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-form{
        height: 44px !important;
    }

    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-field{
        height: 44px !important;
        line-height: 44px !important;
        padding: 0 44px 0 14px !important;
        font-size: 15px !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        box-shadow: none !important;
        outline: none !important;
    }
    /* Kill the closed-state mobile-search hover/focus/active visual jitter
       (parent theme's generic input rules add a subtle focus shadow + the
       browser tap-highlight tint on touch). The closed input is a fake
       trigger anyway — we open the popup instead of typing — so any
       cosmetic state change here is just noise. */
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-field,
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-field:hover,
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-field:focus,
    .ms-mobile-header .ms-mh__search .ms-search-shell:not(.is-open) .aws-search-field:active{
        background: var(--ms-bg-alt) !important;
        border: 1px solid var(--ms-line) !important;
        outline: none !important;
        box-shadow: none !important;
        color: var(--ms-ink) !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger,
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger:hover,
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger:focus,
    .ms-mobile-header .ms-mh__search .ms-search-open-trigger:active{
        -webkit-tap-highlight-color: transparent !important;
        outline: none !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-form .aws-search-btn,
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-form .aws-form-btn{
        right: 3px !important;
        height: 38px !important;
        width: 38px !important;
    }

    /* Centre the magnifier inside its line box, then give both changing
       field icons the same small optical offset as the typed text. */
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-form .aws-search-btn_icon{
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 0 !important;
        transform: translateY(2px) !important;
    }
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .aws-search-form svg{
        width: 20px !important;
        height: 20px !important;
    }

    /* Mobile dismiss button (×) — slim square next to the input. Default
       desktop size (52×58) made the popup feel chunky; shrink it to match
       the 44px form height. */
    .ms-mobile-header .ms-mh__search .ms-search-shell.is-open .ms-search-dismiss{
        width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
        font-size: 22px !important;
        border-radius: 9px !important;
        background: #f1f5f9 !important;
        border: 0 !important;
    }

    /* Cart — ghost icon button with badge */
    .ms-mobile-header .ms-mh__cart{
        flex: 0 0 auto !important;
        display: block !important;
        margin: 0 !important;
    }
    .ms-mobile-header .ms-mh__cart .kurv-button{
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
        background: var(--ms-bg-alt) !important;
        color: var(--ms-ink) !important;
        text-decoration: none !important;
        border: 1px solid var(--ms-line) !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .ms-mobile-header .ms-mh__cart .kurv-button i{
        font-size: 15px !important;
        color: var(--ms-ink) !important;
        margin: 0 !important;
        line-height: 1 !important;
    }
    .ms-mobile-header .ms-mh__cart .count{
        position: absolute !important;
        top: -5px !important;
        right: -5px !important;
        min-width: 18px !important;
        height: 18px !important;
        padding: 0 5px !important;
        background: var(--ms-teal) !important;
        color: #fff !important;
        border-radius: 999px !important;
        font-size: 10.5px !important;
        font-weight: 700 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 2px solid #fff !important;
        line-height: 1 !important;
        margin: 0 !important;
    }
    .ms-mobile-header .ms-mh__cart .cart-contents{
        color: #fff !important;
        font-size: 10px !important;
        line-height: 1 !important;
    }

    /* Menu — matches cart style */
    .ms-mobile-header .ms-mh__menu{
        flex: 0 0 auto !important;
        display: block !important;
    }
    .ms-mobile-header .ms-mh__menu button#mobileMenuShowButton{
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 38px !important;
        height: 38px !important;
        padding: 0 !important;
        border-radius: 10px !important;
        background: var(--ms-bg-alt) !important;
        color: var(--ms-ink) !important;
        border: 1px solid var(--ms-line) !important;
        margin: 0 !important;
    }
    .ms-mobile-header .ms-mh__menu button#mobileMenuShowButton i{
        color: var(--ms-ink) !important;
        font-size: 18px !important;
        line-height: 1 !important;
        margin: 0 !important;
    }
}

body.ms-search-open{
    overflow: hidden !important;
}

.ms-search-shell{
    position: relative;
    display: block;
    width: 100%;
}

.ms-search-shell .ms-search-backdrop{
    position: fixed;
    inset: 0;
    display: block;
    border: 0;
    padding: 0;
    margin: 0;
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
    /* Inside the shell's z:999999 stacking context (created when .is-open).
       Keep this LOW within that context — z:1 — so the panel (z:2 below)
       renders above the blur. The shell's outer z:999999 already lifts
       the whole popup above CompleteGreet's z:10000 bubble. */
    z-index: 1;
}

.ms-search-shell .ms-search-panel{
    position: relative;
    z-index: 2;
}

.ms-search-shell .ms-search-open-trigger{
    position: absolute;
    inset: 0;
    z-index: 5;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    cursor: text;
}

.ms-search-shell .ms-search-dismiss{
    display: none;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 58px;
    margin: 0;
    flex: 0 0 52px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: #f8fafc;
    color: var(--ms-ink);
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

.ms-search-shell .ms-search-dismiss:hover{
    background: #eef2f7;
}

.ms-search-shell.is-open{
    z-index: 999999;
}

.ms-search-shell.is-open .ms-search-backdrop{
    opacity: 1;
    pointer-events: auto;
}

.ms-search-shell.is-open .ms-search-panel{
    position: fixed;
    top: clamp(16px, 6vh, 56px);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    width: min(760px, calc(100vw - 32px));
    padding: 18px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 22px;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
    z-index: 1201;
}

.ms-search-shell.is-open .ms-search-open-trigger{
    display: none;
}

.ms-search-shell.is-open .ms-search-dismiss{
    display: inline-flex;
    order: 2;
}

.ms-search-shell.is-open .aws-container{
    order: 1;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
}

.ms-search-shell.is-open .aws-search-form{
    height: 58px !important;
}

.ms-search-shell.is-open .aws-search-field{
    height: 58px !important;
    line-height: 58px !important;
    padding: 0 56px 0 20px !important;
    border-radius: 16px !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
    background: #f8fbfd !important;
    font-size: 17px !important;
}

.ms-search-shell.is-open .aws-search-form .aws-search-btn,
.ms-search-shell.is-open .aws-search-form .aws-form-btn{
    right: 5px !important;
    width: 46px !important;
    height: 46px !important;
}

.ms-search-shell.is-open .aws-search-form svg{
    width: 18px !important;
    height: 18px !important;
}

body.ms-search-open .aws-search-result{
    width: min(1150px, calc(100vw - 64px)) !important;
    max-width: calc(100vw - 64px) !important;
    /* AWS plugin appends this list to <body> (not inside .ms-search-shell),
       so its z-index is global. The shell creates a stacking context at
       z:999999 when open — z must beat that or the blurred backdrop will
       cover the results visually even though they sit below the panel. */
    z-index: 10000000 !important;
    border-radius: 18px !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.16) !important;
    overflow: hidden !important;
}

body.ms-search-open .aws-search-result .aws_result_scroll,
body.ms-search-open .aws-search-result .aws_result_inner,
body.ms-search-open .aws-search-result .aws_results{
    width: 100% !important;
}

body.ms-search-open .aws-search-result ul{
    max-height: min(100vh, 420px) !important;
    padding: 6px 0 !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, 0.45) transparent;
}

body.ms-search-open .aws-search-result ul::-webkit-scrollbar-track{
    background: transparent;
}

body.ms-search-open .aws-search-result ul::-webkit-scrollbar{
    width: 8px;
    background: transparent;
}

body.ms-search-open .aws-search-result ul::-webkit-scrollbar-thumb{
    background: rgba(100, 116, 139, 0.32);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

body.ms-search-open .aws-search-result ul li{
    border-bottom: 1px solid rgba(226, 232, 240, 0.9) !important;
    overflow: visible;
}

body.ms-search-open .aws-search-result ul li:last-child{
    border-bottom: 0 !important;
}

body.ms-search-open .aws-search-result .aws_result_item{
    background: #fff;
    cursor: pointer;
}

body.ms-search-open .aws-search-result .aws_result_item:hover,
body.ms-search-open .aws-search-result .aws_result_item.hovered,
body.ms-search-open .aws-search-result .aws_search_more a:hover{
    background: #f4f8fa !important;
}

body.ms-search-open .aws-search-result .aws_result_link{
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    min-height: 92px;
    color: inherit;
    text-decoration: none;
}

body.ms-search-open .aws-search-result .aws_result_image{
    float: none;
    width: 72px;
    height: 72px;
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: #f8fafc;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body.ms-search-open .aws-search-result .aws_result_image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.ms-search-open .aws-search-result .aws_result_content{
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

body.ms-search-open .aws-search-result .aws_result_title{
    margin: 0;
    color: var(--ms-ink) !important;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 700;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

body.ms-search-open .aws-search-result .aws_result_title strong{
    color: var(--ms-teal) !important;
    font-weight: 800 !important;
}

body.ms-search-open .aws-search-result .aws_result_featured{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 0 6px;
    top: auto;
    left: auto;
}

body.ms-search-open .aws-search-result .aws_result_featured svg{
    width: 12px;
    height: 12px;
    fill: #f59e0b;
}

body.ms-search-open .aws-search-result .aws_result_stock{
    display: inline-flex;
    align-self: flex-start;
    margin: 0;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(22, 163, 74, 0.12);
    color: #15803d;
    font-size: 11px;
    line-height: 1;
    font-weight: 700;
}

body.ms-search-open .aws-search-result .aws_result_stock.out{
    background: rgba(225, 29, 72, 0.12);
    color: #be123c;
}

body.ms-search-open .aws-search-result .aws_result_sku,
body.ms-search-open .aws-search-result .aws_result_excerpt{
    display: none !important;
}

body.ms-search-open .aws-search-result .aws_result_price{
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 8px;
    padding: 0;
    color: var(--ms-teal);
    font-size: 15px;
    line-height: 1.2;
    font-weight: 800;
}

body.ms-search-open .aws-search-result .aws_result_price ins,
body.ms-search-open .aws-search-result .aws_result_price .woocommerce-Price-amount{
    color: inherit;
    font-weight: inherit;
}

body.ms-search-open .aws-search-result .aws_result_price ins{
    order: 2;
    padding: 0 !important;
    text-decoration: none;
}

body.ms-search-open .aws-search-result .aws_result_price del{
    order: 1;
    padding: 0 !important;
    color: var(--ms-ink-500);
    opacity: 1;
    font-size: 12px;
}

body.ms-search-open .aws-search-result .aws_result_price .ms-savings{
    order: 3;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 4px 8px !important;
    background: #f59e0b !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font: 800 10.5px/1 'Inter', sans-serif !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.06) !important;
}

body.ms-search-open .aws-search-result .aws_result_sale{
    top: 12px;
    left: 22px;
    right: auto;
    width: auto;
    height: auto;
    overflow: visible;
    pointer-events: none;
}

body.ms-search-open .aws-search-result .aws_onsale{
    float: none;
    width: auto;
    height: auto;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.92);
    color: #fff;
    font-size: 10px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.01em;
    position: static;
    transform: none;
}

/* Advanced Woo Search 3.x inline markup: keep the pre-update product row design. */
body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_item{
    position: relative !important;
    display: grid !important;
    grid-template-columns: 132px minmax(0, 1fr) !important;
    grid-template-areas: "image content" !important;
    align-items: center !important;
    gap: 22px !important;
    min-height: 132px !important;
    padding: 18px 28px !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.95) !important;
    background: #fff !important;
    cursor: pointer !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_item:last-child{
    border-bottom: 0 !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_item:hover,
body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_item.hovered{
    background: #f4f8fa !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_link_top{
    position: absolute !important;
    inset: 0 !important;
    z-index: 10 !important;
    display: block !important;
    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-decoration: none !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_image{
    grid-area: image !important;
    align-self: center !important;
    justify-self: center !important;
    float: none !important;
    width: 112px !important;
    height: 112px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 16px !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_content{
    grid-area: content !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    min-width: 0 !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_head{
    display: contents !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_title{
    order: 1 !important;
    font-size: 19px !important;
    line-height: 1.2 !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_stock{
    order: 2 !important;
    font-size: 14px !important;
    padding: 6px 10px !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price{
    order: 3 !important;
    gap: 8px 12px !important;
    font-size: 20px !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price del{
    font-size: 16px !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price .ms-savings{
    font-size: 14px !important;
    padding: 7px 12px !important;
    border-radius: 8px !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_sale{
    top: 24px !important;
    left: 44px !important;
    z-index: 3 !important;
}

body.ms-search-open .aws-search-result .aws_results.style-inline .aws_onsale{
    font-size: 14px !important;
    padding: 7px 12px !important;
}

@media (max-width: 767px){
    body.ms-search-open .aws-search-result{
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_item{
        grid-template-columns: 82px minmax(0, 1fr) !important;
        gap: 12px !important;
        min-height: 104px !important;
        padding: 12px 14px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_image{
        width: 72px !important;
        height: 72px !important;
        border-radius: 14px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_title{
        font-size: 14px !important;
        line-height: 1.25 !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_stock{
        font-size: 11px !important;
        padding: 4px 8px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price{
        font-size: 15px !important;
        gap: 4px 8px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price del{
        font-size: 12px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_price .ms-savings{
        font-size: 10.5px !important;
        padding: 4px 8px !important;
        border-radius: 6px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_result_sale{
        top: 12px !important;
        left: 24px !important;
    }

    body.ms-search-open .aws-search-result .aws_results.style-inline .aws_onsale{
        font-size: 10px !important;
        padding: 4px 8px !important;
    }
}

body.ms-search-open .aws-search-result .aws_result_tag .aws_result_link,
body.ms-search-open .aws-search-result .aws_result_cat .aws_result_link{
    display: block;
    min-height: 0;
    padding: 10px 14px;
    background: #f8fafc;
}

body.ms-search-open .aws-search-result .aws_result_tag .aws_result_content,
body.ms-search-open .aws-search-result .aws_result_cat .aws_result_content{
    gap: 4px;
}

body.ms-search-open .aws-search-result .aws_result_tag .aws_result_title,
body.ms-search-open .aws-search-result .aws_result_cat .aws_result_title{
    color: var(--ms-teal) !important;
    font-size: 13px;
    font-weight: 700;
}

body.ms-search-open .aws-search-result .aws_result_count{
    color: var(--ms-ink-500);
    font-weight: 600;
}

body.ms-search-open .aws-search-result .aws_no_result{
    padding: 20px 16px;
    color: var(--ms-ink);
    text-align: center;
    font-size: 14px;
    line-height: 1.5;
}

body.ms-search-open .aws-search-result .aws_search_more{
    background: linear-gradient(180deg, rgba(248, 250, 252, 0) 0%, #fff 18%);
}

body.ms-search-open .aws-search-result .aws_search_more a,
body.ms-search-open .aws-search-result a.ms-search-more{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 12px;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 10px;
    background: var(--ms-teal);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(33, 66, 73, 0.18);
    transition: background-color .15s ease, box-shadow .15s ease;
}

body.ms-search-open .aws-search-result a.ms-search-more:hover,
body.ms-search-open .aws-search-result a.ms-search-more:focus-visible{
    background: #1a3439;
    color: #fff;
    box-shadow: 0 12px 26px rgba(33, 66, 73, 0.28);
    outline: none;
}

body.ms-search-open .aws-search-result a.ms-search-more::after{
    content: "\00a0\2192";
    margin-left: 4px;
}

@media (max-width: 1199px){
    /* Panel padding/dismiss sizing are now governed by the
       `.ms-mobile-header .ms-mh__search ...` block above (line ~334),
       which is more specific. The result-list polish below is unique
       to mobile and remains here. */
    .ms-search-shell.is-open .aws-container{
        width: auto !important;
        max-width: none !important;
    }

    body.ms-search-open .aws-search-result{
        border-radius: 16px !important;
    }

    body.ms-search-open .aws-search-result ul{
        max-height: calc(100vh - 90px) !important;
        padding: 2px 0 !important;
    }

    /* Compact rows so 5–6 products fit per phone screen.
       Image bumped 48 → 60 for better product recognition (user feedback);
       row min-height tracks the image. */
    body.ms-search-open .aws-search-result .aws_result_item,
    body.ms-search-open .aws-search-result div.aws_results.style-inline div.aws_result_item{
        grid-template-columns: 60px minmax(0, 1fr) !important;
        gap: 12px !important;
        padding: 7px 12px !important;
        min-height: 72px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_link{
        grid-template-columns: 60px minmax(0, 1fr);
        gap: 12px;
        padding: 7px 12px;
        min-height: 72px;
    }

    body.ms-search-open .aws-search-result .aws_result_image,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_image{
        width: 60px !important;
        height: 60px !important;
        border-radius: 10px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_content,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_content{
        gap: 3px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_title,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_title{
        font-size: 12px !important;
        line-height: 1.25 !important;
        font-weight: 700 !important;
    }

    body.ms-search-open .aws-search-result .aws_result_stock,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_stock{
        padding: 2px 6px !important;
        font-size: 9.5px !important;
        line-height: 1 !important;
    }

    body.ms-search-open .aws-search-result .aws_result_price,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_price{
        font-size: 12.5px !important;
        gap: 3px 6px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_price del,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_price del{
        font-size: 10.5px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_price .ms-savings{
        font-size: 9px !important;
        padding: 2px 5px !important;
        border-radius: 4px !important;
    }

    body.ms-search-open .aws-search-result .aws_result_sale,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_result_sale{
        top: 7px !important;
        left: 14px !important;
    }

    body.ms-search-open .aws-search-result .aws_onsale,
    body.ms-search-open .aws-search-result div.aws_results.style-inline span.aws_onsale{
        font-size: 8.5px !important;
        padding: 2px 5px !important;
    }

    /* Bottom CTA: tighter on mobile */
    body.ms-search-open .aws-search-result a.ms-search-more,
    body.ms-search-open .aws-search-result .aws_search_more a{
        margin: 8px !important;
        min-height: 40px !important;
        font-size: 13px !important;
    }

    body.ms-search-open .aws-search-result .aws_search_more a{
        min-height: 44px;
        margin: 8px 10px 10px;
        font-size: 13px;
    }
}

body.ms-search-open .ms-search-shell.is-open .ms-search-panel .aws-container{
    order: 1 !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
}

body.ms-search-open .ms-search-shell.is-open .ms-search-panel .ms-search-dismiss{
    order: 2 !important;
}

/* =========================================================
   DESKTOP HEADER  — one polished row, same DNA as mobile:
        [logo] · [search] · [trust pill] · [phone] · [KURV teal]
   Child template (template-parts/common/header-desktop.php) feeds
   cleaner markup: mobile logo, no email/Kontakt, custom trust pill.
   ========================================================= */

@media (min-width: 1200px){

    /* Header sits in normal flow — no sticky behavior on desktop.
       Breakpoint is 1200 (not 992) because parent's main.js only keeps
       .desktop-container in the DOM above 1199 — the 992-1199 range is
       a mobile-DOM zone that needs mobile header styling. */
    #header.site-header.newheader-desktop{
        position: static !important;
        top: auto !important;
        z-index: auto !important;
        background: #fff !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Primary row — logo | search | trust | phone | KURV */
    .desktop-container.ms-dh{
        padding: 10px 24px !important;
        max-width: 1140px !important;
    }
    .desktop-container.ms-dh > .row{
        margin: 0 !important;
    }
    .desktop-container.ms-dh .col-sm-12{
        display: flex !important;
        align-items: center !important;
        gap: 20px !important;
        flex-wrap: nowrap !important;
        padding: 0 !important;
    }
    .desktop-container.ms-dh .header-logo-info,
    .desktop-container.ms-dh .bottom-header-section,
    .desktop-container.ms-dh .right-side-contact{
        display: contents !important;
    }

    /* Logo (mobile bitmap — compact, crisp) */
    .desktop-container.ms-dh .header__logo{
        order: 1 !important;
        flex: 0 0 auto !important;
        line-height: 0 !important;
    }
    .desktop-container.ms-dh .header__logo a{
        display: inline-block !important;
        line-height: 0 !important;
    }
    .desktop-container.ms-dh .header__logo img{
        width: auto !important;
        height: 38px !important;
        max-height: 38px !important;
        display: block !important;
    }

    /* Phone — compact text link with teal icon */
    .desktop-container.ms-dh .right-side-contact .mobile-number{
        order: 4 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 0 0 auto !important;
        font: 500 13px/1 'Inter', sans-serif !important;
        color: var(--ms-ink-700) !important;
        white-space: nowrap !important;
    }
    .desktop-container.ms-dh .right-side-contact .mobile-number i{
        color: var(--ms-teal) !important;
        font-size: 13px !important;
    }
    .desktop-container.ms-dh .right-side-contact .mobile-number a{
        color: var(--ms-ink) !important;
        text-decoration: none !important;
        font-weight: 600 !important;
        font-size: 13px !important;
    }
    .desktop-container.ms-dh .right-side-contact .mobile-number a:hover{
        color: var(--ms-teal) !important;
    }

    /* Search — fills remaining space between logo and trust pill */
    .desktop-container.ms-dh .ms-search-shell{
        order: 2 !important;
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: 620px !important;
        width: auto !important;
        position: relative !important;
    }
    html body .desktop-container.ms-dh .ms-search-shell .aws-container{
        order: 2 !important;
        flex: none !important;
        min-width: 0 !important;
        max-width: none !important;
        width: 100% !important;
        overflow: visible !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-form{
        position: relative !important;
        height: 42px !important;
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-field{
        border-radius: 10px !important;
        border: 1px solid var(--ms-line) !important;
        background: var(--ms-bg-alt) !important;
        height: 42px !important;
        padding: 0 46px 0 16px !important;
        font-size: 14px !important;
        color: var(--ms-ink) !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-shadow: none !important;
        line-height: 42px !important;
        margin: 0 !important;
        position: relative !important;
        left: 0 !important;
        right: auto !important;
        top: auto !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-field::placeholder{
        color: var(--ms-ink-500) !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-form .aws-search-btn,
    .desktop-container.ms-dh .aws-container .aws-search-form .aws-form-btn{
        position: absolute !important;
        left: auto !important;
        right: 4px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        height: 34px !important;
        width: 36px !important;
        background: transparent !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-shadow: none !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-form .aws-search-btn_icon{
        height: auto !important;
        color: var(--ms-teal) !important;
    }
    .desktop-container.ms-dh .aws-container .aws-search-form svg{
        fill: var(--ms-teal) !important;
        width: 16px !important;
        height: 16px !important;
    }

    /* Trust pill — matches the mobile trust strip styling
       (stars + 4,8 + count + Google in brand colors).
       Markup from child template uses .ms-dh__trust* classes, so the
       verbose legacy .Fremragende / .anmeldelser / svg nodes are gone. */
    .desktop-container.ms-dh .bottom-header-section-trustpilot.ms-dh__trust{
        order: 3 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        padding: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        text-decoration: none !important;
        flex: 0 0 auto !important;
        white-space: nowrap !important;
        line-height: 1 !important;
        font: 500 10.5px/1 'Inter', sans-serif !important;
        color: var(--ms-ink-700) !important;
    }
    /* Visual divider between trust block and phone — prevents the two from
       reading as one merged unit now that the pill bg is gone. */
    .desktop-container.ms-dh .bottom-header-section-trustpilot.ms-dh__trust::after{
        content: "";
        display: inline-block;
        width: 1px;
        height: 16px;
        background: var(--ms-line);
        margin-left: 4px;
    }
    .desktop-container.ms-dh .ms-dh__trust-stars{
        color: #fbbf24 !important;
        letter-spacing: 1px !important;
        font-size: 9.5px !important;
        line-height: 1 !important;
    }
    .desktop-container.ms-dh .ms-dh__trust-score{
        color: var(--ms-ink) !important;
        font-weight: 800 !important;
        font-size: 11px !important;
        line-height: 1 !important;
    }
    .desktop-container.ms-dh .ms-dh__trust-count{
        font-weight: 700 !important;
        color: var(--ms-ink) !important;
    }
    .desktop-container.ms-dh .ms-dh__trust-g{
        font-weight: 700 !important;
        background: linear-gradient(90deg,#4285F4 0 25%,#EA4335 25% 50%,#FBBC05 50% 75%,#34A853 75% 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .desktop-container.ms-dh .bottom-header-section-trustpilot.ms-dh__trust:hover .ms-dh__trust-score,
    .desktop-container.ms-dh .bottom-header-section-trustpilot.ms-dh__trust:hover .ms-dh__trust-count{
        color: var(--ms-teal) !important;
    }

    /* Cart button — teal primary CTA */
    .desktop-container.ms-dh .cart{
        order: 5 !important;
        flex: 0 0 auto !important;
        box-shadow: none !important;
        height: auto !important;
    }
    .desktop-container.ms-dh .cart .ql_cart_wrap{
        margin: 0 !important;
        padding: 0 !important;
    }
    .desktop-container.ms-dh .kurv-button{
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        height: 42px !important;
        padding: 0 18px !important;
        border-radius: 10px !important;
        background: var(--ms-teal) !important;
        color: #fff !important;
        border: none !important;
        font: 700 13px/1 'Inter', sans-serif !important;
        letter-spacing: .04em !important;
        cursor: pointer !important;
        white-space: nowrap !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }
    .desktop-container.ms-dh .kurv-button:hover{
        background: var(--ms-teal-600) !important;
        box-shadow: none !important;
    }
    .desktop-container.ms-dh .kurv-button i{
        color: #fff !important;
        font-size: 13px !important;
    }
    .desktop-container.ms-dh .kurv-button i.fa-chevron-down{
        display: none !important;
    }
    .desktop-container.ms-dh .kurv-button .ms-dh__cart-label{
        color: #fff !important;
        font-size: 13px !important;
        font-weight: 700 !important;
    }
    .desktop-container.ms-dh .kurv-button .count,
    .desktop-container.ms-dh .kurv-button .cart-contents{
        color: #fff !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        opacity: .9 !important;
    }

    /* =========================================================
       DESKTOP MENU BAR (navbar-desktop) — soft ink bg + Inter
       Attaches directly under the header row. No top margin.
       Yellow Tilbud pill stays — it's the brand's playful accent.
       ========================================================= */
    #header.newheader-desktop .navbar-desktop{
        margin: 0 !important;
        padding: 0 !important;
        background: var(--ms-ink) !important;
        color: #fff !important;
        border-top: 1px solid rgba(255,255,255,.06) !important;
        border-bottom: 1px solid var(--ms-ink) !important;  /* seals the header unit */
    }
    #header.newheader-desktop .navbar-desktop > .container{
        max-width: 1140px !important;
        padding: 0 24px !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu,
    #header.newheader-desktop .nav.navbar-nav.header-menu{
        display: flex !important;
        align-items: stretch !important;
        /* Spread categories across the bar so they sit evenly — the last gap
           lands right next to the Tilbud pill instead of leaving an ugly void. */
        justify-content: space-between !important;
        gap: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
        width: 100% !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li{
        width: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: none !important;
        display: flex !important;
        align-items: stretch !important;
        position: relative !important;  /* absolute-positioned dropdown stays within li's hover scope */
    }
    /* Hide the mobile-only "Produkter" / KATEGORIER item on desktop */
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.mobilecss{
        display: none !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li > a{
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 13px 18px !important;
        font: 500 13px/1 'Inter', sans-serif !important;
        letter-spacing: .02em !important;
        color: #fff !important;
        text-decoration: none !important;
        text-align: center !important;
        background: transparent !important;
        border: none !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li > a:hover,
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.show > a,
    #header.newheader-desktop .navbar-desktop ul.header-menu > li:hover > a{
        background: rgba(255,255,255,.06) !important;
        color: #fff !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li > a > span{
        color: inherit !important;
        font-weight: inherit !important;
    }
    /* Dropdown chevron — FontAwesome down-arrow, crisp + readable.
       Previous 9px unicode ▾ rendered as a tiny smudge. FA chevron-down at
       11px reads clearly against the ink background. */
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.menu-item-has-children > a.dropdown-toggle::after{
        content: "\f107" !important;                 /* fa-chevron-down */
        font-family: "Font Awesome 5 Free", "FontAwesome", sans-serif !important;
        font-weight: 900 !important;
        font-size: 11px !important;
        line-height: 1 !important;
        margin-left: 4px !important;
        color: rgba(255,255,255,.85) !important;
        transform: none !important;
        border: none !important;
        vertical-align: middle !important;
        display: inline-block !important;
        width: auto !important;
        height: auto !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.menu-item-has-children:hover > a.dropdown-toggle::after,
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.menu-item-has-children.show > a.dropdown-toggle::after{
        color: #fff !important;
    }
    /* Tilbud CTA — brand yellow pill on the right edge */
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.tilbud{
        align-self: center !important;
        display: inline-flex !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.tilbud > a{
        background: #ffe14a !important;
        color: var(--ms-ink) !important;
        font-weight: 800 !important;
        padding: 8px 16px !important;
        margin: 6px 0 !important;
        border-radius: 8px !important;
        letter-spacing: .04em !important;
        text-transform: none !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.tilbud > a:hover{
        background: #ffd617 !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.tilbud > a > span{
        color: var(--ms-ink) !important;
        font-weight: 800 !important;
    }

    /* =========================================================
       MEGA-MENU DROPDOWN — CRO-focused tile grid.
       Transforms the inherited narrow 1-col list into a wide multi-col
       tile panel with franchise icons, hover states, and a sticky footer
       carrying a "Se alle X →" CTA + free-shipping reassurance.
       Hover scope is preserved (flush top, no dead-zone gap).
       ========================================================= */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu{
        background: #fff !important;
        border: 1px solid var(--ms-line) !important;
        border-radius: 14px !important;
        padding: 10px !important;
        margin: 0 !important;
        top: 100% !important;
        left: 0 !important;
        right: auto !important;
        min-width: 320px !important;
        width: max-content !important;
        max-width: 720px !important;
        max-height: 78vh !important;
        overflow-y: auto !important;
        box-shadow: 0 12px 32px rgba(15,23,42,.12) !important;
        /* Grid takes over when :hover switches display to grid (rule below). */
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
        gap: 2px !important;
        scrollbar-width: thin;
    }
    /* Right-edge items (flagged by JS) anchor to the right of their li so the
       panel opens toward the center instead of overflowing off-screen.
       Without this, Diverse's 720px-wide panel ran off the viewport. */
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.ms-dd-flip > ul.dropdown-menu{
        left: auto !important;
        right: 0 !important;
    }
    /* Parent's responsive.css toggles display: block/flex on :hover for mega-menu.
       Override to display: grid so our grid-template-columns actually takes effect. */
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.menu-item-has-children:hover > ul.dropdown-menu,
    #header.newheader-desktop .navbar-desktop ul.header-menu > li.menu-item-has-children.show > ul.dropdown-menu{
        display: grid !important;
    }

    /* Individual tile — flex row, icon left, label right */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li{
        display: block !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        width: auto !important;
        min-width: 0 !important;
    }
    /* Hide the empty "header" <li> that parent theme ships as the first child
       of every dropdown (no text, no image — just renders as empty space). */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.menu-item:first-child:empty,
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.menu-item:first-child:not(:has(a)){
        display: none !important;
    }
    /* Tile anchor style — excludes the footer <li> so its CTA button keeps
       its own white-pill treatment without being flattened by this higher-
       specificity rule. */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li:not(.ms-dd-footer) > a{
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 8px 10px !important;
        border-radius: 10px !important;
        font: 500 13px/1.25 'Inter', sans-serif !important;
        color: var(--ms-ink) !important;
        text-decoration: none !important;
        min-height: 48px !important;
        width: 100% !important;
        background: transparent !important;
        border: 1px solid transparent !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li:not(.ms-dd-footer) > a:hover{
        background: var(--ms-teal-050) !important;
        border-color: rgba(33,66,73,.12) !important;
        color: var(--ms-teal) !important;
    }

    /* Icon tile — 40x40 rounded panel with the franchise logo contained inside */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li > a img{
        width: 40px !important;
        height: 40px !important;
        object-fit: contain !important;
        flex: 0 0 40px !important;
        margin: 0 !important;
        padding: 4px !important;
        background: var(--ms-bg-alt) !important;
        border-radius: 8px !important;
        display: block !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li > a:hover img{
        background: #fff !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li > a > span{
        font: 500 13px/1.25 'Inter', sans-serif !important;
        color: inherit !important;
        padding: 0 !important;
        position: static !important;
        width: auto !important;
        text-align: left !important;
        flex: 1 1 auto !important;
    }

    /* Second-level items (e.g. Iron Man/Spiderman/Hulk under Avengers) are
       promoted to equal tiles in the grid — in a 3-column layout the
       parent→child hierarchy is visually lost anyway, and each character is
       a valid entry point on its own, so treating them as peers increases
       the clickable surface without confusing the scan path. */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.dropdown-menu-second > a{
        padding: 8px 10px !important;
        min-height: 48px !important;
        font-size: 13px !important;
        color: var(--ms-ink) !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.dropdown-menu-second > a img{
        width: 40px !important;
        height: 40px !important;
        flex: 0 0 40px !important;
    }

    /* =========================================================
       STICKY FOOTER BAR inside each dropdown — "Se alle X →" + Gratis fragt
       Injected by JS in functions.php as the last <li>. Spans full grid width.
       Sticky so it stays visible even when the menu overflows and scrolls.
       ========================================================= */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.ms-dd-footer{
        grid-column: 1 / -1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        margin: 8px 0 0 !important;
        padding: 12px 14px !important;
        border-radius: 10px !important;
        background: var(--ms-teal) !important;
        border: none !important;
        position: sticky !important;
        bottom: -10px !important;  /* align with panel padding so it feels flush */
    }
    .ms-dd-footer__ship{
        display: inline-flex !important;
        align-items: center !important;
        gap: 7px !important;
        font: 600 11.5px/1.2 'Inter', sans-serif !important;
        color: #fff !important;
        white-space: nowrap !important;
    }
    .ms-dd-footer__ship svg{
        color: #fff !important;
        flex-shrink: 0 !important;
        opacity: .95 !important;
    }
    /* Inverted CTA on teal bg — white pill with teal text reads as a clear
       primary action against the brand background. Full selector prefix
       used so the tile <a> rules elsewhere in this dropdown don't win on
       specificity and flatten the button. */
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.ms-dd-footer > a.ms-dd-footer__cta{
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 9px 16px !important;
        min-height: 0 !important;
        width: auto !important;
        background: #fff !important;
        color: #2B565F !important;           /* brand teal request */
        border-radius: 8px !important;
        font: 800 12px/1 'Inter', sans-serif !important;
        letter-spacing: .03em !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        border: none !important;
    }
    #header.newheader-desktop .navbar-desktop ul.header-menu li ul.dropdown-menu > li.ms-dd-footer > a.ms-dd-footer__cta:hover{
        background: #fff !important;
        color: var(--ms-teal-600) !important;
        border: none !important;
    }
    .ms-dd-footer__cta svg{
        flex-shrink: 0 !important;
    }
}

/* =========================================================
   FOOTER (shared + desktop/mobile specifics)
   ========================================================= */

footer.desktop,
footer.mobile{
    background: var(--ms-ink) !important;
    color: #cbd5e1 !important;
    padding: 40px 0 24px !important;
    margin-top: 40px;
    border-top: 3px solid var(--ms-teal);
}

footer.desktop a,
footer.mobile a{
    color: #cbd5e1 !important;
    text-decoration: none !important;
}
footer.desktop a:hover,
footer.mobile a:hover{
    color: #fff !important;
}

footer.desktop h4,
footer.mobile h4,
footer.desktop .footer-2,
footer.desktop h3{
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    position: relative;
}
footer.desktop h4::after,
footer.desktop .footer-2::after{
    display: none !important;
}

footer.desktop ul,
footer.mobile ul{
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
footer.desktop li,
footer.mobile li{
    padding: 4px 0 !important;
    font-size: 13.5px !important;
}

/* Trust block — desktop keeps the subtle pill; mobile is flat (no odd
   lighter card against dark footer bg). */
footer.desktop .footer-trustpilot{
    display: inline-flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    padding: 12px 14px !important;
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: var(--ms-radius-md) !important;
    margin-top: 14px !important;
    text-decoration: none !important;
}
.footer-trustpilot-mobile .footer-trustpilot{
    display: inline-flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 auto !important;
    text-decoration: none !important;
}
footer.desktop .footer-trustpilot .Fremragende,
.footer-trustpilot-mobile .footer-trustpilot .Fremragende{
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    margin: 0 !important;
}
footer.desktop .footer-trustpilot .anmeldelser,
footer.desktop .footer-trustpilot .Trust,
.footer-trustpilot-mobile .footer-trustpilot .anmeldelser,
.footer-trustpilot-mobile .footer-trustpilot .Trust{
    color: #cbd5e1 !important;
    font-size: 12px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}
footer.desktop .footer-trustpilot .google_rateing_wrapper,
.footer-trustpilot-mobile .footer-trustpilot .google_rateing_wrapper{
    color: #fff !important;
    font-weight: 700 !important;
}
footer.desktop .footer-trustpilot .count-number,
.footer-trustpilot-mobile .footer-trustpilot .count-number{
    color: #fff !important;
    font-weight: 700 !important;
}

/* ---------- Mobile footer (accordion) ----------
   Polished four-row footer: subtle dividers, category icons on the
   left, brighter title when expanded, smooth hover. Markup stays
   compatible with the parent's Bootstrap collapse handlers. */
footer.mobile .accordion .card{
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 0 !important;
    overflow: hidden;
}
footer.mobile .accordion .card:first-child{
    border-top: 1px solid rgba(255,255,255,.08) !important;
}
footer.mobile .accordion .card-header{
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}
footer.mobile .accordion .btn-link{
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    padding: 18px 4px !important;
    background: transparent !important;
    border: none !important;
    color: #f1f5f9 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    letter-spacing: -0.005em !important;
    text-transform: none !important;
    transition: color .15s ease;
}
footer.mobile .accordion .btn-link:hover{
    color: #ffffff !important;
}
footer.mobile .accordion .btn-link:not(.collapsed){
    color: #ffffff !important;
}
footer.mobile .accordion .btn-link p{
    margin: 0 !important;
    flex: 1 1 auto !important;
    color: inherit !important;
    font-weight: 600 !important;
}
footer.mobile .accordion .ms-foot-acc__icon{
    flex: 0 0 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    color: #94a3b8 !important;
    transition: color .15s ease;
}
footer.mobile .accordion .ms-foot-acc__icon svg{
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}
footer.mobile .accordion .btn-link:hover .ms-foot-acc__icon,
footer.mobile .accordion .btn-link:not(.collapsed) .ms-foot-acc__icon{
    color: #f8fafc !important;
}
footer.mobile .accordion .btn-link i.fa-plus-square,
footer.mobile .accordion .btn-link i.fa-minus-square{
    font-size: 14px !important;
    color: #cbd5e1 !important;
    font-weight: 400 !important;
}
footer.mobile .accordion .btn-link.collapsed i.fa-minus-square{
    display: none !important;
}
footer.mobile .accordion .btn-link:not(.collapsed) i.fa-plus-square{
    display: none !important;
}
footer.mobile .accordion .card-body{
    padding: 4px 4px 20px 40px !important;
    color: #cbd5e1 !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
    background: transparent !important;
}
/* Force light color on every descendant — widget-injected text (p/li/span/strong/h*)
   inherits dark color from parent theme; override hard so it reads on dark footer. */
footer.mobile .accordion .card-body,
footer.mobile .accordion .card-body *,
footer.mobile .accordion .card-body p,
footer.mobile .accordion .card-body span,
footer.mobile .accordion .card-body li,
footer.mobile .accordion .card-body h1,
footer.mobile .accordion .card-body h2,
footer.mobile .accordion .card-body h3,
footer.mobile .accordion .card-body h4,
footer.mobile .accordion .card-body h5,
footer.mobile .accordion .card-body h6,
footer.mobile .accordion .card-body strong,
footer.mobile .accordion .card-body em,
footer.mobile .accordion .card-body label,
footer.mobile .accordion .card-body .textwidget,
footer.mobile .accordion .card-body .widget,
footer.mobile .accordion .card-body .widget-title{
    color: #cbd5e1 !important;
    background: transparent !important;
}
footer.mobile .accordion .card-body a,
footer.mobile .accordion .card-body a *{
    color: #e2e8f0 !important;
    text-decoration: none !important;
}
footer.mobile .accordion .card-body a:hover,
footer.mobile .accordion .card-body a:hover *{
    color: #fff !important;
}
footer.mobile .accordion .card-body ul li a{
    padding: 6px 0 !important;
    display: block !important;
}
footer.mobile .accordion .card-body i{
    color: var(--ms-teal-050) !important;
}

.footer-trustpilot-mobile{
    margin-top: 22px !important;
    padding: 18px 0 0 0 !important;
    background: transparent !important;  /* parent sets #55787F — kill it */
    border: none !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 0 !important;
    display: flex !important;
    justify-content: center !important;
}

.footer-payment-mobile,
.footer-social-mobile{
    margin-top: 18px !important;
    text-align: center !important;
}
.footer-payment-mobile img{
    filter: brightness(1.2) contrast(.9);
    opacity: .85;
}
.footer-social-mobile a,
.footer-social-mobile i{
    color: #fff !important;
    font-size: 18px !important;
    margin: 0 6px !important;
}

/* ---------- Desktop footer columns ---------- */
footer.desktop .container > .row > div{
    margin-bottom: 24px;
}
footer.desktop .footer-menu-container .nav{
    display: block !important;
}
footer.desktop .footer-menu-container li{
    display: block !important;
    padding: 3px 0 !important;
}
footer.desktop .footer-menu-container a{
    color: #cbd5e1 !important;
    font-size: 13.5px !important;
    padding: 3px 0 !important;
    display: inline-block;
}
footer.desktop .footer-menu-container a:hover{
    color: #fff !important;
}

/* =========================================================
   Small polish: kill legacy pink/red accents site-wide,
   unify primary CTA color to teal
   ========================================================= */

.kurv-button{
    background: var(--ms-teal) !important;
    color: #fff !important;
}
.kurv-button:hover{
    background: var(--ms-teal-600) !important;
}

/* =========================================================
   MOBILE MENU DRAWER (v1.6.0)
   Right-anchored drawer, compact line-height, teal phone CTA.
   Parent JS (main.js:218) toggles `.show` on #newnavbarNav —
   Bootstrap .collapse display: none/block, no slide needed.
   ========================================================= */
@media (max-width: 991px){

    /* Reset parent's legacy left-anchored fixed drawer + kill its slide */
    #navbarSupportedContent{
        position: static !important;
        background: transparent !important;
        margin: 0 !important;
    }
    #navbarSupportedContent .navbar-collapse{
        position: fixed !important;
        top: 85px !important;
        right: 0 !important;
        left: auto !important;
        bottom: 0 !important;
        width: min(86vw, 360px) !important;
        max-width: 360px !important;
        background: #fff !important;
        box-shadow: -12px 0 32px rgba(15,23,42,.15) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        z-index: 1001 !important;
    }
    div#newnavbarNav{
        width: min(86vw, 360px) !important;
    }
    #navbarSupportedContent .navbar-collapse.collapsing{
        left: auto !important;
    }

    html:has(#newnavbarNav.show){
        overflow: hidden !important;
    }

    /* Drawer inner container — clean white surface */
    #navbarSupportedContent .collapse .menu-mainmenu-container{
        background: #fff !important;
        padding: 0 !important;
        width: 100% !important;
    }

    /* "Kategorier" section header (li.mobilecss) + "Kundeservice" footer strip
       → compact teal bars, crisp uppercase label, no motion.
       The inner <a> on Produkter has href="#" and would trigger
       main.js:209 which toggles .menu-parent globally (hides all top-level
       items, shows the matching submenu). It has no submenu → panel goes
       blank. Disable pointer-events on it so it's purely a label. */
    .navbar-desktop ul li.mobilecss.menu-item,
    .mobile-menu-footer .kundeservice{
        background: var(--ms-teal) !important;
        padding: 6px 14px !important;
        margin: 0 !important;
        width: 100% !important;
        color: #fff !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .12em !important;
        text-transform: uppercase !important;
        text-align: left !important;
        line-height: 1.4 !important;
        display: block !important;
    }
    .navbar-desktop ul li.mobilecss.menu-item a{
        pointer-events: none !important;
        cursor: default !important;
        padding: 0 !important;
        font-size: 0 !important;       /* hide "Produkter" label text */
        color: transparent !important;
        display: block !important;
    }
    /* Inject "KATEGORIER" instead of "Produkter" without editing the parent
       template file. Visually replaces the original text. */
    .navbar-desktop ul li.mobilecss.menu-item a::before{
        content: "Kategorier";
        display: block;
        font: 700 11px/1.4 'Inter', sans-serif;
        color: #fff;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    /* Top-level category rows — compact, icon-left, chevron-right */
    .navbar-desktop ul.header-menu{
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
    }
    .navbar-desktop ul.header-menu > li{
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border-bottom: 1px solid var(--ms-line) !important;
    }
    .navbar-desktop ul.header-menu > li > a,
    .mobile-container ul.header-menu li a{
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        padding: 12px 16px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: var(--ms-ink) !important;
        text-align: left !important;
        text-decoration: none !important;
        background: transparent !important;
    }
    .navbar-desktop ul.header-menu > li > a > span{
        position: static !important;
        padding: 0 !important;
        width: auto !important;
        color: var(--ms-ink) !important;
        font-weight: 500 !important;
        text-align: left !important;
    }
    .navbar-desktop ul.header-menu > li > a > img.menu-image.only-mobile{
        width: 26px !important;
        height: 26px !important;
        flex: 0 0 26px !important;
        margin: 0 !important;
        object-fit: contain !important;
    }
    /* Chevron on items with children — replaces old dashicons arrow */
    .navbar-desktop ul.header-menu > li.menu-item-has-children > a.dropdown-toggle::after{
        content: "›" !important;
        display: inline-block !important;
        margin-left: auto !important;
        font-size: 24px !important;
        line-height: 1 !important;
        color: var(--ms-ink-500) !important;
        font-family: inherit !important;
        transform: none !important;
        position: static !important;
        border: none !important;
        width: auto !important;
        height: auto !important;
    }

    /* Kill the yellow Tilbud block — replace with soft teal-accent CTA */
    .navbar-desktop ul.header-menu > li.tilbud{
        background: transparent !important;
    }
    .navbar-desktop ul.header-menu > li.tilbud > a{
        background: #e8eef0 !important;
        color: var(--ms-teal) !important;
        font-weight: 700 !important;
    }
    .navbar-desktop ul.header-menu > li.tilbud > a > span{
        color: var(--ms-teal) !important;
        font-weight: 700 !important;
    }

    /* Submenu (mega-menu) — when pushed in, stack clean rows */
    .navbar-desktop .navbar-nav .dropdown-menu{
        background: #fff !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }
    .navbar-desktop .navbar-nav .dropdown-menu li{
        width: 100% !important;
        padding: 0 !important;
        border-bottom: 1px solid var(--ms-line) !important;
    }
    .navbar-desktop .navbar-nav .dropdown-menu li a{
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 10px 16px !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: var(--ms-ink) !important;
    }
    .navbar-desktop .navbar-nav .dropdown-menu li a span{
        position: static !important;
        padding: 0 !important;
        width: auto !important;
        text-align: left !important;
    }
    /* Brand logos inside Mærker dropdown (Minecraft, Pokémon, etc) and the
       category icons inside Legetøj/Bamser/etc submenus all share the
       `<img class="menu-image">` markup. Force them to be visible at a
       readable size — the parent theme's responsive.css adds margin-left
       hacks per-category that can push the logo outside the row, and
       Bootstrap's mega-menu has historic `display:none` rules at certain
       breakpoints. Explicit display/visibility/opacity defends against
       those drift cases so the logo always renders on mobile. */
    .navbar-desktop .navbar-nav .dropdown-menu li a img.menu-image,
    .navbar-desktop .navbar-nav .dropdown-menu li a.dropdown-item img.menu-image{
        display: inline-block !important;
        width: 56px !important;
        height: 28px !important;
        max-width: 56px !important;
        max-height: 28px !important;
        flex: 0 0 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .navbar-desktop .navbar-nav .dropdown-menu .back-button-tilbage{
        background: var(--ms-bg-alt) !important;
        padding: 10px 16px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: var(--ms-ink-700) !important;
        text-transform: uppercase !important;
        letter-spacing: .06em !important;
        cursor: pointer !important;
    }

    /* When a submenu is pushed in (JS adds .menu-parent), override parent's
       aggressive negative margin that used to shift labels left */
    .newheader-desktop .navbar-desktop ul li.menu-item-has-children.show.menu-parent > a{
        margin-left: 0 !important;
        background: var(--ms-ink) !important;
    }
    .newheader-desktop .navbar-desktop ul li.menu-item-has-children.show.menu-parent > a > span{
        color: #fff !important;
        font-size: 15px !important;
        width: auto !important;
    }

    /* -------- Kundeservice footer block (CRO: phone = primary CTA) -------- */
    .mobile-menu-footer{
        padding: 0 !important;
        margin: 8px 0 0 0 !important;
        list-style: none !important;
    }
    .mobile-menu-footer li{
        padding: 0 !important;
        border: none !important;
    }
    .mobile-menu-footer .time{
        color: var(--ms-ink-500) !important;
        font-size: 12px !important;
        padding: 10px 16px 2px !important;
        text-align: left !important;
    }
    .mobile-menu-footer .email{
        padding: 8px 16px !important;
        text-align: left !important;
        margin: 0 !important;
        border: none !important;
    }
    .mobile-menu-footer .email a{
        color: var(--ms-teal) !important;
        font-weight: 600 !important;
        font-size: 14px !important;
        text-decoration: none !important;
    }
    .mobile-menu-footer .email i{
        color: var(--ms-teal) !important;
        margin-right: 8px !important;
    }

    /* Phone as bold teal pill — highest-converting CTA */
    .mobile-menu-footer .number{
        margin: 10px 16px !important;
        padding: 12px !important;
        border: none !important;
        background: var(--ms-teal) !important;
        border-radius: 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        text-align: center !important;
    }
    .mobile-menu-footer .number i,
    .mobile-menu-footer .number a{
        color: #fff !important;
        font-weight: 700 !important;
        font-size: 15px !important;
        text-decoration: none !important;
    }

    .mobile-menu-footer .menu{
        padding: 0 !important;
        border-top: 1px solid var(--ms-line) !important;
    }
    .mobile-menu-footer .menu a{
        display: block !important;
        padding: 10px 16px !important;
        color: var(--ms-ink-700) !important;
        font-size: 14px !important;
        text-decoration: none !important;
        background: transparent !important;
    }

    .mobile-menu-footer .social-icon{
        padding: 14px 16px 20px !important;
        display: flex !important;
        gap: 12px !important;
        justify-content: center !important;
        border-top: 1px solid var(--ms-line) !important;
    }
    .mobile-menu-footer .social-icon a{
        display: inline-flex !important;
    }
    .mobile-menu-footer .social-icon a img{
        width: 30px !important;
        height: 30px !important;
        border-radius: 50% !important;
    }
}