/*
 * Fix grid row alignment when inline error messages are shown on AEM Adaptive Forms.
 *
 * AEM Forms always renders an empty errormessage div for every field.
 * The error text (margin-top: 10px + line-height: 21px) makes a field's cell
 * taller than an adjacent field that has no error. In a 2-column grid this
 * creates a visible gap below the error-free field before the next row starts.
 *
 * Give every errormessage div the same minimum height (1 line = 1.5em at
 * the theme's 14px font-size = 21px) so all field cells stay equal height.
 */
@media screen and (min-width: 768px) {
  .cmp-adaptiveform-dropdown__errormessage,
  .cmp-adaptiveform-textinput__errormessage,
  .cmp-adaptiveform-emailinput__errormessage,
  .cmp-adaptiveform-telephoneinput__errormessage,
  .cmp-adaptiveform-radiobutton__errormessage,
  .cmp-adaptiveform-checkbox__errormessage,
  .cmp-adaptiveform-checkboxgroup__errormessage,
  .cmp-adaptiveform-datepicker__errormessage,
  [class*="__errormessage"] {
    min-height: 1.5em !important;
    margin-top: 4px !important;
  }
}
