/* Form Validation Error State Standardization */

/* 1. Standard Inputs, Textareas, and Selects */
.form-control.is-invalid,
.form-select.is-invalid,
textarea.form-control.is-invalid {
    border-color: #E82646 !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 38, 70, 0.15) !important;
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
textarea.form-control.is-invalid:focus {
    border-color: #E82646 !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 38, 70, 0.25) !important;
}

/* 2. Select2 Containers (Single & Multiple Dropdowns) */
select.is-invalid + .select2-container .select2-selection,
select.is-invalid ~ .select2-container .select2-selection,
.select2-container.is-invalid .select2-selection {
    border-color: #E82646 !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 38, 70, 0.15) !important;
}

select.is-invalid + .select2-container.select2-container--focus .select2-selection,
select.is-invalid + .select2-container.select2-container--open .select2-selection,
.select2-container.is-invalid.select2-container--focus .select2-selection,
.select2-container.is-invalid.select2-container--open .select2-selection {
    border-color: #E82646 !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 38, 70, 0.25) !important;
}

/* 3. Input Icons & Date Pickers */
.input-icon .form-control.is-invalid {
    border-color: #E82646 !important;
}

.input-icon:has(.is-invalid) .input-icon-addon,
.input-icon .is-invalid ~ .input-icon-addon {
    color: #E82646 !important;
}

/* 4. Profile Photo & File Upload Containers */
.drag-upload-btn:has(input.is-invalid),
.profile-uploader.is-invalid .drag-upload-btn {
    border: 1px dashed #E82646 !important;
    background-color: rgba(232, 38, 70, 0.05) !important;
}

.avatar.frames.is-invalid,
.has-error .avatar.frames,
.avatar.frames:has(~ .profile-upload input.is-invalid) {
    border-color: #E82646 !important;
    color: #E82646 !important;
}

/* 5. Checkboxes and Radio Buttons & Groups */
.form-check-input.is-invalid {
    border-color: #E82646 !important;
}

.form-check-input.is-invalid:checked {
    background-color: #E82646 !important;
    border-color: #E82646 !important;
}

.form-check-input.is-invalid ~ .form-check-label,
.form-check.is-invalid .form-check-label,
.form-group.is-invalid .form-check-label {
    color: #E82646 !important;
}

.form-group.is-invalid .form-check-input {
    border-color: #E82646 !important;
}

/* 6. Invalid Feedback Visibility & Styling */
.invalid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #E82646 !important;
    font-weight: 500;
}

.is-invalid ~ .invalid-feedback,
.is-invalid + .invalid-feedback,
.select2-container.is-invalid ~ .invalid-feedback,
.form-group.is-invalid .invalid-feedback,
div:has(> .is-invalid) > .invalid-feedback {
    display: block !important;
}

/* ARIA focus highlight for screen reader user feedback */
[aria-invalid="true"]:focus,
.select2-container.is-invalid:focus-within {
    outline: 2px solid #E82646 !important;
    outline-offset: 1px !important;
}
