/* CSS Document */
/* =====================================================
   STAPLE SPECTRUM DARK THEME
   MINIA ADMIN TEMPLATE
   ===================================================== */

/* PAGE */

body,
.main-content,
.page-content{
    background:#1f2937 !important;
}

/* SIDEBAR */

.vertical-menu{
    background:#111827 !important;
    border-right:1px solid #273449 !important;
    box-shadow:none !important;
    margin-top: -5px;
}

.navbar-brand-box{
    background:#111827 !important;
    border-bottom:1px solid #273449 !important;
    box-shadow: none;
    border-right: 0;
}

/* MENU TITLE */

.menu-title{
    color:#64748b !important;
}

/* MENU ITEMS */

#sidebar-menu ul li a{
    color:#cbd5e1 !important;
    border-radius:6px !important;
}

#sidebar-menu ul li a i{
    color:#94a3b8 !important;
}

#sidebar-menu ul li a:hover{
    background:#1e293b !important;
    color:#ffffff !important;
}

#sidebar-menu ul li a:hover i{
    color:#ffffff !important;
}

/* ACTIVE MENU */

#sidebar-menu ul li.mm-active > a{
    background:
    linear-gradient(
        135deg,
        #1f4fa3,
        #7b2cbf
    ) !important;

    color:#ffffff !important;

    box-shadow:
    0 4px 12px rgba(31,79,163,.30);
}

#sidebar-menu ul li.mm-active > a i{
    color:#ffffff !important;
}

/* TOPBAR */

#page-topbar{
    background:#111827 !important;
    border-bottom:1px solid #273449 !important;
    box-shadow:none !important;
}

/* HEADER ICONS */

.header-item{
    color:#cbd5e1 !important;
    height: 60px !important;
}

.header-item:hover{
    background:#1e293b !important;
}

.header-profile-user{
    border:2px solid #334155;
}

/* DROPDOWNS */

.dropdown-menu{
    background:#273449 !important;
    border:1px solid #334155 !important;
}

.dropdown-item{
    color:#cbd5e1 !important;
}

.dropdown-item:hover{
    background:#334155 !important;
    color:#ffffff !important;
}

/* CARDS */

.card{
    background:#273449 !important;

    border:1px solid #334155 !important;

    box-shadow:
        0 2px 8px rgba(0,0,0,.20) !important;
}

.card-header{
    background:#273449 !important;
    border-bottom:1px solid #334155 !important;
}

.card-title{
    color:#f8fafc !important;
}

/* TEXT */

h1,h2,h3,h4,h5,h6{
    color:#f8fafc !important;
}

p,
span,
label,
small{
    color:#cbd5e1;
}

/* TABLES */

.table{
    color:#e2e8f0 !important;
}

.table thead th{
    background:#1e293b !important;
    color:#94a3b8 !important;
    border-bottom:1px solid #334155 !important;
}

.table tbody td{
    border-color:#334155 !important;
}

.table tbody tr:hover{
    background:#334155 !important;
}

/* FORMS */

.form-control,
.form-select{
    background:#1e293b !important;
    border:1px solid #334155 !important;
    color:#f8fafc !important;
}

.form-control:focus,
.form-select:focus{
    background:#1e293b !important;
    color:#ffffff !important;

    border-color:#1f4fa3 !important;

    box-shadow:
    0 0 0 3px rgba(31,79,163,.25) !important;
}

/* PLACEHOLDER */

.form-control::placeholder{
    color:#64748b !important;
}

/* MODALS */

.modal-content{
    background:#273449 !important;
    border:1px solid #334155 !important;
}

.modal-header{
    border-bottom:1px solid #334155 !important;
}

.modal-footer{
    border-top:1px solid #334155 !important;
}

/* BUTTONS */

.btn-primary{
    background:#1f4fa3 !important;
    border-color:#1f4fa3 !important;
}

.btn-primary:hover{
    background:#18408a !important;
}

.btn-success{
    background:#16a34a !important;
}

.btn-danger{
    background:#dc2626 !important;
}

/* TABS */

.nav-tabs{
    border-bottom:1px solid #334155 !important;
}

.nav-tabs .nav-link{
    color:#cbd5e1 !important;
}

