/* ---- Put validation errors UNDER each field ---- */

/* jQuery Validate uses <label class="error">…</label> */
label.error{
  display:block !important;
  margin:6px 0 0 0 !important;
  color:#b42318 !important;
  font-size:12px !important;
  font-weight:600 !important;
  line-height:1.25 !important;
  position:static !important;
  float:none !important;
  text-align:left !important;
  white-space:normal !important;
}

/* Your inputs are inside .input-group, which lays items inline.
   Make it wrap so the error label goes to the next line. */
.input-group{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:stretch !important;
}

/* Keep input taking full remaining width */
.input-group .form-control{
  flex:1 1 auto !important;
  min-width:0 !important;
}

/* Force the error label to be a full-width row under the input-group */
.input-group label.error{
  flex:0 0 100% !important;
  order:99 !important;
}