/* 
 * سكرتيري - إصلاح Layout الجوال (نسخة قوية)
 * v2.6.3 - Force fix
 */

/* ========== Reset عام للـ Mobile ========== */
@media (max-width: 991.98px) {
    
    /* الـ HTML و Body */
    html, body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        margin: 0 !important;
    }
    
    /* main يأخذ كل العرض */
    main {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    
    /* الـ container - عرض كامل */
    main > .container,
    main .container,
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 16px !important;
        padding-left: 16px !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
    
    /* الـ row */
    .row {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        --bs-gutter-x: 1rem;
        display: flex !important;
        flex-wrap: wrap !important;
    }
    
    /* كل الأعمدة على الجوال = عرض كامل */
    .row > [class*="col-"]:not(.col-6):not(.col-4):not(.col-3):not(.col-2):not(.col-auto) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
    }
    
    /* الكاردات */
    .card {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 1rem;
    }
    
    /* العناوين */
    h1, h2, h3, h4 {
        width: 100% !important;
        word-wrap: break-word;
    }
}

/* ========== الشاشات الصغيرة ========== */
@media (max-width: 576px) {
    main > .container,
    .container {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }
    
    .card-body {
        padding: 1rem !important;
    }
    
    h2 { font-size: 1.4rem !important; }
    h3 { font-size: 1.2rem !important; }
}

/* ========== إصلاح الـ flex/grid في dashboard ========== */
@media (max-width: 991.98px) {
    .row.g-3 > div,
    .row.g-4 > div,
    .row.g-2 > div {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* ========== Bottom Nav padding ========== */
@media (max-width: 768px) {
    body {
        padding-bottom: 90px !important;
    }
}
