/* Validation error styling - ensure red color is visible on all forms */
.text-danger {
    color: #dc3545 !important;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: block;
}

.field-validation-error {
    color: #dc3545 !important;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: block;
}

[data-valmsg-for] {
    color: #dc3545 !important;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: block;
}

/* Ensure validation error spans are visible */
span[data-valmsg-for].field-validation-error,
span[data-valmsg-for].text-danger,
span.field-validation-error,
span.text-danger[data-valmsg-for],
span.text-danger {
    display: block !important;
    color: #dc3545 !important;
    font-weight: 400;
}

/* Input field error state */
.input-field:invalid,
.form-control:invalid,
.input-field.is-invalid,
.form-control.is-invalid {
    border-color: #dc3545 !important;
}

.input-field:invalid:focus,
.form-control:invalid:focus,
.input-field.is-invalid:focus,
.form-control.is-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Ensure validation errors are always visible when they have content */
span.text-danger:not(:empty),
span.field-validation-error:not(:empty),
span[data-valmsg-for]:not(:empty) {
    display: block !important;
    color: #dc3545 !important;
}