/* 
    11.06.2024 - ADRES
    DARK MODE THEME
*/

/* Root palette color */
:root {
    --primary-color: #171C29;
    --secondary-color: #242A3A;
    --tertiary-color: #34394A;

    --border-color: #3c8dbc;

    --text-color: #e8e8e8;
    --secondary-text-color: #80c8ec;

    --default-color: #1572E8;
}
/* End */

/* existing */
.card{
    color: black;
}

.navbar-custom-menu {
    display: flex;
    margin-left: auto; /* Pushes the menu to the right */
    align-items: center; /* Center items vertically */
}
.navbar-toggle{
    width: 100%;
    min-height: 60px;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background: linear-gradient(154deg, var(--default-color) 0%, var(--border-color) 100%);
}
.navbar-btn>i.hdr-btn {
    width: 28px;
    float: left;
    height: 28px;
    display: block;
    line-height: 28px;
    text-align: center;
    border-radius: 3px;
    color: var(--text-color);
    background: var(--default-color);
}
.navbar{
    padding: 1rem 1rem;
}
/* end existing */


/* Login Page */
#login-page-text>h2{
    color: black;
    font-size: 54px; 
    font-family: 'Montserrat';
}
#login-page-text>h3{
    color: black;
    font-size: 38px; 
    font-family: 'Montserrat';
}
.dark-mode #login-page-text>h2{
    font-size: 54px; 
    color: white;
    font-family: 'Montserrat';
}
.dark-mode #login-page-text>h3{
    font-size: 38px; 
    color: white;
    font-family: 'Montserrat';
}
/* end login page */

/* header */
.dark-mode .main-header{
    color: white;
    background: var(--primary-color);
}

.dark-mode .navbar-toggle {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background: linear-gradient(154deg, var(--secondary-color) 0%, var(--tertiary-color) 100%);
}

.dark-mode .navbar{
    padding: 1rem 1rem;
}

.dark-mode .navbar-btn>i.hdr-btn {
    width: 28px;
    float: left;
    height: 28px;
    display: block;
    line-height: 28px;
    text-align: center;
    border-radius: 3px;
    color: var(--text-color);
    background: var(--secondary-color);
}
/* end header */

/* content */

.dark-mode .wrapper,
.dark-mode .main-panel,
.dark-mode .content{
    color: white;
    background: var(--primary-color);
}

.dark-mode .card{
    border-radius: 10px;
    color: white;
    background: var(--secondary-color);
}

.dark-mode .page-title,
.dark-mode label{
    color: white !important;
}

#border-card-dashboard{
    height: 100px;
    border-left: 1px solid black; 
}

.dark-mode #border-card-dashboard{
    height: 100px;
    border-left: 1px solid white; 
}
/* end content */

/* content modal */
.dark-mode .modal-content{
    color: white;
    background: var(--secondary-color);
}
/* end content modal */

/* sidebar */
.logo-header{
    background: var(--default-color);
}

.dark-mode .logo-header{
    background: var(--primary-color);
}

.dark-mode .sidebar-wrapper,
.dark-mode .sidebar-content{
    color: white;
    background: var(--primary-color);
}

.sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a {
    background: #ffffff !important;
    box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.1), 4px 4px 15px -5px rgba(21, 114, 232, 0.4) !important;
}

.dark-mode .sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a{
    box-shadow: none !important;
    background: var(--secondary-color) !important;
}

.dark-mode .sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a p,
.dark-mode .sidebar.sidebar-style-2 .nav.nav-primary > .nav-item.active > a i  {
    color: white !important;
}

.dark-mode .container{
    background: var(--primary-color);
}
/* end sidebar */