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

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

body {
  margin-bottom: 60px;
}

/* iOS PWA (installed, standalone mode): viewport-fit=cover lets the page draw
   under the status bar/notch for a proper edge-to-edge look, but the navbar
   then needs padding to not sit behind it. env() resolves to 0 on devices/
   browsers without a safe area (regular tabs, non-notch phones, desktop), so
   this is a no-op everywhere else. */
header {
  padding-top: env(safe-area-inset-top);
}

/* Solar's own typed-input colour (#073642) is too close to the light input
   fill to read comfortably — use a near-black instead, with a bit of extra
   weight, for everything actually typed into a field. */
.form-control, .form-select {
  color: #001318;
  font-weight: 500;
}

/* Solar's floating labels/placeholders default to a mid-grey that's nearly
   unreadable against the light input fill — reuse the same dark colour Solar
   already uses for typed input text so they stay legible. */
.form-floating > label {
  color: #073642;
  opacity: 0.85;
}

.form-control::placeholder {
  color: #073642;
  opacity: 0.6;
}

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

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