// Mixins: Focus

@use '00-config/functions/gesso' as *;

@mixin focus(
  $color: gesso-color(ui, generic, focus),
  $width: 2px,
  $offset: 2px
) {
  outline: $width solid transparent;
  outline-offset: $offset;

  &:focus {
    outline-color: $color;
  }

  &:focus:not(:focus-visible) {
    outline-color: transparent;
  }
}
