/*
 * Royal Servicess LLC
 * Customer Mobile Navigation M1
 *
 * Mobile/tablet account shortcuts only.
 * Existing desktop navigation and JavaScript preserved.
 */

.app-shell-header--customer
.app-shell-nav
.app-shell-nav__mobile-extra,
.app-shell-header--customer
.app-shell-nav
.app-shell-nav__mobile-section {
    display: none !important;
}

@media (max-width: 1120px) {

    .app-shell-header--customer
    .app-shell-nav
    .app-shell-nav__mobile-section {
        display: block !important;
        grid-column: 1 / -1;
        width: 100%;
        margin-top: 10px;
        padding: 13px 12px 8px;
        border-top: 1px solid rgba(220, 180, 90, .17);
        color: #d9bc78;
        font-size: 10px;
        font-weight: 800;
        line-height: 1.4;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .app-shell-header--customer
    .app-shell-nav
    a.app-shell-nav__mobile-extra {
        display: flex !important;
        align-items: center;
        min-width: 0;
        width: 100%;
        min-height: 43px;
        padding: 10px 12px;
        box-sizing: border-box;
        text-decoration: none;
    }

    .app-shell-header--customer
    .app-shell-nav
    form.app-shell-nav__mobile-extra {
        display: block !important;
        width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .app-shell-header--customer
    .app-shell-nav
    .app-shell-nav__mobile-signout {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 43px;
        margin: 0;
        padding: 10px 12px;
        box-sizing: border-box;
        border: 1px solid rgba(230, 190, 100, .22);
        border-radius: 9px;
        background: rgba(220, 180, 85, .06);
        color: #ead49e;
        font: inherit;
        font-size: .78rem;
        font-weight: 700;
        line-height: 1.4;
        text-align: left;
        cursor: pointer;
    }

    .app-shell-header--customer
    .app-shell-nav
    .app-shell-nav__mobile-signout:hover,
    .app-shell-header--customer
    .app-shell-nav
    .app-shell-nav__mobile-signout:focus-visible {
        background: rgba(220, 180, 85, .13);
        border-color: rgba(230, 190, 100, .4);
        outline-offset: 2px;
    }

    .app-shell-header--customer.is-dashboard-menu-open
    .app-shell-nav {
        max-height: min(75vh, 720px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        pointer-events: auto !important;
        opacity: 1 !important;
    }
}

@media (max-width: 640px) {

    .app-shell-header--customer
    .app-shell-nav
    .app-shell-nav__mobile-section {
        margin-top: 8px;
    }

    .app-shell-header--customer
    .app-shell-nav
    a.app-shell-nav__mobile-extra {
        min-height: 45px;
    }
}
