/* AeroJatim registration validation UX v132 */
.php-registration-form input.validation-control-empty:not([type="checkbox"]):not([type="radio"]),
.php-registration-form select.validation-control-empty,
.php-registration-form textarea.validation-control-empty {
  border-color: #e4bd36 !important;
  background: #fffceb !important;
  box-shadow: inset 0 0 0 1px rgba(228,189,54,.14) !important;
}
.php-registration-form input.validation-control-filled:not([type="checkbox"]):not([type="radio"]),
.php-registration-form select.validation-control-filled,
.php-registration-form textarea.validation-control-filled {
  border-color: #77bea0 !important;
  background: #f3fcf7 !important;
  box-shadow: inset 0 0 0 1px rgba(34,139,96,.08) !important;
}
.php-registration-form .validation-shell-empty.upload-box {
  border-color: #e4bd36 !important;
  background: #fffceb !important;
}
.php-registration-form .validation-shell-filled.upload-box {
  border-color: #77bea0 !important;
  background: #f3fcf7 !important;
}
.php-registration-form .validation-field-error,
.php-registration-form .validation-field-error input,
.php-registration-form .validation-field-error select,
.php-registration-form .validation-field-error textarea,
.php-registration-form input.validation-field-error,
.php-registration-form select.validation-field-error,
.php-registration-form textarea.validation-field-error {
  border-color: #e01f2f !important;
  box-shadow: 0 0 0 3px rgba(224,31,47,.15) !important;
}
.php-registration-form .validation-field-error {
  outline: 2px solid rgba(224,31,47,.85);
  outline-offset: 3px;
  border-radius: 12px;
}
.php-registration-form label.validation-field-error,
.php-registration-form .upload-box.validation-field-error {
  background: #fff5f6 !important;
}
.php-registration-form .validation-attention {
  animation: aeroValidationAttention .62s ease-in-out 2;
}
@keyframes aeroValidationAttention {
  0%,100% { transform: translateX(0); }
  20% { transform: translateX(-7px); }
  40% { transform: translateX(7px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(4px); }
}
@media (prefers-reduced-motion: reduce) {
  .php-registration-form .validation-attention { animation: none; }
}