/* print css */
:root {
    --menu-bg-color: #276EDE;
    --safran-bg-color: #C9E8FD;
    --safran-icon-action-color: #276EDE;
    --safran-sidebar-bg-color: #333548;
    --safran-icon-common-color: #CD8DBE;
    --safran-icon-menu-color: #BBA0F3;

}
.dropdown-menu {
    background-color: #f7f8fa !important;
}
.top-menu a {
    color: black !important;
}
.modal-body h5 {
    border-bottom: solid 1px;
    color: #4682b4 !important;
    padding: 3px;
}

/*h1 {
    border-bottom-color: #42445D !important;
}*/
.card-header {
    background: #e6e9f0 !important;
    font-size: 18px;
}
.card-info.card-outline {
    border-top: 3px solid #865ce0 !important;

}
legend {
    border-color: #865ce0 !important;
    color: #865ce0; /* #53C9A9*/
}

.page-item.active .page-link {
    background-color: var(--menu-bg-color) !important;
    border-color: #42445d;
}
.safran-icon-page {
    color: #00CDBE;
}
.navbar-text {
    color: white !important;
}
hr {
    border-top-color: #42445D !important;
}


.top-menu a {
    color: white;
}
/* for top bar */
.nav-item {
    background-color: black;
    padding: 11px;
}
.nav-item {
    background-color: black;
    padding: 5px;
}

.nav-item a {
    padding: 5px;
    margin: 5px;
    color: white;
}

.nav-item a:hover {
    text-decoration: none !important;
    color: white;
    background-color: var(--menu-bg-color) !important;
}

/*.nav-item a.active {
    color: white !important;
}*/
.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--menu-bg-color) !important;

}

.nav-tabs li a {
    display: block;
    text-decoration: none !important;
    color: black !important;
    border: #865ce0 1px solid !important;
    /*padding: 5px !important;*/
    /*font-weight: bold;*/
    background-color: whitesmoke !important;
}

.nav-tabs .active {
    background-color: #363636 !important;
    color: white !important;
}

.nav-tabs a:hover {
    background-color: #333548 !important;
    color: white !important;
}
.nav-tabs-custom > .nav-tabs > li {
    background-color: #e6e9f0 !important;
}
.btnAdd:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f067";
    color: #276EDE;
    padding-left: 5px;
    position: relative;
}
.btn-outline-dark {
    border-color: #276ede;
}
    /*
    select2 dropdown
*/
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    /*background-color: #8BDFC9 !important;*/
    /*background-color: #01C3A7 !important;*/
    color: black !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
    /*border:none !important;*/
}
.select2-selection__choice__remove {
    color:red !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: solid red 1px !important;
    outline: 0;
}
/* from safran theme */
.bg-dark {
    background-color: #363636 !important;
    border-bottom: 1px solid #393d46;
}
#sidebar {
    /*background: #575654;*/
    background: var(--safran-sidebar-bg-color);
}
.tablist {
    background-color: #C9DCE4 !important;
    color: black !important;
    margin-bottom: 11px;
    /*border: 1px solid #42445d !important;*/
}

#sidebar ul li a:hover {
    text-decoration: none;
    color: white;
    background-color: var(--menu-bg-color);
    padding-left: 5px;
}
#sidebar ul li a.active {
    background-color: var(--menu-bg-color) !important;
    color: white !important;
    padding-left: 5px;
}
.safran-sub-menu {
    color: black;
}
.dropdown-menu {
    background-color: var(--safran-sidebar-bg-color);
}
.dropdown-menu a:hover {
    text-decoration: none;
    color: white;
    background-color: var(--menu-bg-color) !important;
    
}
.safran-toolbar a {
    color: black;
}
.safran-toolbar a:hover {
    color: var(--menu-bg-color) !important;
    background-color: white !important;
}
.btnToggle {
    color: #BBA0F3;
    float: right;
}
.btnToggle:hover {
    color: white !important;
}
/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: var(--safran-bg-color);
    border-radius: 50%
}
/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
background-color: var(--safran-icon-action-color);
}
/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
    background-color: var(--safran-icon-action-color);
} 
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--menu-bg-color) !important;
    border-color: var(--safran-bg-color) !important;
}
/* admin area */
.card-title {
    color: #42445D !important;
    font-size: 18px;
}
.form-signin .btn {
    font-size: 80%;
    border-radius: 3rem;
    letter-spacing: .1rem;
    font-weight: bold;
    padding: 1rem;
    transition: all 0.2s;
    background-color: var(--safran-icon-menu-color);
}
.form-signin .btn:hover {
    background-color: var(--safran-sidebar-bg-color);
    color: white;
}
.border-srm {
    border-color: #276ede;
}