html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Password show/hide toggle, injected by site.js.
   Muted by default so it reads as an affordance rather than an action, and only takes on
   colour once the password is actually visible. */
.password-reveal {
  color: #6c757d;
  border-color: var(--bs-border-color);
}

.password-reveal:hover {
  color: #212529;
}

.password-reveal[aria-pressed="true"] {
  color: #0d6efd;
}

/* The validation message follows the input group rather than sitting inside it. */
.input-group + .text-danger {
  display: block;
}