/* ============================================
   إصلاح شامل للهيدر على الجوال
   Complete Mobile Header Fix
   ============================================ */

/* إعادة ترتيب الهيدر بالكامل على الجوال */
@media (max-width: 768px) {
    /* إعادة تعيين container */
    .header .container {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 0.5rem 0.75rem !important;
        gap: 0.5rem !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* الصف العلوي - الشعار والأزرار */
    .header-top-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 0.5rem !important;
        flex-wrap: nowrap !important;
        order: 1 !important;
    }
    
    /* الشعار على اليسار */
    .header-top-row .header-left {
        display: flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        gap: 0.5rem !important;
    }
    
    .header-top-row .header-left .logo {
        display: flex !important;
        align-items: center !important;
    }
    
    .header-top-row .header-left .logo-img {
        width: clamp(66px, 14.4vw, 90px) !important;
        height: auto !important;
        max-height: clamp(66px, 14.4vw, 90px) !important;
    }
    
    /* الأزرار على اليمين */
    .header-top-row .header-actions-row {
        display: flex !important;
        align-items: center !important;
        gap: clamp(0.3rem, 1vw, 0.5rem) !important;
        flex: 0 0 auto !important;
        flex-wrap: nowrap !important;
    }
    
    .header-top-row .header-actions-row .header-icon-btn {
        width: clamp(32px, 7.5vw, 38px) !important;
        height: clamp(32px, 7.5vw, 38px) !important;
        font-size: clamp(0.85rem, 2.2vw, 1rem) !important;
        padding: 0 !important;
        flex-shrink: 0 !important;
        min-width: clamp(32px, 7.5vw, 38px) !important;
    }
    
    .header-top-row .header-actions-row .header-right {
        display: flex !important;
        align-items: center !important;
        gap: clamp(0.3rem, 1vw, 0.5rem) !important;
        flex: 0 0 auto !important;
    }
    
    /* إخفاء header-center على الجوال */
    .header .container > .header-center {
        display: none !important;
    }
    
    /* إخفاء أي header-left أو header-right خارج header-top-row */
    .header .container > .header-left:not(.header-top-row .header-left),
    .header .container > .header-right:not(.header-top-row .header-actions-row .header-right) {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .header .container {
        padding: 0.4rem 0.6rem !important;
        gap: 0.4rem !important;
    }
    
    .header-top-row {
        gap: 0.4rem !important;
    }
    
    .header-top-row .header-left .logo-img {
        width: clamp(60px, 13.2vw, 78px) !important;
        max-height: clamp(60px, 13.2vw, 78px) !important;
    }
    
    .header-top-row .header-actions-row {
        gap: clamp(0.25rem, 0.8vw, 0.4rem) !important;
    }
    
    .header-top-row .header-actions-row .header-icon-btn {
        width: clamp(30px, 7vw, 36px) !important;
        height: clamp(30px, 7vw, 36px) !important;
        font-size: clamp(0.8rem, 2vw, 0.95rem) !important;
        min-width: clamp(30px, 7vw, 36px) !important;
    }
}