.nav-tabs .nav-link.active{
    background:#273449 !important;
    border-color:#334155 !important;
    color:#ffffff !important;
}

/* BREADCRUMB */

.breadcrumb-item,
.breadcrumb-item a{
    color:#94a3b8 !important;
}

/* FOOTER */

.footer{
    background:#111827 !important;
    border-top:1px solid #273449 !important;
    color:#94a3b8 !important;
}

/* SCROLLBAR */

::-webkit-scrollbar{
    width:8px;
}

::-webkit-scrollbar-track{
    background:#111827;
}

::-webkit-scrollbar-thumb{
    background:#475569;
    border-radius:10px;
}
/* =====================================================
   SELECT2 DARK THEME
   ===================================================== */

.select2-container{
    width:100% !important;
}

/* SINGLE SELECT */

.select2-container--default .select2-selection--single{
    height:36px !important;

    background:#1e293b !important;

    border:1px solid #334155 !important;

    border-radius:6px !important;

    color:#f8fafc !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
    color:#f8fafc !important;

    line-height:34px !important;

    padding-left:12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder{
    color:#94a3b8 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    height:34px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color:#94a3b8 transparent transparent transparent !important;
}

/* FOCUS */

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single{
    border-color:#1f4fa3 !important;

    box-shadow:
        0 0 0 3px rgba(31,79,163,.25) !important;
}

/* MULTI SELECT */

.select2-container--default .select2-selection--multiple{
    min-height:36px !important;

    background:#1e293b !important;

    border:1px solid #334155 !important;

    border-radius:6px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered{
    padding:2px 6px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice{
    background:
        linear-gradient(
            135deg,
            #1f4fa3,
            #7b2cbf
        ) !important;

    border:none !important;

    color:#fff !important;

    border-radius:4px !important;

    padding:2px 8px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
    color:#fff !important;
    margin-right:5px !important;
}

/* DROPDOWN */

.select2-dropdown{
    background:#273449 !important;

    border:1px solid #334155 !important;

    border-radius:6px !important;

    overflow:hidden;

    box-shadow:
        0 8px 20px rgba(0,0,0,.25) !important;
}

/* SEARCH */

.select2-search--dropdown{
    padding:8px !important;

    background:#273449 !important;
}

.select2-search--dropdown .select2-search__field{
    background:#1e293b !important;

    border:1px solid #334155 !important;

    border-radius:4px !important;

    color:#fff !important;
}

/* RESULTS */

.select2-results{
    background:#273449 !important;
}

.select2-results__option{
    color:#cbd5e1 !important;

    padding:8px 12px !important;

    font-size:13px !important;
}

.select2-results__option--highlighted{
    background:
        linear-gradient(
            135deg,
            #1f4fa3,
            #7b2cbf
        ) !important;

    color:#fff !important;
}

.select2-results__option[aria-selected="true"]{
    background:#334155 !important;

    color:#fff !important;
}

/* DISABLED */

.select2-container--default.select2-container--disabled .select2-selection--single,
.select2-container--default.select2-container--disabled .select2-selection--multiple{
    background:#334155 !important;

    color:#94a3b8 !important;
}

/* CLEAR BUTTON */

.select2-selection__clear{
    color:#94a3b8 !important;
}

/* TAG INPUT */

.select2-search__field{
    color:#fff !important;
}

/* BOOTSTRAP INPUT GROUP FIX */

.input-group .select2-container{
    flex:1 1 auto;
}

/* MODAL FIX */

.select2-container--open{
    z-index:99999 !important;
}
/* =====================================================
   SELECTIZE FIX FOR MINIA
   ===================================================== */

.selectize-control{
    width:100% !important;
    position:relative !important;
}

.selectize-input{
    min-height:38px !important;
    width:100% !important;

    background:#1e293b !important;
    border:1px solid #334155 !important;
    border-radius:6px !important;

    color:#fff !important;

    box-shadow:none !important;
}

.selectize-input.focus{
    border-color:#1f4fa3 !important;
    box-shadow:0 0 0 3px rgba(31,79,163,.25) !important;
}

/* important */

.selectize-dropdown{
    background:#273449 !important;
    border:1px solid #334155 !important;

    width:100% !important;

    overflow:visible !important;

    height:auto !important;

    max-height:none !important;
}

.selectize-dropdown-content{
    display:block !important;

    position:relative !important;

    overflow-y:auto !important;

    max-height:250px !important;
}

.selectize-dropdown .option,
.selectize-dropdown .create{
    display:block !important;

    position:relative !important;

    width:100% !important;

    box-sizing:border-box !important;
}
.selectize-dropdown .option{
    padding:10px 12px !important;
    color:#cbd5e1 !important;
}

.selectize-dropdown .active{
    background:#334155 !important;
    color:#fff !important;
}

.selectize-dropdown .create{
    background:linear-gradient(
        135deg,
        #1f4fa3,
        #7b2cbf
    ) !important;

    color:#fff !important;

    padding:10px 12px !important;
}
/* =====================================================
   COLLAPSED SIDEBAR
   ===================================================== */

body.vertical-collpsed .vertical-menu{
    background:#111827 !important;
}

body.vertical-collpsed #sidebar-menu ul li a{
    background:transparent !important;
}

body.vertical-collpsed #sidebar-menu ul li a:hover{
    background:#1e293b !important;
}

body.vertical-collpsed #sidebar-menu ul li.mm-active > a{
    background:
        linear-gradient(
            135deg,
            #1f4fa3,
            #7b2cbf
        ) !important;
}

