/* Validação de formulários — estilo inspirado no Parsley.js */

.has-error > .dash-input,
.has-error > input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.has-error > select,
.has-error > textarea,
.has-error .dash-input.is-invalid,
.has-error .auth-input.is-invalid {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.22);
}

.has-error .select2-container--default .select2-selection--single,
.select2-container.is-invalid .select2-selection--single {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.22);
}

.dash-field-errors {
    list-style: none;
    margin: 0.4rem 0 0;
    padding: 0;
    font-size: 0.78rem;
    line-height: 1.35;
    animation: oc-field-error-in 0.16s ease-out;
}

.dash-field-error {
    color: #f87171;
}

[data-dash-theme="light"] .dash-field-error {
    color: #dc2626;
}

.auth-group .dash-field-errors {
    margin-top: 0.35rem;
}

.auth-group.has-error .auth-input {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.18);
}

@keyframes oc-field-error-in {
    from {
        opacity: 0;
        transform: translateY(-3px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}