body.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

/* تلوين شريط التنقل في الوضع الداكن */
body.dark-mode .navbar {
    background-color: #1f1f1f !important;
}

/* تلوين روابط التنقل */
body.dark-mode .nav-link {
    color: #e0e0e0 !important;
}

/* تلوين بطاقات Bootstrap في الوضع الداكن */
body.dark-mode .card {
    background-color: #1e1e1e;
    border-color: #2c2c2c;
}

/* تلوين الـtable في الوضع الداكن */
body.dark-mode .table {
    color: #e0e0e0;
    background-color: #1e1e1e;
    border-color: #2c2c2c;
}

/* مثال بسيط لكل عناصر الـbtn في الوضع الداكن */
body.dark-mode .btn {
    background-color: #2c2c2c;
    color: #e0e0e0;
    border-color: #444;
}

/* وغيرها من التنسيقات الخاصة بالوضع الداكن كما تريد */