/* v24 — Mobile header: logo / search / menu. Scoped to the common header only.
 * The desktop form, drawer logic, fonts and page styles are not replaced.
 * An inline display:none keeps the extra form hidden if this stylesheet is missing.
 */
.site-header .site-header__row > .tp24-mobile-search {
    display: none;
}

@media (max-width: 640px) {
    .site-header .site-header__row {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 8px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0 auto;
        padding: 12px 14px;
        box-sizing: border-box;
    }

    .site-header .site-header__row > .site-header__logo {
        flex: 0 0 clamp(120px, 39vw, 174px);
        width: clamp(120px, 39vw, 174px);
        min-width: 0;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .site-header .site-header__row > .site-header__logo .site-header__logo-img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 40px;
        object-fit: contain;
    }

    /* Keep the pre-existing desktop controls hidden at the mobile breakpoint. */
    .site-header .site-header__row > .site-header__search,
    .site-header .site-header__row > .site-header__info,
    .site-header .site-header__row > .site-header__cta {
        display: none !important;
    }

    .site-header .site-header__row > .tp24-mobile-search {
        display: flex !important;
        align-items: center;
        flex: 1 1 0;
        position: relative;
        float: none;
        width: auto !important;
        min-width: 0;
        max-width: none;
        height: 40px;
        margin: 0 !important;
        padding: 0 !important;
        border: 0;
        background: transparent;
        box-shadow: none;
        box-sizing: border-box;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__input {
        display: block !important;
        appearance: none;
        -webkit-appearance: none;
        box-sizing: border-box;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 8px 38px 8px 10px !important;
        border: 1px solid #dfe2e7 !important;
        border-radius: 999px !important;
        background: #f4f5f7 !important;
        color: #181818 !important;
        font-family: var(--tp-font, Arial, sans-serif) !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        line-height: 22px !important;
        letter-spacing: normal;
        text-transform: none;
        text-align: left;
        box-shadow: none !important;
        transition: border-color .15s ease, box-shadow .15s ease;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__input::placeholder {
        color: #616872 !important;
        opacity: 1;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__input:focus {
        border-color: #006eff !important;
        outline: 2px solid transparent;
        box-shadow: 0 0 0 2px rgba(0, 110, 255, .16) !important;
    }

    /* The clear button is left to the keyboard; reserve room for the submit icon. */
    .site-header .tp24-mobile-search .tp24-mobile-search__input::-webkit-search-cancel-button,
    .site-header .tp24-mobile-search .tp24-mobile-search__input::-webkit-search-decoration {
        -webkit-appearance: none;
        display: none;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__submit {
        display: flex !important;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        right: 1px;
        bottom: auto;
        left: auto;
        box-sizing: border-box;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 999px !important;
        appearance: none;
        -webkit-appearance: none;
        background: transparent !important;
        background-image: none !important;
        color: #616872 !important;
        box-shadow: none !important;
        transform: none !important;
        cursor: pointer;
        line-height: 1;
        touch-action: manipulation;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__submit::before,
    .site-header .tp24-mobile-search .tp24-mobile-search__submit::after {
        display: none !important;
        content: none !important;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__submit svg {
        display: block;
        flex: 0 0 18px;
        width: 18px !important;
        height: 18px !important;
        margin: 0;
        pointer-events: none;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__submit:hover,
    .site-header .tp24-mobile-search .tp24-mobile-search__submit:focus-visible {
        color: #006eff !important;
    }

    .site-header .tp24-mobile-search .tp24-mobile-search__submit:focus-visible {
        outline: 2px solid #006eff;
        outline-offset: -4px;
    }

    /* Larger touch target; retain the existing two strokes and open/close animation. */
    .site-header .site-header__row > .site-header__burger.header__body-mobile-burger {
        flex: 0 0 36px;
        width: 36px;
        min-width: 36px;
        height: 40px;
        margin: 0;
        padding: 0;
        touch-action: manipulation;
    }

    .site-header .site-header__row > .site-header__burger.header__body-mobile-burger::before,
    .site-header .site-header__row > .site-header__burger.header__body-mobile-burger::after {
        left: 6px;
        width: 24px;
    }

    .site-header .site-header__row > .site-header__burger.header__body-mobile-burger:not(.active)::before {
        top: 15px;
    }

    .site-header .site-header__row > .site-header__burger.header__body-mobile-burger:not(.active)::after {
        bottom: 15px;
    }

    .site-header .site-header__row > .site-header__burger:focus-visible {
        outline: 2px solid #006eff;
        outline-offset: 2px;
        border-radius: 4px;
    }
}