:root {
    --color-primary: #312b81;
}

.card-through {
    background-color: rgb(255 255 255 / 90%) !important;
}

.shadow {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
}

.shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

.hide {
    display: none !important;
}

.form-control:focus, select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--single, .select2-container--default.select2-container--open .select2-selection--multiple, .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgb(0 0 10 / 25%) !important;
}

.error {
    color: #F64E60 !important;
    font-size: 0.9rem !important;
    width: 100%;
    margin-top: 0.25rem;
}

.form-control.error {
    border: 1px solid #F64E60 !important;
}

.form-control.error:focus {
    box-shadow: 0 0 0 3px rgba(248, 184, 203, 0.25) !important;
}


.bg-green {
    background-color: var(--color-primary) !important;
}

.border-green {
    border-color: var(--color-primary) !important;
}

.text-green {
    color: var(--color-primary) !important;
}

.checkbox > input:checked ~ span {
    background-color: var(--color-primary) !important;
}

.form-control[readonly] {
    background-color: #f3f6f9 !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}