/* Brand primary color (applied on Side-menu background color) */
.primary-color {
    color: #ffffff;     /* White */
    background: #1b2a6b !important;     /* Dark Blue */
}

/* Primary button color */
.btn-primary {
    background-color: #1b2a6b; /* Dark Blue */
    color: #ffffff /* White */
}

/* Primary button color ON HOVER */
.btn-primary:hover {
    background-color: #ffd33f; /* Yellow */
}

/* Header elements */
.header-item, .noti-icon i {
    color: #1b2a6b; /* Dark Blue */
}

    /* Header elements ON HOVER */
    .header-item:hover, .noti-icon i:hover {
        color: #ffd33f; /* Yellow */
    }


/* ------- START OF SIDE MENU ------- */

/* Menu Title */
body .menu-title {
    color: #ffffff;     /* White */
    opacity: 1;
}

/* Any Side-menu elements EXCEPT the active one */
body #sidebar-menu ul li a:not(.active, .mm-active) {
    color: #ffffff !important;      /* White */
}

#sidebar-menu .item.mm-active {
    background-color: #293776
}

/* Side-menu elements ON HOVER */
body #sidebar-menu ul li a:hover {
    color: #ffd33f !important;      /* Yellow */
    background: rgba(52, 152, 219, 0.2);
    color: #ecf0f1;
    transform: translateX(-5px);
    box-shadow: 0 1px 8px rgba(52, 152, 219, 0.3);
}

/* Side-menu ACTIVE elements */
body #sidebar-menu .mm-active .active, body #sidebar-menu .mm-active, body .mm-active > a {
    color: #ffd33f !important; /* Yellow */
}

/* Side-menu icons */
body #sidebar-menu ul li a:not(.active) i {
    color: #ffffff !important;      /* White */
}

/* Side-menu icons ON HOVER */
body #sidebar-menu ul li a i:hover {
    color: #ffd33f !important;      /* Yellow */
}

/* ACTIVE Side-menu icons (single and dropdown) */
body #sidebar-menu ul li a.mm-active i, #sidebar-menu ul li a.active i {
    color: #ffd33f !important;      /* Yellow */
}

/* Small Logo (icon) */
.vertical-collpsed .logo span.logo-sm {
    display: block;
    justify-self: center;
}

/* Collapsed Side Menu - Menu item text */
body.vertical-collpsed .vertical-menu #sidebar-menu ul > li > a {
    color: #ffffff !important;      /* White */
}

    /* Collapsed Side Menu - ACTIVE menu item text */
    body.vertical-collpsed .vertical-menu #sidebar-menu ul > li > a.mm-active {
        color: #ffffff !important;      /* White */
    }

/* Collapsed Side Menu - Menu items ON HOVER (it shows the name of the hovered item with a dropdown list) */
body.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    background-color: #1b2a6b;      /* Dark Blue */
}

/* Collapsed Side Menu - Sub-menu drop-down links */
body.vertical-collpsed .vertical-menu #sidebar-menu ul.sub-menu.mm-collapse a {
    color: #1b2a6b !important;      /* Dark Blue */
}

    /* Collapsed Side Menu - Sub-menu drop-down links ON HOVER */
    body.vertical-collpsed .vertical-menu #sidebar-menu ul.sub-menu.mm-collapse a:hover {
        color: #ffd33f !important;      /* Yellow */
    }

    /* Collapsed Side Menu - Sub-menu drop-down ACTIVE links */
    body.vertical-collpsed .vertical-menu #sidebar-menu ul.sub-menu.mm-collapse a.active {
        color: #ffd33f !important;      /* Yellow */
    }

/* ------- END OF SIDE MENU ------- */