:root{
    --nav-background-colour: #011b34;
    --nav-link-colour: #d8d4ed;
    --header-color: #FFF;
    --body-font: 'Outfit', normal;
    --normal-font-size: 11px;

    --blue-color: #13b4ea;
    --dark-blue-color: #2f6f8d;
    --light-blue-color: #c3e2ff;
    --tint-blue-color: #e9f8fd;

    --purple-color: #9a16ee;
    --dark-purple-color: #56269a;
    --light-purple-color: #b897fd;
    --tint-purple-color: #f3e9fd;

    --red-color: #E75543;
    --dark-red-color: #943131;
    --light-red-color: #ffcdcd;
    --tint-red-color: #fde9e9;

    --green-color: #8CC15D;
    --dark-green-color: #2e7a21;
    --light-green-color: #ccffac;
    --tint-green-color: #edfde9;

    --yellow-color: #F5B952;
    --dark-yellow-color: #a4981e;
    --light-yellow-color: #fff0a0;
    --tint-yellow-color: #fdfce9;


}

html{
    font-family: var(--body-font), sans-serif !important;
    font-size: var(--normal-font-size);
}
/*body {*/
/*    font-size: var(--normal-font-size) !important;*/
/*}*/

/*Datatables*/
.dataTables_wrapper .ui-toolbar,
.dataTables_wrapper table{
    box-shadow: none;
	font-size: 12px;
}

.dataTables_wrapper .ui-toolbar *{
    color: black;
}
table.dataTable thead th,
table.dataTable thead td,
table.dataTable.no-footer{
    border: none;
}
table tbody tr,
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd {
    background-color: #fff;
}
table,
table.dataTable{
    color: #625e5e;
    border-radius: 20px !important;
    box-shadow: rgb(0 0 0 / 4%) 0px 3px 5px;
    margin-bottom: 0px !important;
    background-color: #f1f1f1;
}
.dataTables_wrapper .fg-toolbar.fg-foot{
    background-color: #f1f1f1;
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
}
.dataTables_filter input,
.advancedSearchBox input{
    color: #656565;
    background-color: #fff;
    border-radius: 10px;
    padding: 0px 5px 0 5px;
    border: 1px solid #ced4da;
}
table.inner_table{
    box-shadow: none;
}
table.inner_table tbody tr{
    background-color: white;
}
.addUPNsContainer,
.SMaRTSyncSettingsContainer{
    border-radius: 20px !important;
    background-color: #f1f1f1;
}
.addUPNsContainer table.inner_table tbody tr td.first-col,
.addUPNsContainer table.inner_table tbody tr td.second-col,
.addUPNsContainer table.inner_table thead,
.SMaRTSyncSettingsTable table.inner_table thead{
    background-color: #f1f1f1 !important;
}
/*types*/
a{
    text-decoration: none;
}
/*h4, .h4{*/
/*    font-size: 1.1rem;*/
/*}*/
/*h3, .h3{*/
/*    font-size: 1.2rem;*/
/*}*/
/*h2, .h2{*/
/*    font-size: 1.4rem;*/
/*}*/
/*h1, .h1{*/
/*    font-size: 1.6rem;*/
/*}*/

.jumbotron{
    box-shadow: rgb(0 0 0 / 4%) 0px 3px 5px !important;
}
.btn, .dt-button{
    font-size: 1rem !important;
    border: 1px solid black;
    box-shadow: none !important;
}


.keyword {
    font-size: 15px !important;
}

.btn.bg-primary, .dt-button{
    color: white;
    background-color: var(--blue-color) !important;
    border-color: var(--blue-color) !important;
}
.btn.bg-primary:hover,
.btn.bg-primary:focus{
    color: var(--blue-color) !important;
    background-color: var(--tint-blue-color) !important;
}

.btn.btn-primary,
.btn-primary, .ui-dialog-buttonset button, .dt-button {
    color: var(--blue-color);
    background-color: var(--tint-blue-color) !important;
    border-color: var(--blue-color) !important;
}


.btn.bg-primary:hover,
.btn.bg-primary:focus,
.btn-primary:hover,
.btn-primary:focus, 
.btn-primary.active,
.ui-dialog-buttonset button:hover,
.ui-dialog-buttonset button:focus
{
    color: var(--tint-blue-color);
    background-color: var(--blue-color) !important;
}

.ui-dialog-buttonset button {
    color: var(--blue-color) !important;
    background-color: var(--tint-blue-color) !important;
    border-color: var(--blue-color) !important;
    border: 1px solid !important;
    box-shadow: none !important;
}

.ui-dialog-buttonset button:hover,
.ui-dialog-buttonset button:focus
{
    color: var(--tint-blue-color) !important;
    background-color: var(--blue-color) !important;
}

