/* Custom overrides on top of Tailwind. */

/* iOS Safari auto-zooms when focusing an input < 16px font-size.
   On phones, force 16px so fast entry doesn't keep zooming the page. */
@media (max-width: 767px) {
  input, select, textarea {
    font-size: 16px !important;
  }
}

[x-cloak] { display: none !important; }


/* Hide the spinner-arrows on number-shaped text inputs. */
input[inputmode="decimal"]::-webkit-outer-spin-button,
input[inputmode="decimal"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[inputmode="decimal"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

/* Server-side validation marks the failing input. */
[aria-invalid="true"] {
  border-color: rgb(225 29 72) !important; /* rose-600 */
}

/* Smooth HTMX swaps. */
.htmx-swapping {
  opacity: 0;
  transition: opacity 150ms ease;
}
.htmx-settling {
  opacity: 1;
  transition: opacity 150ms ease;
}