body {
    /* font-family: 'Nunito', Arial, Helvetica, sans-serif !important; */
    height: 100vh;
    background-color: #22252A !important;
}

.dark-mode {
    background-color: #22252A !important;
}

.main-sidebar {
    background-color: #2D3035 !important;
}

.dark-mode .navbar {
    background-color: #22252A !important;
}

.logout::before {
    content: '';
}

.logout:hover {
    transition: 0.3s ease-in-out;
}

.logout:hover::before {
    content: 'Sign out';
}

.logout p {
    /* background-color: #2D3035 !important; */
    content-visibility: none;
}

.logout:hover {
    background-color: #4d525b !important;
    color: white !important;
    cursor: pointer;
    font-size: 14px !important
}

.dark-mode .content-wrapper {
    background-color: #22252A !important;
}

.dark-mode .sidebar {
    background-color: #2D3035 !important;
    padding: 0px !important
}

.layout-navbar-fixed .wrapper .sidebar-dark-primary .brand-link:not([class*=navbar]) {
    background-color: #2D3035 !important;
    color: white !important;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 20px !important;
    /* font-weight: bold !important; */
}

.brand-link:hover {
    background-color: #42454A !important;
}

.brand-text {
    margin-top: 20px !important;
}

.username {
    color: #fff !important;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 15px !important;
    font-weight: bold !important;
}

.username:hover {
    /* background-color: #42454A !important; */
    border-radius: 3px !important;
    border: 1px solid transparent !important;
    color: #08CC99 !important;
}

.dark-mode .nav-link {
    color: #cdd2dc !important;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 15px !important;
}

.dark-mode .nav-item {
    color: #cdd2dc !important;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
}

