@import url('/js/lucide/lucide.css');

@font-face {
    font-family: "Outfit";
    src: url("/fonts/Outfit-VariableFont_wght.ttf");
}

html, body {
    height: 100vh;
    width: 100%;
    font-family: Outfit, serif;
}

.card-no-top-radius{
    border-top-left-radius:0px;
    border-top-right-radius:0px;
}
.card-no-bottom-radius{
    border-bottom-left-radius:0px;
    border-bottom-right-radius:0px;
}
.card-no-radius{
    border-radius:0px;
}

.border-bg-blue {
     border-color: #bce8f1 !important;
 }
.bg-bg-blue {
    background-color: #d9edf7 !important;
}
.text-bg-blue {
    color: #31708f !important;
}
.border-bottom-bg-light{
    border-bottom: 1px solid var(--blue-light);
}

.card-box-shadow{
    box-shadow: 0px 0px 5px #00000040;
}

.card-header-border {
    border-bottom: 1px solid var(--primary);
}
.card-no-border-bottom {
    border-bottom: none;
}
.card-no-bg{
    border-bottom: none;
}

.card-header {
    background: none;
}


.card-no-border .card-footer {
    background: none;
    border: none;
}

.card-blue {
    background-color: var(--blue-light);
}

.form-control, .card-body, .indicatif{
    color: var(--primary);
}

.input-group-text{
    font-size: 14px!important;
    background-color: var(--blue-light);
}
.input-group-prepend{
    height: calc(1.5em + 0.5rem + 2px);
}
.form-check-inline{
    padding-top: calc(0.375rem + 1px);
    padding-bottom: calc(0.375rem + 1px);
}
.font-size-14{
    font-size: 14px;
}

.text-orange, .text-orange:hover{
    color:#FFA722;
}

.input-group-prepend .btn {
    border-radius: var(--border-radius);
    border: 1px solid var(--blue);
}
.select2-container--default .select2-selection--multiple{
    border-radius: var(--border-radius)!important;
    color: var(--primary)!important;
    font-size: 14px!important;
    border: 1px solid var(--blue)!important;
}
.flex-1 {
    flex: 1;
}
.gap-1 {
    gap: 4px;
}
.gap-1-5 {
    gap: 6px;
}
.gap-2 {
    gap: 8px;
}
.gap-2-5 {
    gap: 12px;
}
.gap-3 {
    gap: 12px;
}
.gap-4 {
    gap: 16px;
}
.gap-5 {
    gap: 20px;
}

.font-4 {
    font-size: 16px;
}
.font-5 {
    font-size: 20px;
}
.font-6 {
    font-size: 24px;
}
.font-7 {
    font-size: 28px;
}
.font-8 {
    font-size: 32px;
}

.flex {
    display: flex;
}

.spin {
    animation: spin 1s linear infinite;
    display: block;
}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}

/********
COLORS
 */

.text-online .text-secretariat .text-practitioner {
    background-color: #495057 !important;
}
.bg-online {
    background-color: #d4f5e4 !important;
}
.bg-secretariat {
    background-color: #ddf5f6 !important;
}
.bg-practitioner {
    background-color: #f6f6dd !important;
}
.bg-appointment-missed {
    background-color: #f8d7da !important;
}
.text-appointment-missed {
    color: #721c24 !important;
}
.border-appointment-missed {
    border: 1px solid #f5c6cb !important;
}
.bg-appointment-reported {
    background-color: #ebf9e4 !important;
}
.text-appointment-reported {
    color: #52743f !important;
}
.border-appointment-reported {
    border: 1px solid #e4f6d9 !important;
}
.bg-appointment-excused {
    background-color: #fff3cd !important;
}
.text-appointment-excused {
    color: #856404 !important;
}
.border-appointment-excused {
    border: 1px solid #ffeeba !important;
}
.bg-appointment-not-excused {
    background-color: #efd8fa !important;
}
.text-appointment-not-excused {
    color: #7301a9 !important;
}
.border-appointment-not-excused {
    border: 1px solid #e9b9ff !important;
}
.bg-appointment-other {
    background-color: #d1ecf1 !important;
}
.text-appointment-other {
    color: #0c5460 !important;
}
.border-appointment-other {
    border: 1px solid #bee5eb !important;
}