/**
Custom CSS
*/

.nav-border {
    border-bottom: 3px solid #111827;
    /* top: 0;
    position: -webkit-sticky;
    position: sticky; */
}

.nav-fixed {
    position: fixed;
    top: 0;
    right: 0;
    left: 14rem;
    z-index: 1;
}

@media screen and (max-width: 768px) {
    .nav-fixed {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1;
    }
}

.sidebar {
    /*This line code can be uncommented if you want to have fixed*/
    max-height: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    position: -webkit-sticky;
    position: sticky;
    z-index: 1;
    top: 0;
}

/*
custom color
*/

.bg-gray-dark {
    background-color: #0f1930;
}

/* .sidebar .nav-item .nav-link {
    font-size: 2rem;
} */

.sidebar .nav-item .nav-link span {
    font-size: 1rem;
}

.select2-selection__choice {
    background-color: #0f1930 !important;
    color: white !important;
}


.sidebar-dark .nav-item.active .nav-link {
    color: #000000;
}

.sidebar-dark .nav-item.active .nav-link i {
    color: #000000;
}

.sidebar-dark .nav-item .nav-link:active i, .sidebar-dark .nav-item .nav-link:focus i, .sidebar-dark .nav-item .nav-link:hover i {
    color: #000000;
}

.sidebar-dark .nav-item .nav-link:active, .sidebar-dark .nav-item .nav-link:focus, .sidebar-dark .nav-item .nav-link:hover {
    color: #000000;
}

.sidebar-dark .nav-item .nav-link {
    color: #000000;
}

.sidebar-dark .nav-item .nav-link i {
    color: #000000;
}

.sidebar-dark .nav-item .nav-link[data-toggle=collapse]::after {
    color: #000000;
}

.sidebar-dark #sidebarToggle::after {
    color: #000000;
}

.sidebar-dark.toggled #sidebarToggle::after {
    color: #000000;
}

.border-1 {
    border-color: #d0d0d0;
}

.app-sidebar .main-sidebar-header {
    height: 4rem;
    width: 15rem;
    position: fixed;
    display: flex;
    background: var(--menu-bg);
    z-index: 9;
    align-items: center;
    justify-content: center;
    padding: .813rem 1.25rem;
    -webkit-border-end: 1px solid var(--menu-border-color);
    border-inline-end: 1px solid var(--menu-border-color);
    -webkit-border-after: 1px solid var(--menu-border-color);
    border-block-end: 1px solid var(--menu-border-color);
    transition: all 50ms ease;
}

.badge:hover {
    box-shadow: 0 0 15px 5px #0fd76a;
}

.badge {
    padding: 5px 10px;
    font-size: 10px;
    font-weight: bold;
    
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: box-shadow 0.3s ease-out;
    border: 1px solid #0fd76a;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.mt-2, .my-2 {
    margin-block-start: .5rem !important;
}

.gap-4 {
    gap: 1.5rem !important;
}
.align-items-stretch {
    align-items: stretch !important;
}
.justify-content-center {
    justify-content: center !important;
}
.hstack, .vstack {
    align-self: stretch;
    display: flex;
}
.hstack {
    align-items: center;
    flex-direction: row;
}


.btn-info-gradient {
    color: #fff;
    background: linear-gradient(to right, #0296ce 0%, #38c6f7 100%);
    border: 1px solid #29b9ec;
}