/* === MOBILE SIDEBAR — RELIABLE OPEN/CLOSE === */

.mobile-sidebar-overlay {
    display: none;
}

@media (max-width: 1399.98px) {
    body.mobile-menu-open {
        overflow: hidden !important;
        touch-action: none;
    }

    #sidebar.sidebar {
        left: -320px !important;
        width: min(320px, 86vw) !important;
        max-width: 86vw !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;

        transition: left 0.24s ease !important;
    }

    #sidebar.sidebar.mobile-show {
        left: 0 !important;
    }

    .mobile-sidebar-overlay {
        position: fixed;
        inset: 0;
        z-index: 1040;

        display: block;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        background: rgba(19, 29, 39, 0.38);
        backdrop-filter: blur(2px);

        transition:
            opacity 0.20s ease,
            visibility 0.20s ease;
    }

    .mobile-sidebar-overlay.mobile-show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    #mobile-menu-btn {
        position: relative;
        z-index: 1;

        min-width: 42px;
        min-height: 42px;

        cursor: pointer;
        touch-action: manipulation;
    }
}

/* === END MOBILE SIDEBAR — RELIABLE OPEN/CLOSE === */


/* === MOBILE SIDEBAR — CURATED PAGES === */

.sidebar-mobile-nav {
    display: none;
}

@media (max-width: 767.98px) {
    #sidebar .sidebar-desktop-nav,
    #sidebar .sidebar-bottom-controls {
        display: none !important;
    }

    #sidebar .sidebar-mobile-nav {
        display: flex !important;
        flex-direction: column;
        gap: 5px;

        width: 100%;
        padding: 4px 12px 28px;
        overflow-y: auto;
    }

    #sidebar .sidebar-mobile-link.nav-link {
        display: flex !important;
        align-items: center !important;
        gap: 14px;

        width: 100%;
        min-height: 48px;
        padding: 11px 14px !important;

        color: #394554 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 11px !important;

        font-size: 0.95rem;
        font-weight: 500;
        text-decoration: none;
    }

    #sidebar .sidebar-mobile-link.nav-link:hover {
        color: var(--text) !important;
        background: #f7f3ed !important;
    }

    #sidebar .sidebar-mobile-link.nav-link.active {
        color: #ffffff !important;
        background: var(--brand-accent) !important;
        box-shadow: 0 5px 14px rgba(21, 157, 145, 0.18);
    }

    #sidebar .sidebar-mobile-link-icon {
        flex: 0 0 23px;

        width: 23px;
        margin: 0 !important;

        color: var(--brand-accent);
        font-size: 1.15rem;
        text-align: center;
    }

    #sidebar .sidebar-mobile-link.active
    .sidebar-mobile-link-icon {
        color: #ffffff;
    }

    #sidebar .sidebar-mobile-link-title {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* === END MOBILE SIDEBAR — CURATED PAGES === */

/* === MOBILE INSTALL APP — SAME AS NAV LINKS === */

@media (max-width: 767.98px) {
    #sidebar button.sidebar-mobile-install-btn {
        cursor: pointer;
        text-align: left;
    }
}

/* === END MOBILE INSTALL APP — SAME AS NAV LINKS === */