/* print css */
:root {
    
      --menu-bg-color: #53C9A9; 
    --safran-bg-color: #BFEDE1;
    --safran-icon-action-color: #D32873;
    
    --safran-icon-common-color: #53C9A9;
    --safran-icon-menu-color: #F5F5F5;
    --safran-icon-page-color: #53C9A9;
}
.modal-body h5 {
    border-bottom: solid 1px;
    color: #34ABAC !important;
    padding: 3px;
}
/*h1 {
    border-bottom-color: #00a69c !important;
}*/
.card-header {
    /*  background: #dbf7ef !important;*/
    background: transparent;
    color: #00a69c;
    font-size: 1.4rem;
}
legend {
    border-color: #53C9A9 !important;
    color: #00a69c; /* #53C9A9*/
}
.page-link {
    color: black !important;
}
.page-item.active .page-link {
    background-color: #BFEDE1 !important;
    border-color: #8BDFC9;
}
.safran-icon-page {
    color: var(--safran-icon-page-color);
    
}
.navbar-text {
    color: #53C9A9 !important;
}
hr {
    border-top-color: #53C9A9 !important;
    margin-top: 0 !important;
}
.card-info.card-outline {
    border-top: 2px solid #53C9A9 !important;
}
.btnAdd:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f067";
    color: var(--safran-icon-action-color);
    padding-left: 5px;
    position: relative;
}
.btn-outline-dark {
    border-color: teal;
}
/*
    select2 dropdown
*/
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    /*background-color: #8BDFC9 !important;*/
    background-color: var(--safran-bg-color) !important;
    color: #363636 !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    border: none !important;
}
.select2-selection__choice__remove {
    color: var(--safran-icon-action-color) !important;
}
/* from safran theme */
.bg-dark {
    background: #22242a;
    border-bottom: 1px solid #393d46;
}
#sidebar {
    background: #575654;
}
.tablist {
    background-color: #F5F5F5 !important;
    color: black !important;
    margin-bottom: 11px;
    /*border: 1px solid #42445d !important;*/
}
.nav-tabs li a {
    display: block;
    text-decoration: none;
    color: #575654;
    /*padding: 5px !important;*/
    /*font-weight: bold;*/
    background-color: #BFEDE1;
}
.nav-tabs .nav-link.active {
    background-color: #53C9A9;
}
.nav-tabs a:hover {
    background-color: #53C9A9;
}
#sidebar ul li a:hover {
    text-decoration: none;
    /*color: white;*/
    background-color: #00A69C;
    padding-left: 5px;
}
#sidebar ul li a.active {
    background-color: #00A69C;
    color: white !important;
    padding-left: 5px;
}
.safran-sub-menu {
    color: #363636;
}

.dropdown-menu a:hover {
    text-decoration: none;
    color: rgb(0, 0, 0);
    background-color: var(--safran-bg-color) !important;
}
.dropdown-item.active, .dropdown-item:active {
    color: white;
    background-color: #4ecdc4 !important;
}
.nav-item {
    background-color: black;
    padding: 5px;
}

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

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

.nav-item a.active {
    background-color: var(--menu-bg-color);
    color: white !important;
}
.btnToggle {
    color: white;
    float: right;
}
.btnToggle:hover {
    color: #4ECDC4;
}
/*legend {
    border-bottom: solid 2px;
    border-color: #95C3D9;*/ /* #53C9A9
    color: #3084AB; /* #53C9A9*/
/*}*/
/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #BFEDE1;
    border-radius: 50%
}
/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
    background-color: #8BDFC9;
}
/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
    background-color: #53C9A9;
}
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: #53C9A9 !important;
    border-color: #b0f1c9 !important;
}
/* admin area */
.card-title {
    color: #34abac !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-bg-color);
}
.form-signin .btn:hover {
    background-color: var(--menu-bg-color);
}
.accordion .card .card-header {
    background: #dbf7ef !important;
}
.border-srm {
    border-color: teal;
}