/* popup submenu */

body.vertical-collpsed #sidebar-menu > ul > li:hover > a{
    background:#1e293b !important;

    color:#fff !important;
}

body.vertical-collpsed #sidebar-menu > ul > li:hover > a i{
    color:#fff !important;
}

body.vertical-collpsed #sidebar-menu ul li ul{
    background:#111827 !important;

    border:1px solid #273449 !important;

    box-shadow:
        0 10px 30px rgba(0,0,0,.30) !important;
}

/* submenu title */

body.vertical-collpsed #sidebar-menu ul li ul li a{
    color:#cbd5e1 !important;
}

body.vertical-collpsed #sidebar-menu ul li ul li a:hover{
    background:#1e293b !important;

    color:#fff !important;
}

/* submenu active */

body.vertical-collpsed #sidebar-menu ul li ul li.mm-active > a{
    color:#fff !important;

    background:
        linear-gradient(
            135deg,
            #1f4fa3,
            #7b2cbf
        ) !important;
}
/* Datepicker */

.flatpickr-calendar,
.ui-datepicker{
    background:#273449 !important;
    border-color:#334155 !important;
}

/* DataTables */

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select{
    background:#1e293b !important;
    border:1px solid #334155 !important;
    color:#fff !important;
}

/* SweetAlert */

.swal2-popup{
    background:#273449 !important;
    color:#fff !important;
}

/* Apex Charts */

.apexcharts-text{
    fill:#cbd5e1 !important;
}
/* =====================================================
   COLLAPSED SIDEBAR FLYOUT MENU
   ===================================================== */
body[data-sidebar-size=sm] .vertical-menu #sidebar-menu>ul>li:hover>ul{
    margin-top: -3px;
    width: 200px !important;
}
body[data-sidebar-size=sm] .vertical-menu #sidebar-menu>ul>li:hover>ul a{
    
}
body[data-sidebar-size=sm] .vertical-menu #sidebar-menu>ul>li:hover>ul,
body.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a{
    background:#111827 !important;
    color:#ffffff !important;
}

body.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i{
    color:#ffffff !important;
}

/* popup container */

body.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul{
    background:#111827 !important;

    border:1px solid #273449 !important;

    box-shadow:
        0 10px 30px rgba(0,0,0,.35) !important;
}

/* minia sometimes wraps submenu */

body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul{
    background:#111827 !important;
}

/* submenu items */

body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul li a{
    background:#111827 !important;

    color:#cbd5e1 !important;
}

/* hover */

body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul li a:hover{
    background:#1e293b !important;

    color:#ffffff !important;
}

/* active submenu */

body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul li.mm-active > a{
    background:
        linear-gradient(
            135deg,
            #1f4fa3,
            #7b2cbf
        ) !important;

    color:#ffffff !important;
}

/* submenu title */

body.vertical-collpsed .vertical-menu #sidebar-menu ul li:hover > .menu-title{
    background:#111827 !important;

    color:#ffffff !important;

    border-bottom:1px solid #273449 !important;
}