//-----------------------------
// Link
//-----------------------------

@import '../../globals/scss/colors';
@import '../../globals/scss/vars';
@import '../../globals/scss/layout';
@import '../../globals/scss/typography';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/import-once';
@import '../../globals/scss/css--reset';

@include exports('link') {
  .#{$prefix}--link {
    @include reset;
    @include font-family;
    @include typescale('zeta');
    @include font-smoothing;
    font-weight: 600;
    color: $brand-01;
    text-decoration: underline;
    transition: $transition--base;

    &:visited {
      color: $brand-01;
    }

    &:active,
    &:hover,
    &:focus {
      color: $brand-02;
    }

    &:focus {
      @include focus-outline('border');
    }
  }
}