/* A compact mobile storefront header; desktop keeps its full navigation. */
.header-menu-toggle,
.header-mobile-wordmark,
.header-mobile-service,
.header-mobile-account,
.header-mobile-cart { display: none; }

@media (max-width: 768px) {
    body .top-bar {
        display: block !important;
        padding: 7px 16px !important;
        background: #007a49;
        color: #fff;
        min-height: 29px;
    }
    body .top-bar .right-side,
    body .top-bar .translate-fixed { display: none !important; }
    body .top-bar .top-bar-inner { display: block !important; padding: 0; }
    body .top-bar .usp-top-list {
        display: block !important;
        position: static;
        height: auto;
        min-height: 0;
    }
    body .top-bar .usp-top-text {
        position: static !important;
        display: none !important;
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        font-size: 11px !important;
        line-height: 15px;
        padding: 0;
        color: #fff;
    }
    body .top-bar .usp-top-text:first-child { display: block !important; }
    body .top-bar .fa { color: #b5f1d0; margin-right: 5px; }
    body header.header {
        border-bottom: 1px solid #e3e9e5;
        box-shadow: none;
    }
    body .header .header-n.wrap { padding: 8px 16px 9px; }
    body .header .header-n-flex {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) 88px;
        grid-template-areas: "menu logo actions" "search search search" "service service service";
        column-gap: 9px;
        row-gap: 8px;
        padding: 0;
        align-items: center;
    }
    body .header .header-menu-toggle {
        grid-area: menu;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        min-height: 44px;
        width: 44px;
        padding: 0;
        color: #000;
        font-weight: 700;
        border: 0;
        background: transparent;
    }
    .header-menu-toggle span { color: #000; font-weight: 700; font-size: 9px; line-height: 1; text-transform: uppercase; letter-spacing: .04em; }
    body .header .header-n-flex .logo { grid-area: logo; width: auto; min-width: 0; margin: 0; }
    body .header .header-n-flex .logo > a { display: inline-flex; align-items: center; min-height: 44px; }
    body .header .header-n-flex .logo img { display: none; }
    body .header .header-mobile-wordmark {
        display: inline-flex;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 5px;
        font: 750 20px/1.15 var(--store-font, sans-serif);
        letter-spacing: -.6px;
        color: #009b5b;
    }
    body .header .header-n-flex .actions {
        grid-area: actions;
        justify-content: flex-end;
        gap: 0;
        margin: 0;
        width: 88px;
    }
    body .header .header-n-flex .actions > .header-icon-btn,
    body .header .header-n-flex .actions > .header-phone,
    body .header .header-n-flex .actions > .account-menu-wrapper,
    body .header .header-n-flex .actions > .shoppingcart,
    body .header .header-n-flex .actions > .shoppingcart#webshopShoppingcartSmall { display: none !important; }
    body .header .header-mobile-account,
    body .header .header-mobile-cart {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 44px;
        min-height: 44px;
        color: #173b2b;
        font-size: 23px;
        text-decoration: none;
    }
    .header-mobile-cart-count {
        position: absolute;
        top: 0;
        right: -1px;
        min-width: 17px;
        padding: 1px 4px;
        border-radius: 20px;
        background: #007a49;
        color: #fff;
        font-size: 10px;
        line-height: 15px;
        text-align: center;
    }
    body .header .header-n-flex .search-bar {
        grid-area: search;
        display: flex;
        flex-direction: column;
        width: 100% !important;
        min-width: 0;
        max-width: none;
        margin: 0;
        gap: 7px;
    }
    body .header .header-n-flex form.webshopSearch {
        position: relative;
        display: flex !important;
        width: 100% !important;
        height: 42px;
        min-height: 42px;
        border: 1px solid #009d5e !important;
        border-radius: 8px;
        margin: 0;
    }
    body .header .header-n-flex .webshopSearch .search-text {
        height: 40px;
        font: 400 16px/40px var(--store-font, sans-serif);
        padding: 0 12px;
        border-radius: 7px 0 0 7px;
        flex: 1;
        min-width: 0;
    }
    body .header .header-n-flex .webshopSearch .search-text::placeholder {
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        color: #6a746e;
    }
    body .header .header-n-flex .webshopSearch .search-btn {
        height: 40px !important;
        min-width: 44px;
        width: 44px !important;
        padding: 0;
        border-radius: 0 7px 7px 0;
        background: #00ae69 !important;
    }
    body .header .search-btn .search-btn-text { display: none; }
    body .header .header-n-flex .search-bar a.rating {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
        padding: 0;
        margin: 0;
        min-height: 20px;
        font-size: 12px;
        line-height: 20px;
        white-space: nowrap;
    }
    body .header .header-n-flex .rating .stars { display: flex; gap: 2px; font-size: 14px; }
    body .header .header-mobile-service {
        grid-area: service;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
        color: #365345;
        font-size: 11px;
        line-height: 16px;
    }
    .header-mobile-service .fa { color: #009d5e; }
    body .header .mega-menu { background: transparent; height: 0; }
    body .header .mega-menu > .wrap { display: none; }
    body .infinite-menu { width: min(90vw, 380px); height: 100dvh; border-radius: 0 14px 14px 0; }
    body .infinite-menu-header { padding: 16px; font-size: 18px; min-height: 64px; }
    body .infinite-menu-header button { min-width: 44px; min-height: 44px; }
    body .infinite-menu-body .menu-page { padding-top: 8px; }
    body .infinite-menu-body a { min-height: 48px; padding: 12px 18px; font-size: 15px; border-bottom: 1px solid #f0f3f1; }
    body .infinite-menu-body a:hover { background: #edf8f2; }
    body .header-menu-toggle:focus-visible,
    body .header-mobile-account:focus-visible,
    body .header-mobile-cart:focus-visible { outline: 2px solid #007a49 !important; outline-offset: 1px; }
}

@media (max-width: 768px) {
    body .infinite-menu-footer {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        gap: 8px;
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid #e0e9e3;
        background: #f7fbf8;
    }
    body .infinite-menu-footer a { color: #007a49; padding: 8px 4px; font-size: 13px; font-weight: 600; }
}