[class*=sidebar-dark-] .nav-sidebar>.nav-item.menu-open>.nav-link,
[class*=sidebar-dark-] .nav-sidebar>.nav-item:hover>.nav-link,
[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link:focus {
    background-color: #3a3e44 !important;
    width: 222px !important;
}

.sidebar-mini .main-sidebar .nav-child-indent .nav-treeview .nav-link,
.sidebar-mini-md .main-sidebar .nav-child-indent .nav-treeview .nav-link,
.sidebar-mini-xs .main-sidebar .nav-child-indent .nav-treeview .nav-link {
    width: 205px !important;
}

[class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link.active {
    background-color: transparent !important;
    border-right: 3px solid #08CC99 !important;
    border-radius: 0px !important;
    color: #08CC99 !important;
}

[class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link.active::before {
    background-color: transparent !important;
    border-right: 3px solid #08CC99 !important;
    border-radius: 0px !important;
}

.info a--:hover {
    color: #cdd2dc !important;
}

.bg-accent1 {
    background-color: #2D3035;
}

.text-accent1 {
    color: white;
}

.text-accent2 {
    color: #cdd2dc !important;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
}

.border-accent1-t {
    border-top: 2px solid #08CC99 !important;
}

.border-accent1-b {
    border-bottom: 2px solid #08CC99 !important;
}

.border-accent1-l {
    border-left: 2px solid #08CC99 !important;
}

.border-accent1-r {
    border-right: 2px solid #08CC99 !important;
}

.border-accent2-t {
    border-top: 2px solid #FFC12B !important;
}

.border-radius0 {
    border-radius: 0px !important;
}

.border-radius1 {
    border-radius: 1px !important;
}

.border-radius2 {
    border-radius: 2px !important;
}

.border-radius3 {
    border-radius: 3px !important;
}

.card-ribbon {
    /* border-radius: 0px !important; */
    font-size: 18px !important;
    border-bottom: 0px !important;
}

.input-wrapper {
    position: relative;
}

.input-wrapper label {
    position: absolute;
    color: #cdd2dc;
    font-size: 12px;
    top: -10px;
    z-index: 1;
    left: 0.5em;
    background-color: #343A40 !important;
    padding: 0 5px;
}

.input-wrapper input {
    background-color: #343A40 !important;
    font-size: 14px !important;
    color: white;
    border: 1px solid #7b7b7b;
}

.input-wrapper input::placeholder {
    color: #9e9e9e;
}

.input-wrapper input:hover {
    border: 1px solid #a4a4a4;
}

.input-wrapper input:disabled {
    border: 1px solid #4e565e;
    background-color: #2f2f30 !important;
    font-size: 14px !important;
    cursor: not-allowed;
}

.select-wrapper {
    background-color: #343A40 !important;
    font-size: 14px !important;
}

.select-wrapper:hover {
    border-color: #a4a4a4 !important;
    font-size: 14px !important;
}

.select-wrapper:disabled {
    background-color: #2f2f30 !important;
    font-size: 14px !important;
    cursor: not-allowed
}

.btn-accent2 {
    background-color: #285f9a;
    color: #d9dfeb
}

.btn-accent1 {
    background-color: #08CC99 !important;
    color: #323232 !important;
}

.btn-accent1:hover {
    background-color: #069770 !important;
    color: #e4e4e4 !important;
}

.btn-accent1:focus {
    background-color: #069770 !important;
    color: #e4e4e4 !important;
}

.btn-accent1:disabled {
    background-color: #235182;
    color: #575757;
    cursor: not-allowed
}

.table-accent1 {
    background-color: transparent !important;
}

.table-accent1-head {
    font-size: 0.9em !important;
    letter-spacing: 0.5px;
    background-color: transparent !important;
    border-top: 1px solid #5e5e5e !important;
    border-bottom: 2px solid #5e5e5e;
    color: #d9dfeb !important;
}

.table-accent1 select {
    background-color: transparent;
    color: #cdd2dc !important;
    border: 1px solid #4e565e;
    font-size: 15px !important;
    padding: 2px 10px !important;
    border-radius: 3px;
}

.table-accent1 select:hover {
    border-color: #a4a4a4 !important;
}

.table-accent1 input[type=number] {
    width: 50px !important;
    padding: 0px 0px 1px 8px !important;
}

.table-accent1 p {
    font-size: 14.5px !important;
    color: #cdd2dc;
}

.table-accent1 input {
    background-color: transparent;
    color: #cdd2dc;
    border: 1px solid #4e565e;
    font-size: 14.5px !important;
    padding: 2px 10px !important;
    border-radius: 3px;
}

.table-accent1 input:hover {
    border-color: #b5bac4 !important;
    transition: 0.1s ease-out;
}

.table-accent1 input:disabled:hover {
    /* background-color: #2D3035 !important; */
    border: none !important;
}

.table-accent1 input:focus {
    background-color: #424950 !important;
    color: #b5bac4;
    border: none !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    outline: none !important;
}

.table-accent1 tbody tr:hover {
    background-color: #2c3034;
}

.table-accent1 tr {
    height: 0.4rem !important;
    font-size: 1em !important;
}

.table-accent1 p {
    color: #d9dfeb;
}

.table-accent1 td {
    border-bottom: 1px solid #5e5e5e !important;
    padding: 5px 5px 3px 3px !important;
    font-size: 15px !important;
}

.table-accent1 .text-info {
    color: #2db8d4 !important;
}

.table-accent1 .order {
    /* background-color: #485058 !important; */
    color: #d9dfeb !important;
    border: none !important;
}

.order-icon {
    color: #a5a5a5 !important;
    margin-top: 14px !important;
}

.order-icon:hover {
    color: #b5b5b5 !important;
}

.reset-icon {
    color: #339fed !important;
    margin-top:10px;
}

.reset-icon:hover {
    color: #77c6ff !important;
}

.trash-icon {
    color: #fb6257 !important;
    margin-top:10px;
}

.trash-icon:hover {
    color: #d53333 !important;
}

.form-switch .form-check-input {
    background-color: gray !important;
}

.form-switch .form-check-input:checked {
    background-color: #0188e8 !important;
}

.select2-container--default .select2-selection--single {
    background-color: #2D3035 !important;
    border-color: #4e565e !important;
}

.table-accent1 th {
    border-top: #5e5e5e !important;
    border-bottom: #5e5e5e !important;
}

.table>:not(:last-child)>:last-child>* {
    border-bottom-color: #5e5e5e;
}

/* .form-select {
    background-color: transparent !important;
} */

.fa-lg {
    line-height: 1em;
    font-size: 1.25em !important;
}

.menu-dropdown-dark a:hover {
    color: #08CC99 !important;
}

.menu-dropdown-dark a:focus {
    color: #08CC99 !important;
}

.menu-dropdown-dark button:hover {
    color: #08CC99 !important;
}

.menu-dropdown-dark button:focus {
    color: #08CC99 !important;
}

@media screen and (height < 1080px) {
    .custom_grid_wrapper {
        height: 77vh !important;
    }

    .custom_grid {
        height: 66.5vh !important;
    }

    .custom_grid_table {
        height: 47vh !important;
    }
}

@media screen and (height >=1080px) {
    .custom_grid_wrapper {
        height: 78vh !important;
    }

    .custom_grid {
        height: 69.5vh !important;
    }

    .custom_grid_table {
        height: 54.1vh !important;
    }
}

@media screen and (height >=1440px) {
    .custom_grid_wrapper {
        height: 88vh !important;
    }

    .custom_grid {
        height: 83vh !important;
    }

    .custom_grid_table {
        height: 72.1vh !important;
    }
}

.menu-tree {
    background-color: #3A3E44 !important;
}

.custom_grid {
    height: 600px;
}

.custom_grid_wrapper {
    height: 700px;
}