/* Global focus styling shared by the PHP shell and React islands.
   Goal: keyboard users get a consistent on-brand focus ring; pointer users do
   not get a ring on click. Requires tokens.css (loaded first) for --focus-*.
   Load this last so it wins (by source order) over legacy `outline: none`
   resets of equal specificity. Class-based component styles still override. */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[role='button']:focus-visible,
[role='link']:focus-visible,
[role='tab']:focus-visible,
[role='menuitem']:focus-visible,
[tabindex]:focus-visible {
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

/* Keep pointer focus quiet for elements whose legacy rules style :focus. */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
[role='button']:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible) {
  outline: none;
}