/*
 * Heikaya v6.20.10 — phone-only MASU proportion correction.
 *
 * This pass matches the visual balance shown on masuhome.com more closely:
 * compact 3-line burger, restrained centered logo, larger search/bag icons,
 * cleaner spacing, and no overlapping announcement messages.
 * Desktop and tablet are intentionally untouched.
 */

@media (max-width: 767px) {
    /* Keep the mobile header closer to MASU's compact white bar. */
    #lumiere-site-header .lumiere-header__inner {
        width: calc(100% - 32px) !important;
        height: 88px !important;
        min-height: 88px !important;
        max-height: 88px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    #lumiere-site-header .lumiere-header__actions {
        height: 88px !important;
        min-height: 88px !important;
        gap: 2px !important;
    }

    #lumiere-site-header .lumiere-primary-nav {
        max-height: calc(100svh - 88px) !important;
    }

    /* The Heikaya mark stays centered, but no longer dominates the header. */
    #lumiere-site-header .lumiere-header__brand .custom-logo {
        width: auto !important;
        height: auto !important;
        max-width: 116px !important;
        max-height: 62px !important;
        object-fit: contain !important;
    }

    #lumiere-site-header .lumiere-header__site-name {
        font-size: 27px !important;
        line-height: 1 !important;
    }

    /* MASU-like action scale: visually larger icons, invisible tap boxes. */
    #lumiere-site-header .lumiere-search-toggle,
    #lumiere-site-header .lumiere-header__cart {
        display: grid !important;
        place-items: center !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #15120f !important;
    }

    #lumiere-site-header .heikaya-header-icon--masu-mobile {
        display: block !important;
        width: 27px !important;
        height: 27px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 1.55 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    #lumiere-site-header .lumiere-header__cart .heikaya-header-icon--masu-mobile {
        width: 28px !important;
        height: 28px !important;
    }

    /* MASU burger: three compact parallel lines, not three widely-spaced grid rows. */
    #lumiere-site-header .lumiere-mobile-toggle {
        position: absolute !important;
        top: 50% !important;
        left: 0 !important;
        z-index: 5 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #15120f !important;
        transform: translateY(-50%) !important;
    }

    #lumiere-site-header .lumiere-mobile-toggle span,
    #lumiere-site-header .lumiere-mobile-toggle span + span {
        display: block !important;
        width: 22px !important;
        max-width: 22px !important;
        height: 1.4px !important;
        margin: 0 !important;
        border-radius: 0 !important;
        background: currentColor !important;
    }

    #lumiere-site-header .lumiere-mobile-toggle.is-open span:nth-child(1) {
        transform: translateY(6.4px) rotate(45deg) !important;
    }

    #lumiere-site-header .lumiere-mobile-toggle.is-open span:nth-child(2) {
        opacity: 0 !important;
    }

    #lumiere-site-header .lumiere-mobile-toggle.is-open span:nth-child(3) {
        transform: translateY(-6.4px) rotate(-45deg) !important;
    }

    /* MASU does not show a zero bubble beside an empty bag. */
    #lumiere-site-header .lumiere-cart-count[data-cart-count="0"] {
        display: none !important;
    }

    #lumiere-site-header .lumiere-cart-count {
        top: -1px !important;
        right: -1px !important;
        min-width: 16px !important;
        height: 16px !important;
        padding: 0 4px !important;
        border-width: 1.5px !important;
        font-size: 7.5px !important;
    }

    /* Drawer icons stay in the same minimal outline family. */
    #lumiere-site-header .heikaya-mobile-account-menu .heikaya-masu-menu-icon,
    #lumiere-site-header .heikaya-mobile-wishlist-menu .heikaya-masu-menu-icon {
        width: 23px !important;
        height: 23px !important;
        stroke-width: 1.55 !important;
    }

    /* Prevent two announcement messages cross-fading over each other on phones. */
    body .lumiere-news-stripe__item {
        opacity: 0 !important;
        visibility: hidden !important;
        transform: none !important;
        transition: none !important;
        pointer-events: none !important;
    }

    body .lumiere-news-stripe__item.is-active {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* Keep the promo copy to one clean line whenever the viewport allows it. */
    body .lumiere-news-stripe__item a,
    body .lumiere-news-stripe__item span {
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    @media (max-width: 380px) {
        #lumiere-site-header .lumiere-header__brand .custom-logo {
            max-width: 108px !important;
            max-height: 58px !important;
        }

        #lumiere-site-header .lumiere-search-toggle,
        #lumiere-site-header .lumiere-header__cart,
        #lumiere-site-header .lumiere-mobile-toggle {
            width: 40px !important;
            min-width: 40px !important;
            height: 40px !important;
            min-height: 40px !important;
        }

        #lumiere-site-header .heikaya-header-icon--masu-mobile {
            width: 25px !important;
            height: 25px !important;
        }

        #lumiere-site-header .lumiere-header__cart .heikaya-header-icon--masu-mobile {
            width: 26px !important;
            height: 26px !important;
        }
    }
}