/* Two rules remain here because neither has a Tailwind utility equivalent — everything
   else in this project is expressed as Tailwind classes (see tailwind.config's
   theme.extend in each page for the custom keyframes/animations, and inline
   arbitrary-value utilities like shadow-[...] / pt-[env(...)] for one-off values). */

/* Chrome/Edge/Safari force their own yellow autofill background via UA styles that
   `background-color` utilities can't override; the inset box-shadow is the only
   reliable way to paint over it, and the huge transition delay stops the color from
   flashing back in when the field briefly loses the autofill state. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  -webkit-text-fill-color: #111827 !important;
  caret-color: #111827;
  transition: background-color 9999s ease-in-out 0s;
}

/* App-wide focus ring for every native form control/button/link, applied once here
   instead of a `focus-visible:` utility on each of the ~150 inputs/buttons across the
   app. `.focus-ring` opts non-native elements (e.g. a styled dropdown trigger) into the
   same treatment. */
input, textarea, select, button, a {
  outline: none;
}
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.focus-ring:focus-visible {
  box-shadow: 0 0 0 3px rgba(16, 129, 111, 0.35);
  border-color: #10816f !important;
}
button:focus-visible, a:focus-visible {
  box-shadow: 0 0 0 3px rgba(16, 129, 111, 0.35);
  border-radius: 0.5rem;
}