/* El span de validacion se renderiza siempre; vacio sigue siendo un flex item
   de .field y sumaria el gap de la columna. */
.field .field-validation-valid {
  display: none;
}

/* Puente entre las clases que emite jquery-validation-unobtrusive y los estilos
   de la maqueta. La maqueta muestra el error con `.field.invalid .field-error`,
   pero unobtrusive marca el input y el span, no el contenedor. */

.field .field-validation-error {
  display: block;
  margin-top: 2px;
  font-size: var(--text-xs);
  color: var(--status-pending);
}

.field .input-validation-error {
  border-color: var(--status-pending);
}

/* El resumen se renderiza siempre; sin errores queda vacio y no debe ocupar lugar. */
.validation-summary-valid {
  display: none;
}

.form-error ul {
  margin: 0;
  padding: 0;
  list-style: none;
}