/* ============================================================================
   no-zoom.css — stop *accidental* zoom on phones/tablets while using the app.

   "Zooming in by accident during activities" is actually three distinct browser
   behaviours, each needing its own fix:

   1. Double-tap zoom — fires when a user taps controls quickly (scoring, picking
      list rows, etc.). Killed cross-platform by `touch-action: manipulation`,
      which also drops the legacy 300ms tap delay. It still permits one-finger
      panning, so scrolling is unaffected.

   2. iOS input-focus auto-zoom — Mobile Safari zooms the whole page in whenever
      a focused <input>/<textarea>/<select> has a font-size below 16px. Our body
      text is 15px (--fs-body in design-tokens.css), so every form field trips
      it. We bump form controls to 16px on touch devices only (`pointer: coarse`)
      so desktop density is left exactly as designed.

   3. Pinch zoom — suppressed by the viewport meta in App.razor on Android/Chrome,
      plus the tiny iOS gesture guard in js/zoom-prevention.js (Safari ignores the
      viewport's user-scalable=no, so it needs JS).
   ============================================================================ */

/* 1. Double-tap zoom — harmless on desktop (no double-tap gesture there). */
html {
    touch-action: manipulation;
}

/* 2. iOS focus auto-zoom: keep form controls at >= 16px on touch devices.
   Covers native controls and the Radzen inputs used across the admin/editor UI. */
@media (pointer: coarse) {
    input,
    textarea,
    select,
    .rz-textbox,
    .rz-textarea,
    .rz-inputtext,
    .rz-dropdown .rz-dropdown-label,
    .rz-spinner input,
    .rz-numeric input,
    .rz-datepicker input,
    .rz-autocomplete input {
        font-size: 16px;
    }
}
