/**
 * نبراس — قائمة موبايل كلاسيكية (قائمة منسدلة حقيقية تحت الهيدر)
 * إصلاح: position:absolute على nav بارتفاع 0 — نرجع القائمة في تدفّق الصفحة
 */
@media (max-width: 768px) {
    header {
        z-index: 1100;
    }

    .header-main-row {
        flex-wrap: wrap !important;
        align-items: center;
        position: sticky;
        top: 0;
        z-index: 1101;
        background: var(--primary-blue);
    }

    header nav {
        flex: 1 1 100% !important;
        order: 3 !important;
        width: 100% !important;
        position: relative !important;
        height: auto !important;
        overflow: visible !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 1102;
    }

    header nav ul,
    #nav-menu {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 12px 20px 16px !important;
        gap: 10px !important;
        display: none;
        flex-direction: column !important;
        background: var(--primary-blue) !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25) !important;
        border-radius: 0 !important;
        border: none !important;
        max-height: min(70vh, 520px) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        list-style: none !important;
        z-index: 1102 !important;
        pointer-events: auto !important;
        transform: none !important;
        filter: none !important;
        opacity: 1 !important;
    }

    header nav ul.active,
    #nav-menu.active {
        display: flex !important;
        visibility: visible !important;
    }

    header nav ul li,
    #nav-menu li {
        width: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    header nav ul li a,
    #nav-menu li a {
        display: flex !important;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 12px 6px !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        color: #fff !important;
        text-decoration: none !important;
        cursor: pointer !important;
        pointer-events: auto !important;
        touch-action: manipulation;
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.15);
        border-radius: 0;
        background: transparent !important;
    }

    header nav ul li a:active,
    #nav-menu li a:active {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    .menu-toggle {
        display: block !important;
        margin-inline-start: auto !important;
        z-index: 1103 !important;
        position: relative;
        min-width: 44px;
        min-height: 44px;
    }
}