/* ==== جعل الموقع يتناسب مع الجوال بأقل مجهود ممكن ==== */

@media screen and (max-width: 768px) {
    body {
        font-size: 18px !important;      /* نص أكبر على الجوال */
        margin: 10px !important;
    }

    table, td, th {
        font-size: 16px !important;
        padding: 8px !important;
    }

    /* إذا كنت تستخدم جداول بعرض 100% أو عرض ثابت */
    table {
        width: 100% !important;
        table-layout: fixed;
        overflow-wrap: break-word;
    }

    img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* إذا كان لديك div أو table بعرض ثابت كبير */
    div, table, td {
        max-width: 100% !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* للشاشات الصغيرة جدًا */
@media screen and (max-width: 480px) {
    body { font-size: 20px !important; }
    table, td, th { font-size: 17px !important; }
}