.btn.disabled, .btn:disabled, fieldset:disabled .btn {
    color: #5e5e5e;
    pointer-events: none;
    background-color: #e1e1e1 !important;
    border-color: #7e7e7e;
    opacity: var(--bs-btn-disabled-opacity);
}

.btn.btn-info{
    color: var(--purple-color) !important;
    background-color: var(--tint-purple-color) !important;
    border-color: var(--purple-color) !important;
}
.btn.btn-info:hover,
.btn.btn-info:focus{
    color: var(--tint-purple-color) !important;
    background-color: var(--purple-color) !important;
}
.btn.btn-danger,
.btn.bg-red {
    color: var(--red-color) !important;
    background-color: var(--tint-red-color) !important;
    border-color: var(--red-color) !important;
}
.btn.btn-danger:hover,
.btn.btn-danger:focus,
.btn.bg-red:hover,
.btn.bg-red:focus {
    color: var(--tint-red-color) !important;
    background-color: var(--red-color) !important;
}
.btn.btn-success,
.btn.bg-green {
    color: var(--green-color) !important;
    background-color: var(--tint-green-color) !important;
    border-color: var(--green-color);
}
.btn.btn-success:hover,
.btn.btn-success:focus,
.btn.bg-green:hover,
.btn.bg-green:focus {
    color: var(--tint-green-color) !important;
    background-color: var(--green-color) !important;
}
.btn.btn-warning,
.btn.bg-yellow {
    color: var(--yellow-color) !important;
    background-color:var(--tint-yellow-color) !important;
    border-color: var(--yellow-color);
}
.btn.btn-warning:hover,
.btn.btn-warning:focus,
.btn.bg-yellow:hover,
.btn.bg-yellow:focus {
    color: var(--tint-yellow-color) !important;
    background-color: var(--yellow-color) !important;
}
.btn:hover,
.btn:focus{
    border-color: transparent;
}

.bg-grey{
    background-color: #eee;
    color: white;
}
.bg-primary{
    background-color: var(--blue-color);
    color: white;
}
.bg-blue{
    background-color: var(--blue-color) !important;
    color: white;
}
.bg-green{
    background-color: var(--light-green-color) !important;
    color: var(--dark-green-color);
}

.bg-yellow {
    background-color: var(--light-yellow-color) !important;
    color: #bd8419 !important;
}

.bg-red{
    background-color: var(--red-color) !important;
    color: white;
}
.bg-red a, .bg-yellow a, .bg-blue a {
    color: rgba(255, 255, 255, 0.84);
}

#reportPreviewTable thead{
	background-color:unset !important;
	color: unset !important;
}

/*.reminder_option_letter.btn-primary.reminder_trigger,*/
/*.letter-resend.btn-primary.reminder_trigger{*/
/*    color: white !important;*/
/*}*/
/*.letter-resend {*/
/*    background-color: var(--red-color) !important ;*/
/*    border-color: var(--red-color) !important;*/
/*}*/
/*.reminder_option_letter{*/
/*    background-color: var(--blue-color) !important ;*/
/*    border-color: var(--blue-color) !important;*/
/*}*/
.module{
    /*padding:1rem;*/
    background:#fff;
    border-radius:20px;
    border:0;
    box-shadow: rgb(0 0 0 / 4%) 0px 3px 5px !important;
}
.module > img{
	border-radius: 20px 20px 20px 20px;
	padding: 10px;
}

.rpt_con_head_background:not(.bg-grey) {
    border-radius: 10px 10px 0px 0px;
}
.rpt_con_head_background:not(.bg-green) {
    border-radius: 10px;
}


a {
    color: #3e3e3e;
    text-decoration: none;
}

.ui-dialog .ui-dialog-content {
    border-radius: 0 0 10px 10px;
}

.ui-dialog .ui-dialog-buttonpane {
    border-radius: 10px;
    padding: 0.3em;
}


.jQUI .ui-widget-header {
    border: 0px solid #008bdb;
    background: #008bdb;
    color: #fff;
    font-weight: normal;
    border-radius: 10px 10px 0 0px;
}

.ui-dialog-content, .ui-widget-content {
    background-color: unset;
}

.ui-dialog .ui-dialog-titlebar {
    padding: 0.3em 0.5em;
    position: relative;
}

.module > div{
    padding: 1rem;
}

.rpt_input {
	padding: 0.4rem;
    border-radius: 10px;
    color: #656565 !important;
    background-color: #eff2f7 !important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    width: auto;
    border: 1px solid #ced4da4d;
}

.librecheckboxes {
    font-size: 13px;
}

