/**
 * Inline field validation styling for AJAX Webform wizards.
 * Mirrors Drupal core's inline_form_errors markup so both the JS
 * pre-validation and the server-side fallback look identical.
 */
.bfri-webform-inline-error {
  display: block;
  margin-top: 0.25rem;
  color: #c00;
  font-size: 0.875rem;
}

/**
 * webform_clientside_validation (jQuery Validate) renders its own
 * '<strong class="error form-item--error-message">' next to each field,
 * duplicating '.bfri-webform-inline-error' below. It also has a
 * label-caching bug that stacks multiple copies of that '<strong>' when a
 * field is revalidated repeatedly (e.g. via this module's own keyup/
 * keydown/focusin/focusout live validation). Since '.bfri-webform-inline-
 * error' already covers every field in the wizard, jQuery Validate's own
 * error markup is hidden here rather than displayed alongside/duplicated.
 */
form.webform-submission-form strong.form-item--error-message.error {
  display: none !important;
}

form.webform-submission-form .error,
form.webform-submission-form .bfri-invalid {
  border-color: #c00;
}

.bfri-webform-inline-error__date {
  color: #0a0;
  font-weight: bold;
}