/* Shared form chrome — linked by ALL THREE shells: templates/base.html
   (office), templates/floor_base.html (kiosk) and templates/admin/base_site.html
   (Django admin). Keep this file to cross-cutting input behaviour only; page
   layout stays in Tailwind utilities on the templates.

   Linking it in a shell is what makes it reach raw `<input type="number">`
   written straight into templates (~19 of them across shipping, production,
   inventory, ar, planning), which a widget-level change in forms.py cannot
   touch. */

/* Number inputs with a FRACTIONAL step: no spinner arrows.
   Qty and money fields carry step="0.0001" (4dp is the model precision) or
   step="0.01", so the browser's up/down arrows nudge by a ten-thousandth of a
   part — useless for a buyer entering "4", and an easy way to silently corrupt
   a line by a stray click or scroll. Those numbers get typed, never stepped.

   Scoped by [step*="."] on purpose. Integer inputs — the label "copies" boxes
   (min=1 max=20/100) and the qty-less shipping inputs — step by 1, where the
   spinner is genuinely useful, so they keep theirs. To kill spinners app-wide
   instead, drop the [step*="."] qualifier from both selectors below.

   Arrow KEYS and field validation are untouched. */
input[type="number"][step*="."]::-webkit-outer-spin-button,
input[type="number"][step*="."]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

input[type="number"][step*="."] {
  -moz-appearance: textfield; /* Firefox < 121 */
  appearance: textfield;
}

/* Two focus rings, drawn to different geometry, is what those small dark
   circles on the corners of a clicked input are.

   Tailwind's `focus:ring-*` paints its ring as a box-shadow that follows
   the element's own border-radius. Chrome ALSO paints its native
   `outline: -webkit-focus-ring-color auto 1px`, and `auto` is not a
   plain rounded rect — against a `rounded-sm` (2px) input the two
   curves diverge, and all that remains visible past the red ring is a
   dark arc at each corner. Text inputs always match :focus-visible per
   spec, so it shows on a plain mouse click, not just on tab.

   Suppressed ONLY for controls that bring their own ring — the class
   attribute literally contains the utility name, so this cannot fire on
   anything that has no replacement. The ~19 raw inputs written straight
   into templates (see the note at the top of this file) keep the UA
   outline, because for them it is the only focus indicator there is.
   Never widen this to a bare `input:focus`. */
input[class*="focus:ring-"]:focus,
textarea[class*="focus:ring-"]:focus,
select[class*="focus:ring-"]:focus {
  outline: none;
}