.module-header.bg-green,
.module-header.bg-yellow,
.module-header.bg-red,
.module-header.bg-primary{
    color: black;
    background: none !important;
}
.module .bg-green .text-white,
.module .bg-yellow .text-white,
.module .bg-red .text-white,
.module .bg-primary .text-white{
    color: var(--black-color) !important;
}
.module-header {
    border-radius: 20px 20px 0 0;
    background-color: #ffffff !important;
    color: #505050 !important;
    font-weight: 300;
}

.module .module-header {
    padding: 0.5rem;
    font-size: 1.4rem;
}
.module-stats{
    font-size: 1rem;
    padding: .5rem;
    background-color: white !important;
}
.module-stats h1{
    padding-block: 2rem;
    font-size: 2rem;
    border-radius: 15px;
}
.module-stats.bg-blue, .module-stats.bg-red,
.module-stats.bg-green, .module-stats.bg-yellow,
.module-stats.bg-blue:hover, .module-stats.bg-red:hover,
.module-stats.bg-green:hover, .module-stats.bg-yellow:hover,
.module-stats.bg-blue:focus, .module-stats.bg-red:focus,
.module-stats.bg-green:focus, .module-stats.bg-yellow:focus{
    background-color: white !important;
}
.module-stats.bg-blue h1{
    background-color: var(--light-blue-color);
    color: var(--dark-blue-color);
}
.module-stats.bg-blue h1:hover{
    background-color: var(--blue-color);
    color: var(--tint-blue-color);
}
.module-stats.bg-red h1{
    background-color: var(--light-red-color);
    color: var(--dark-red-color);
}
.module-stats.bg-red h1:hover{
    background-color: var(--red-color);
    color: var(--tint-red-color);
}
.module-stats.bg-green h1{
    background-color: var(--light-green-color);
    color: var(--dark-green-color);
}
.module-stats.bg-green h1:hover{
    background-color: var(--green-color);
    color: var(--tint-green-color);
}
.module-stats.bg-yellow h1{
    background-color: var(--light-yellow-color);
    color: var(--dark-yellow-color);
}
.module-stats.bg-yellow h1:hover{
    background-color: var(--yellow-color);
    color: var(--tint-yellow-color);
}
.module-stats.bg-purple h1{
    background-color: var(--light-purple-color);
    color: var(--dark-purple-color);
}
.module-stats.bg-purple h1:hover{
    background-color: var(--purple-color);
    color: var(--tint-purple-color);
}
.module-stats .text-center{
    color: black !important;
}

.module .module-header .text-white{
    color: black;
}

.module.text-settings > .col{
    /*padding: 0px;*/
}

.dropdown:hover .dropbtn{
    background-color: white;
}
.dropdown-content{
    background-color: rgba(255, 255, 255, 0.9);
}
.dropdown-content a{
    color: black;
}

.brighttheme-icon-notice {
    color: #033600 !important;
}

/*LibreSelect*/
.libre-select{
    background-color: transparent !important;
    font-family: var(--body-font), sans-serif !important;
    font-size: 15px;
}
.libre-select .select-items div{
    color: #656565 !important;
    font-family: var(--body-font), sans-serif !important;
    font-size: 15px;
}
.libre-select .select-items{
    background-color: #eff2f7 !important;
    border: #a1a1a1 solid 1px;
	border-radius: 11px;
}
select,
.libre-select .select-selected{
    padding: .4rem;
    border-radius: 10px;
    color: #656565 !important;
    background-color: #eff2f7 !important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    width: auto;
    border: 1px solid #ced4da4d;
}

select option:disabled{
    color: #c5c5c5;
}

button.btn{
    padding-block: 0px;
}

/*DataTables*/
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button{
    color: black !important;
}

.ui-datepicker.ui-datepicker-multi{
    width: auto !important;
}
.ui-datepicker-multi{
    font-size: 1.1rem !important;
}
.ui-datepicker-calendar td {
    background-color: var(--nav-link-colour) !important;
}
.ui-datepicker-calendar .ui-state-highlight > a.ui-state-default{
    background-color: var(--nav-background-colour) !important;
}
.ui-datepicker-calendar .ui-state-highlight > a.ui-state-default.bg-red{
    background-color: var(--red-color) !important;
}
.ui-datepicker-calendar .ui-datepicker-today{
    background-color: #91baff !important;
}

.preview_voice{
    background-color: var(--blue-color) !important;
}
.preview_voice:hover,
.preview_voice:focus {
    background-color: var(--dark-blue-color) !important;
}
.option-to-feature{
    filter: none !important;
}

.alert-success{
    background-color: #d4edda !important;
}

.alert-warning{
    background-color: #fff3cd !important;
}