@use './mixins' as *;
@use './colors' as *;

// react-bootstrap v2 emits Bootstrap 5 form markup (`.form-label`) while we
// still ship the Bootstrap 4 stylesheet (alexwine:bootstrap-4), which has no
// `.form-label`. Shim it until the Bootstrap 4 -> 5 CSS jump lands (tracked as
// debt in UPGRADE.md). v2's Form.Group is a plain div, so restore the old
// per-field bottom margin the removed `.form-group` used to give.
.form-label {
  display: block;
  margin-bottom: 0.5rem;
}

form {
  label,
  .control-label {
    display: block;
  }

  label.error {
    display: block;
    margin-top: 8px;
    font-size: 13px;
    font-weight: normal;
    color: $danger;
  }
}