@import "../variables";

@mixin font-default {
  font-size: $font-size-default;
  font-weight: $font-weight-default;
  font-family: $font-family-default;
  color: $font-color-default;
  line-height: $font-line-height-default;
  letter-spacing: $font-letter-spacing-default;
}

@mixin font-headline-link($color) {
  a {
    color: $color !important;
    text-decoration: none;

    &:hover, &:focus {
      color: $color !important;
    }
  }
}

@mixin font-headline {
  margin-top: 0;
}

@mixin font-headline-1 {
  @include font-headline();
  @include font-headline-link($font-color-headline-1);
  font-size: $font-size-headline-1;
  font-weight: $font-weight-headline-1;
  font-family: $font-family-headline-1;
  color: $font-color-headline-1;
  line-height: $font-line-height-headline-1;
  letter-spacing: $font-letter-spacing-headline-1;
}

@mixin font-headline-2 {
  @include font-headline();
  @include font-headline-link($font-color-headline-2);
  font-size: $font-size-headline-2;
  font-weight: $font-weight-headline-2;
  font-family: $font-family-headline-2;
  color: $font-color-headline-2;
  line-height: $font-line-height-headline-2;
  letter-spacing: $font-letter-spacing-headline-2;
}

@mixin font-headline-3 {
  @include font-headline();
  @include font-headline-link($font-color-headline-3);
  font-size: $font-size-headline-3;
  font-weight: $font-weight-headline-3;
  font-family: $font-family-headline-3;
  color: $font-color-headline-3;
  line-height: $font-line-height-headline-3;
  letter-spacing: $font-letter-spacing-headline-3;
}

@mixin font-headline-4 {
  @include font-headline();
  @include font-headline-link($font-color-headline-4);
  font-size: $font-size-headline-4;
  font-weight: $font-weight-headline-4;
  font-family: $font-family-headline-4;
  color: $font-color-headline-4;
  line-height: $font-line-height-headline-4;
  letter-spacing: $font-letter-spacing-headline-4;
}

@mixin font-headline-5 {
  @include font-headline();
  @include font-headline-link($font-color-headline-5);
  font-size: $font-size-headline-5;
  font-weight: $font-weight-headline-5;
  font-family: $font-family-headline-5;
  color: $font-color-headline-5;
  line-height: $font-line-height-headline-5;
  letter-spacing: $font-letter-spacing-headline-5;
}

@mixin font-headline-6 {
  @include font-headline();
  @include font-headline-link($font-color-headline-6);
  font-size: $font-size-headline-6;
  font-weight: $font-weight-headline-6;
  font-family: $font-family-headline-6;
  color: $font-color-headline-6;
  line-height: $font-line-height-headline-6;
  letter-spacing: $font-letter-spacing-headline-6;
}

@mixin font-error-code {
  font-size: $font-size-error-code;
  font-weight: $font-weight-error-code;
  font-family: $font-family-error-code;
  color: $font-color-error-code;
  line-height: $font-line-height-error-code;
  letter-spacing: $font-letter-spacing-error-code;
}

@mixin font-big-text {
  font-size: $font-size-big-text;
  font-weight: $font-weight-big-text;
  font-family: $font-family-big-text;
  color: $font-color-big-text;
  line-height: $font-line-height-big-text;
  letter-spacing: $font-letter-spacing-big-text;
}

@mixin font-text {
  font-size: $font-size-text;
  font-weight: $font-weight-text;
  font-family: $font-family-text;
  color: $font-color-text;
  line-height: $font-line-height-text;
  letter-spacing: $font-letter-spacing-text;
}

@mixin font-small-text {
  font-size: $font-size-small-text;
  font-weight: $font-weight-small-text;
  font-family: $font-family-small-text;
  color: $font-color-small-text;
  line-height: $font-line-height-small-text;
  letter-spacing: $font-letter-spacing-small-text;
}