global.css

/**
 * Prevents an unwanted focus outline from appearing around elements that might
 * still respond to pointer events.
 */

/* stylelint-disable-next-line a11y/no-outline-none */
[tabindex='-1']:focus {
  outline: none !important;
}

/**
 * Apply Firefox's default focus ring instead of sanitize.css's version as it is
 * more prominent.
 */

:-moz-focusring {
  outline: 5px auto Highlight;
}

/**
 * Remove the outline in cases where the UA determines via heuristics that the
 * focus should not be visible. This is mainly for ensuring that a focus
 * ring does not render for mouse pointers.
 *
 * @credit https://css-tricks.com/the-focus-visible-trick/
 */

/* stylelint-disable-next-line a11y/no-outline-none */
*:focus:not(:focus-visible) {
  outline: none;
}