/* mobile-fit.css - stops the page sliding sideways on phones and cutting off buttons. 30 Oct 2026 */
html, body { max-width: 100%; overflow-x: hidden; }
@supports (overflow: clip) {
  html, body { overflow-x: clip; }
}
img, video, canvas, svg { max-width: 100%; }
@media (max-width: 760px) {
  /* the top buttons (Staff view, Help, Face ID, Account, Log out) wrap onto a second line, centred, instead of running off the screen */
  .topbar-inner { flex-wrap: wrap; }
  .topbar-actions { flex-wrap: wrap; margin-left: 0; width: 100%; justify-content: center; row-gap: .4rem; }
  .topbar .btn-ghost { white-space: nowrap; }
  input, select, textarea { max-width: 100%; }
}