.form-control.invalid, .form-control:invalid {
    border-color: var(--bs-form-invalid-border-color) !important;
    padding-right: calc(1.5em + .75rem) !important;
    background-image: url('../icons/error.svg') !important;
    background-image: url('../icons/error.svg') !important;
    background-repeat: no-repeat !important;
    background-position: right calc(.375em + .1875rem) center !important;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem) !important;
}

.validation-message {
    width: 100%;
    margin-top: .25rem;
    font-size: .875em;
    color: #dc3545;
}

body {
    font-family: 'Inter', sans-serif;
}

.toast-body {
    white-space: pre-line !important;
}

footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #fff;
    z-index: 1;
}

header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background-color: #fff;
    z-index: 1;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.menu-item {
    padding: 8px 12px 8px 12px;
    border-radius: 6px;
    font-weight: 600;
    line-height: 24px;
    color: #172B35;
    text-decoration: none;
}

    .menu-item.active {
        background-color: #F1FAFA;
    }

    .menu-item .icon {
        width: 22px;
        height: 22px;
    }

.toast.bg-success {
    background-color: #F6FEF9 !important;
    border-color: #75E0A7 !important;
    color: #067647 !important;
}

    .toast.bg-success .btn-close {
        filter: brightness(0) saturate(100%) invert(32%) sepia(30%) saturate(1767%) hue-rotate(112deg) brightness(98%) contrast(95%) !important;
    }

.toast.bg-danger {
    background-color: #FFFBFA !important;
    border-color: #FDA29B !important;
    color: #B42318 !important;
}

    .toast.bg-danger .btn-close {
        filter: brightness(0) saturate(100%) invert(19%) sepia(71%) saturate(2716%) hue-rotate(348deg) brightness(93%) contrast(100%);
    }

.toast.bg-warning {
    background-color: #FFFCF5 !important;
    border-color: #FEC84B !important;
    color: #B54708 !important;
}

    .toast.bg-warning .btn-close {
        filter: brightness(0) saturate(100%) invert(24%) sepia(98%) saturate(1492%) hue-rotate(7deg) brightness(100%) contrast(94%);
    }

.toast.bg-info {
    background-color: #F8FFFF !important;
    border-color: #8CC9D4 !important;
    color: #2F5F6F !important;
}

    .toast.bg-info .btn-close {
        filter: brightness(0) saturate(100%) invert(35%) sepia(7%) saturate(3137%) hue-rotate(149deg) brightness(87%) contrast(84%);
    }

.form-check-input:checked {
    background-color: #347486;
    border-color: #347486;
}

input:focus,
input:focus-visible,
textarea:focus,
textarea:focus-visible {
    box-shadow: none !important;
    outline: none !important;
    border-color: #D0D5DD;
}

.width-fit-content {
    width: fit-content;
}

.width-max-content {
    width: max-content;
}

.flex-even {
    flex: 1;
}

.gradient-border {
    border-image: linear-gradient(to right, #A5CF48 0%, #70BB7A 16.67%, #46ACA2 33.33%, #36A7B2 50%, #329EA9 66.67%, #298793 83.33%, #1A6370 100%, #0A3C4A 100%) 1 0 0 0;
}

.offcanvas {
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    width: fit-content;
    z-index: 9999;
}

.offcanvas-header {
    padding: 24px 24px;
}

.modal-confirmation .btn-primary,
.modal-confirmation .btn-primary:focus,
.modal-confirmation .btn-primary:active,
.modal-confirmation .btn-primary:focus-visible {
    background: #347486 !important;
    border: 1px solid #347486 !important;
    padding: 10px 18px;
}

    .modal-confirmation .btn-primary:disabled,
    .modal-confirmation .btn-primary:hover {
        background: #347486 !important;
        border: 1px solid #347486 !important;
        opacity: 0.9;
    }

.modal-confirmation .btn-secondary,
.modal-confirmation .btn-secondary:focus,
.modal-confirmation .btn-secondary:active,
.modal-confirmation .btn-secondary:focus-visible {
    background: transparent !important;
    border: 1px solid #D0D5DD !important;
    color: #344054 !important;
    padding: 10px 18px;
}

    .modal-confirmation .btn-secondary:disabled,
    .modal-confirmation .btn-secondary:hover {
        background: #F2F4F7 !important;
        border: 1px solid #D0D5DD !important;
        opacity: 0.9;
        color: #344054 !important;
    }

.btn-custom-blue,
.btn-custom-blue:focus,
.btn-custom-blue:active,
.btn-custom-blue:focus-visible {
    background: #347486 !important;
    border: 1px solid #347486 !important;
    padding: 10px 18px;
}

    .btn-custom-blue:disabled,
    .btn-custom-blue:hover {
        background: #BBE0E6 !important;
        border: 1px solid #BBE0E6 !important;
        opacity: 0.9;
    }

.btn-custom-transparent,
.btn-custom-transparent:focus,
.btn-custom-transparent:active,
.btn-custom-transparent:focus-visible {
    background: transparent !important;
    border: 1px solid #D0D5DD !important;
    color: #344054 !important;
    padding: 10px 18px;
}

    .btn-custom-transparent:disabled,
    .btn-custom-transparent.disabled,
    .btn-custom-transparent:hover {
        background: #FFFFFF !important;
        border: 1px solid #EAECF0 !important;
        opacity: 0.9;
        color: #D0D5DD !important;
    }

.btn-custom-green,
.btn-custom-green:focus,
.btn-custom-green:active,
.btn-custom-green:focus-visible {
    background: #84AB37 !important;
    border: 1px solid #A2C655 !important;
    padding: 10px 18px;
}

    .btn-custom-green:disabled,
    .btn-custom-green:hover {
        background: #D8E9AD !important;
        border: 1px solid #D8E9AD !important;
        opacity: 0.9;
        color: #FFFFFF !important;
    }

.btn-custom-gray-dark,
.btn-custom-gray-dark:focus,
.btn-custom-gray-dark:active,
.btn-custom-gray-dark:focus-visible {
    background: #656565 !important;
    border: 1px solid #656565 !important;
    padding: 10px 18px;
}

    .btn-custom-gray-dark:disabled,
    .btn-custom-gray-dark:hover {
        background: #656565 !important;
        border: 1px solid #656565 !important;
        opacity: 0.9;
        color: #FFFFFF !important;
    }

.link {
    text-decoration: none;
}

    .link:hover,
    .link:focus,
    .link:active {
        text-decoration: none;
        opacity: 0.9;
    }


.gradient {
    padding: 64px 32px;
    background: linear-gradient(242deg, #A5CF48 0%, #70BB7A 20%, #46ACA2 40%, #36A7B2 50%, #329EA9 60%, #298793 70%, #1A6370 80%, #0A3C4A 100%), url('../images/watermark.svg') right no-repeat;
    background-size: 100% 100%, 30% 100%;
    background-blend-mode: overlay;
}

.progress {
    height: 8px;
}

.progress-info {
    margin-right: 40px;
}

.badge {
    padding: 2px 8px;
    line-height: 18px;
}

.disabled {
    pointer-events: none;
    opacity: 0.5;
    cursor: not-allowed;
}

.modal {
    z-index: 9999 !important;
}

.min-width-300 {
    min-width: 300px;
}