/* ScrollBar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 1px #bbb;
    border-radius: 6px;
}

::-webkit-scrollbar-thumb {
    background: #ccc;
    /* background: red; */
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}

.apexcharts-pie-label,
.apexcharts-datalabels,
.apexcharts-datalabel,
.apexcharts-datalabel-label,
.apexcharts-datalabel-value {
    fill: var(--reindalLight) !important;
}

/* Sidebar: white background only on hover and selected items */
#sidebar-menu ul li.mm-active {
    background-color: transparent !important;
}

#sidebar-menu ul li a:hover,
#sidebar-menu ul li a:focus,
#sidebar-menu ul li.mm-active > a,
#sidebar-menu ul li ul.sub-menu li a:hover,
#sidebar-menu ul li ul.sub-menu li.mm-active > a {
    background-color: #fff !important;
}

body[data-sidebar="dark"] #sidebar-menu ul li a:hover,
body[data-sidebar="dark"] #sidebar-menu ul li a:hover i,
body[data-sidebar="dark"] #sidebar-menu ul li.mm-active > a,
body[data-sidebar="dark"] #sidebar-menu ul li.mm-active > a i,
body[data-sidebar="dark"] #sidebar-menu ul li ul.sub-menu li a:hover,
body[data-sidebar="dark"] #sidebar-menu ul li ul.sub-menu li.mm-active > a,
body[data-sidebar="dark"] #sidebar-menu ul li ul.sub-menu li.mm-active > a i {
    color: var(--reindalDark) !important;
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a,
body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a,
body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a:hover,
body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul li.mm-active > a {
    background-color: #fff !important;
    color: var(--reindalDark) !important;
}

body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i,
body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a:hover i,
body[data-sidebar="dark"].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul li.mm-active > a i {
    color: var(--reindalDark) !important;
}