// Focus ring mixin for keyboard accessibility
$focus-ring-color: #1890ff;
$focus-ring-width: 2px;
$focus-ring-offset: 2px;

@mixin focus-ring {
  &:focus {
    outline: none;
    box-shadow: 0 0 0 $focus-ring-offset $focus-ring-color;
  }
  &:focus-visible {
    outline: $focus-ring-width solid $focus-ring-color;
    outline-offset: $focus-ring-offset;
  }
}