/*
 * Public website: phone fixes. Kept apart from style.css / responsive.css, which are not changed.
 * Loaded last on the pages that need it (base.html for the home page, contact.html).
 */

/* 16px text in form fields, so phones don't zoom in when one is tapped */
@media (pointer: coarse), (max-width: 767.98px) {
  input.form-control,
  textarea.form-control,
  select.form-control,
  .form-select {
    font-size: 16px !important;
  }
}

@media (max-width: 767.98px) {
  /* Home page header: keep the logo off the screen edge. nav.html loads style.css again inside
     <body>, after this file, so "html body" is needed to outrank it. */
  html body .nav-wrapper .nav-container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* The ☰ menu button was 18-20px wide: a full 44px square to tap */
@media (max-width: 991.98px) {
  html body .menu-toggle-btn,
  html body .mobile-toggler a[data-target] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }
}
