/* ==========================================================
   Dark Mode
========================================================== */

body{

    transition:background .3s,color .3s;

}

/* Background */

body.dark-mode{

    background:#121212;

    color:#f1f5f9;

}

/* Navbar */

body.dark-mode .navbar{

    background:#1e1e1e !important;

    border-color:#2f2f2f !important;

}

body.dark-mode .navbar .nav-link{

    color:#f8fafc !important;

}

body.dark-mode .navbar .dropdown-menu{

    background:#232323;

    color:#fff;

}

/* Sidebar */

body.dark-mode .sidebar{

    background:#1a1a1a;

}

body.dark-mode .sidebar .nav-link{

    color:#d1d5db;

}

body.dark-mode .sidebar .nav-link:hover{

    background:#2d3748;

}

/* Card */

body.dark-mode .card{

    background:#1f1f1f;

    color:#fff;

    border-color:#333;

}

/* Form */

body.dark-mode .form-control{

    background:#2a2a2a;

    color:#fff;

    border-color:#444;

}

body.dark-mode .form-control::placeholder{

    color:#9ca3af;

}

/* Dropdown */

body.dark-mode .dropdown-item{

    color:#f8fafc;

}

body.dark-mode .dropdown-item:hover{

    background:#333;

}

/* Table */

body.dark-mode table{

    color:#fff;

}

/* Footer */

body.dark-mode footer{

    background:#1e1e1e;

    color:#d1d5db;

}