/**
 * APS login/signup header — match Auto Part Search compact nav (phone + tablet ≤1024).
 * Desktop (≥1025) keeps the existing pill login + cart layout.
 */

@media (max-width: 1024px) {
    /* Sticky the nav bar only (slogan lives outside this wrap). */
    .aps-login-header-wrap {
        position: sticky;
        top: 0;
        z-index: 60;
        background-color: #054f59;
    }

    .aps-login-header-wrap .aps-main-header {
        position: relative;
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.65rem 0.75rem !important;
        background-color: #054f59 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    }

    .aps-login-header-wrap .aps-mobile-header__brand {
        flex: 0 1 auto;
        min-width: 0;
    }

    .aps-login-header-wrap .aps-mobile-header__brand > .rounded {
        width: 9.5rem !important;
        max-width: calc(100vw - 7.5rem);
    }

    .aps-login-header-wrap .aps-mobile-header__actions {
        flex: 0 0 auto;
        gap: 0;
        padding: 0;
        margin-left: 0;
    }

    .aps-login-header-wrap .aps-mobile-header__icon-group {
        display: flex;
        align-items: center;
        gap: 0.625rem;
        flex-shrink: 0;
    }

    .aps-login-header-wrap .aps-mobile-header__icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.5rem;
        height: 2.5rem;
        border: 0;
        border-radius: 9999px;
        background: #00FFB5;
        color: #002d2f;
        font-size: 0.9375rem;
        line-height: 1;
        cursor: pointer;
        padding: 0;
        text-decoration: none;
        box-sizing: border-box;
        flex-shrink: 0;
    }

    .aps-login-header-wrap .aps-mobile-header__menu {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: auto;
        height: auto;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: #00FFB5;
        font-size: 1.5rem;
        line-height: 1;
        cursor: pointer;
    }

    .aps-login-header-wrap ~ #mobile-menu-overlay #mobile-menu-drawer.translate-x-0,
    #mobile-menu-overlay #mobile-menu-drawer.translate-x-0 {
        transform: translateX(0) !important;
    }

    #mobile-menu-overlay #mobile-menu-drawer.aps-mobile-menu-drawer {
        right: 0;
        left: auto;
        transform: translateX(100%);
    }
}

@media (min-width: 1025px) {
    .aps-login-header-wrap {
        position: static;
        background: transparent;
    }

    .aps-login-header-wrap .aps-main-header {
        position: static;
        background: transparent;
        background-color: transparent;
    }

    .aps-login-header-wrap .aps-mobile-header__brand > .rounded {
        width: 180px !important;
        max-width: none;
    }
}