html {
  font-size: 14px;
}

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

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

/* The ASP.NET project template's sticky footer was `position: absolute; bottom: 0`, and it needed
   `html { position: relative; min-height: 100% }` to anchor against plus `body { margin-bottom:
   60px }` to reserve room for. That .footer rule is long gone -- _Layout uses the flexbox approach
   instead (`body.d-flex.flex-column.min-vh-100` with `.container.flex-grow-1`), which needs neither.

   The two compensating rules outlived it and were actively harmful: min-vh-100 makes the body
   exactly one viewport tall, so an extra 60px of margin made EVERY page 60px taller than the window.
   Measured on the live login page at a 808px viewport: document 868px, vertical scrollbar present on
   a page whose content fits. The footer therefore sat below the fold with a dead band under it.
   Removing them takes the document back to 808px with the footer flush and no scrollbar.

   Do not reintroduce either rule without also reintroducing an absolutely positioned footer. */

.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;
}