/**
 * @license EUPL-1.2
 * Copyright (c) 2021 Gemeente Utrecht
 * Copyright (c) 2021 Robbert Broersma
 */

@mixin utrecht-focus-ring {
  /* - The browser default focus ring should apply when these CSS custom properties are not set.
   * - Make the `box-shadow` value available, so components that have their own `box-shadow`
   *   can combine it with the focus ring box shadow.
   */
  --_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
    var(--utrecht-focus-inverse-outline-color, transparent);

  box-shadow: var(--_utrecht-focus-ring-box-shadow);
  outline-color: var(--utrecht-focus-outline-color, revert);
  outline-offset: var(--utrecht-focus-outline-offset, revert);
  outline-style: var(--utrecht-focus-outline-style, revert);
  outline-width: var(--utrecht-focus-outline-width, revert);
}

/* stylelint-disable-next-line block-no-empty */
@mixin utrecht-focus {
}

@mixin utrecht-focus-visible {
  @include utrecht-focus-ring;
}

@mixin utrecht-focus-pseudo-classes {
  :focus {
    @include utrecht-focus;
  }
  :focus-visible {
    @include utrecht-focus-visible;
  }
}