// deprecated - these font face mixins should not be used anymore

@mixin brand-font-face-thin {
  @include exports('brand-font-face-thin') {
    @font-face {
      font-family: 'Inter Thin';
      font-style: normal;
      font-weight: 200;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-thin-oblique {
  @include exports('brand-font-face-thin-oblique') {
    @font-face {
      font-family: 'Inter Thin Oblique';
      font-style: 200;
      font-weight: 450;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-extra-light {
  @include exports('brand-font-face-extra-light') {
    @font-face {
      font-family: 'Inter Extra Light';
      font-style: normal;
      font-weight: 250;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-extra-light-oblique {
  @include exports('brand-font-face-extra-light-oblique') {
    @font-face {
      font-family: 'Inter Extra Light Oblique';
      font-style: italic;
      font-weight: 250;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-light {
  @include exports('brand-font-face-light') {
    @font-face {
      font-family: 'Inter Light';
      font-style: normal;
      font-weight: 350;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-light-oblique {
  @include exports('brand-font-face-light-oblique') {
    @font-face {
      font-family: 'Inter Light Oblique';
      font-style: italic;
      font-weight: 350;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-regular {
  @include exports('brand-font-face-regular') {
    @font-face {
      font-family: 'Inter Regular';
      font-style: normal;
      font-weight: 450;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-regular-oblique {
  @include exports('brand-font-face-regular-oblique') {
    @font-face {
      font-family: 'Inter Regular Oblique';
      font-style: italic;
      font-weight: 450;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-medium {
  @include exports('brand-font-face-medium') {
    @font-face {
      font-family: 'Inter Medium';
      font-style: normal;
      font-weight: 550;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-medium-oblique {
  @include exports('brand-font-face-medium') {
    @font-face {
      font-family: 'Inter Medium Oblique';
      font-style: italic;
      font-weight: 550;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-bold {
  @include exports('brand-font-face-bold') {
    @font-face {
      font-family: 'Inter Bold';
      font-style: normal;
      font-weight: 750;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-bold-oblique {
  @include exports('brand-font-face-bold-oblique') {
    @font-face {
      font-family: 'Inter Bold Oblique';
      font-style: italic;
      font-weight: 750;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-heavy {
  @include exports('brand-font-face-heavy') {
    @font-face {
      font-family: 'Inter Heavy';
      font-style: normal;
      font-weight: 850;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-face-heavy-oblique {
  @include exports('brand-font-face-heavy-oblique') {
    @font-face {
      font-family: 'Inter Heavy Oblique';
      font-style: italic;
      font-weight: 850;
      src: url('#{$brand-font-folder}/Inter.var.woff2') format('woff2');
      font-display: fallback;
    }
  }
}

@mixin brand-font-faces {
  @include brand-font-face-thin;
  @include brand-font-face-thin-oblique;
  @include brand-font-face-extra-light;
  @include brand-font-face-extra-light-oblique;
  @include brand-font-face-light;
  @include brand-font-face-light-oblique;
  @include brand-font-face-medium;
  @include brand-font-face-medium-oblique;
  @include brand-font-face-regular;
  @include brand-font-face-regular-oblique;
  @include brand-font-face-bold;
  @include brand-font-face-bold-oblique;
  @include brand-font-face-heavy;
  @include brand-font-face-heavy-oblique;
}

// TODO: remove legacy font-family mixin in next breaking release
@mixin brand-font-family-ciscoFont {
  @include brand-font-faces;
}

@mixin align-classes {
  .text-left {
    text-align: left !important;
  }

  .text-right {
    text-align: right !important;
  }

  .text-center {
    text-align: center !important;
  }

  .text-justify {
    text-align: justify !important;
  }
}

@mixin lead {
  font-size: $paragraph-font-size + rem-calc(3.5);
  line-height: 1.6;
}

@mixin subheader {
  margin-top: $subheader-top-margin;
  margin-bottom: $subheader-bottom-margin;
  font-weight: $subheader-font-weight;
  line-height: $subheader-line-height;
  color: $subheader-font-color;
}