/*
 * FormCraft mobile validation positioning fix
 * Keeps placeholder-style validation messages and required asterisks fully
 * inside the visible field area on small screens.
 */
@media (max-width: 600px) {
  /*
   * Core FormCraft uses line-height: 8px for .error. With larger responsive
   * form fonts this clips the glyphs vertically, so restore a real line box.
   */
  html .formcraft-css .fc-form.label-placeholder .form-element .error {
    top: 8px !important;
    right: 36px !important;
    bottom: auto !important;
    max-width: calc(100% - 58px);
    line-height: 1.2 !important;
    white-space: nowrap;
    overflow: visible !important;
    padding: 0 2px !important;
    box-sizing: border-box;
    z-index: 110 !important;
  }

  /* Keep FormCraft's placeholder-mode required star inside the field edge. */
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.address-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.datepicker-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.dropdown-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.email-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.oneLineText-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.textarea-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk- .form-element.is-required-true .field-cover.phone-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.address-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.datepicker-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.dropdown-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.email-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.oneLineText-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.textarea-cover::after,
  html .formcraft-css .fc-form.label-placeholder.remove-asterisk-false .form-element.is-required-true .field-cover.phone-cover::after {
    top: 8px !important;
    right: 8px !important;
    line-height: 1 !important;
    z-index: 111 !important;
  }

  /* Ensure the wrappers themselves do not clip the overlaid message/star. */
  html .formcraft-css .fc-form.label-placeholder .form-element,
  html .formcraft-css .fc-form.label-placeholder .form-element .form-element-html,
  html .formcraft-css .fc-form.label-placeholder .form-element .field-cover {
    overflow: visible !important;
  }
}
