/* forms.css — form-control rules that must hold on every page.
   Linked from every <head> in the app, including the standalone ones (auth and
   the legal pages) that never load base.css.

   ── Why this file exists ──────────────────────────────────────────────────
   iOS Safari zooms the viewport when a form control is focused whose computed
   font-size is below 16px, and it does not zoom back out. Everything shifts,
   and the user has to pinch to recover.

   This had already been patched three times, once per component, at three
   different breakpoints (560px in base.css, 640px in media-modal.css and
   user_profile.css). That left every other field in the app — the message
   composer at 0.9rem, the login form at 14px, the admin selects at 11px — still
   zooming, and an iPhone in landscape (844px wide) missed all three patches
   anyway. One rule, keyed on the actual condition, replaces the game of
   whack-a-mole.

   Keyed on `pointer: coarse` rather than a width, because the zoom is a
   property of touch Safari and not of a narrow window: an iPhone triggers it in
   landscape too, and a narrow desktop window never triggers it at all. */

@media (pointer: coarse) {
    /* !important is deliberate. Component rules set font-size by class, which
       outranks an element selector, so without it every one of them would win
       and the zoom would come back. This is a platform constraint rather than a
       design choice — nothing should be able to opt out of it by accident.

       Only the controls that actually trigger the zoom are listed: checkboxes,
       radios, ranges, colour pickers, file pickers and buttons do not, and
       forcing 16px on them would change layout for no benefit. */
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    textarea,
    select {
        font-size: 16px !important;
    }
}