/* ── Input focus ring — the single app-wide treatment (v2.1 parity) ──
   One focus treatment for every form field: a 2px inset brand-blue ring on the
   field/container (v2.1's exact technique: box-shadow inset 0 0 0 2px primary).
   Cross-cutting shared file per §4 rule 2 (tokens.css/app.css untouched), same
   sanction as Accessibility.css; linked from both hosts.

   Do NOT add bespoke :focus rules per component — the ONLY named exception is
   the header search pill (.fc-nav-search, Nav.css), which keeps its own black
   focus border by design. Any further one-off needs explicit sign-off.

   Rule 1 — every MudBlazor outlined field, app-wide. The doubled trailing class
   bumps specificity to (0,5,0) so the ring outranks per-module resting-border
   rules (e.g. .fc-pmenu-drawer's box-shadow:none) while the error-state rules
   (longer compound selectors, e.g. Profile.css .rounded-textfield--error…)
   still win — an invalid field stays red, ring suppressed.
   Rule 2 — marker class for any styled container that wraps a real input
   (.fc-pay-input, .fc-native-select, …): add fc-focus-field to the wrapper.
   A bare, self-bordered input needs nothing extra. Resting border colour/width
   stay per module (SignIn grey, profile-edit black) — only the ring is shared. */
.mud-input.mud-input-outlined:focus-within .mud-input-outlined-border.mud-input-outlined-border {
  box-shadow: inset 0 0 0 2px var(--color-brand-primary) !important;
}
.fc-focus-field:focus-within {
  box-shadow: inset 0 0 0 2px var(--color-brand-primary);
}