@import './colors.scss';

@mixin visuallyHidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

$capHeight: 705;
$ascent: 1011;
$descent: -180;
$unitsPerEm: 1000;

// Utility to remove extra white space from top and bottom of text
@mixin basekick($fontSize, $lineHeight) {
  $capHeightScale: $capHeight / $unitsPerEm;
  $descenderHeightScale: abs($descent) / $unitsPerEm;
  $lineHeightScale: $lineHeight / $fontSize;
  $typeOffset: ($lineHeightScale - 1) / 2 + $descenderHeightScale;
  $typeCorrection: ($lineHeightScale - 1) + (1 - $capHeightScale);

  padding-top: 0.05px;
  transform: translateY(#{$typeOffset}em);

  &::before {
    content: '';
    display: block;
    height: 0;
    margin-top: #{-1 * $typeCorrection}em;
  }
}

@mixin basekickLineheightScale($lineHeightScale) {
  @include basekick(1, $lineHeightScale);
}

@mixin focusVisible {
  &[data-focus-visible-added]:focus {
    @content;
  }
}

@mixin focusOutline($borderRadius: null) {
  box-shadow: 0 0 0 1px chaser-color('Blue'), 0 0 0 5px rgba(chaser-color('Blue'), 0.3);

  @if $borderRadius != null {
    border-radius: #{$borderRadius}px;
  }
}

@mixin focusVisibleOutline($borderRadius: null) {
  @include focusVisible {
    @include focusOutline($borderRadius);
  }
}

@mixin IE {
  @media screen and (-ms-high-contrast: none) {
    @content;
  }
}