/* 1. إلغاء أي مسافات خارجية للمتصفح أو الجسم */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
}

/* 2. تنسيق المنيو - يلتصق بالأعلى ويأخذ كامل العرض */
#menu {
    display: flex !important;
    list-style: none !important;
    background: linear-gradient(135deg, #1a2a6c, #4a148c) !important; /* تدرج ألوان فخم */
    margin: 0 !important;
    padding: 0 20px !important;
    width: 100%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    position: relative;
    top: 0;
}

    #menu li {
        position: relative;
    }

        /* 3. تنسيق الروابط الأساسية */
        #menu li a {
            display: block;
            padding: 18px 25px;
            color: white !important;
            text-decoration: none !important;
            font-weight: bold;
            transition: 0.3s;
        }

            #menu li a:hover {
                background: rgba(255, 255, 255, 0.2); /* وميض خفيف عند التحويم */
            }

        /* 4. القائمة المنسدلة - زجاجية وعصرية */
        #menu li ul {
            display: none !important; /* مخفية افتراضياً */
            position: absolute;
            top: 100%;
            left: 0;
            background: rgba(44, 62, 80, 0.95) !important; /* لون داكن شبه شفاف */
            width: 220px;
            list-style: none !important;
            z-index: 9999 !important;
            border-radius: 0 0 8px 8px;
            overflow: hidden;
        }

        /* تظهر عند مرور الماوس */
        #menu li:hover > ul {
            display: block !important;
        }

        /* 5. تنسيق روابط القائمة المنسدلة */
        #menu li ul li a {
            padding: 15px 20px;
            color: white !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }

            #menu li ul li a:hover {
                background: #fdbb2d !important;
                color: #1a2a6c !important;
            }

/* Basic prettyfying css */

table {
    font-family: sans-serif;
    width: 100%;
    border-collapse: collapse;
}

th, td {
    padding: 10px;
    text-align: left;
}

thead th {
    text-align: left;
    border-bottom: 2px solid #eceeef;
}

/* تلوين الأسطر الفردية بلون رمادي فاتح جداً */
tbody tr:nth-of-type(odd) {
    background: #e0e0e0;
}

/* تحسين مظهر النصوص داخل الخلايا */
td {
    color: #555;
    border-top: 1px solid #eceeef;
}