// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
//
// Copyright (c) KALEIDOS INC Sucursal en España SL

@use "ds/_utils.scss" as *;

$_font-weight-regular: 400;
$_font-weight-medium: 500;
$_font-lineheight-dense: 1.2;
$_font-lineheight-compact: 1.3;
$_font-lineheight-normal: 1.4;
$_fs-12: px2rem(12);
$_fs-14: px2rem(14);
$_fs-16: px2rem(16);
$_fs-18: px2rem(18);
$_fs-20: px2rem(20);
$_fs-24: px2rem(24);
$_fs-36: px2rem(36);

@mixin _font-style-display {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-36;
}

@mixin _font-style-title-large {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-24;
}

@mixin _font-style-title-medium {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-20;
}

@mixin _font-style-title-small {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-dense;
  font-size: $_fs-14;
}

@mixin _font-style-headline-large {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-18;
  text-transform: uppercase;
}

@mixin _font-style-headline-medium {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-16;
  text-transform: uppercase;
}

@mixin _font-style-headline-small {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-medium;
  line-height: $_font-lineheight-dense;
  font-size: $_fs-12;
  text-transform: uppercase;
}

@mixin _font-style-body-large {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-16;
}

@mixin _font-style-body-medium {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-normal;
  font-size: $_fs-14;
}

@mixin _font-style-body-small {
  font-family: "worksans", "vazirmatn", sans-serif;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-compact;
  font-size: $_fs-12;
}

@mixin _font-style-code-font {
  font-family: "Roboto Mono", monospace;
  font-optical-sizing: auto;
  font-weight: $_font-weight-regular;
  line-height: $_font-lineheight-dense;
  font-size: $_fs-12;
}

@mixin use-typography($typography-name) {
  @if $typography-name == "display" {
    @include _font-style-display;
  } @else if $typography-name == "title-large" {
    @include _font-style-title-large;
  } @else if $typography-name == "title-medium" {
    @include _font-style-title-medium;
  } @else if $typography-name == "title-small" {
    @include _font-style-title-small;
  } @else if $typography-name == "headline-large" {
    @include _font-style-headline-large;
  } @else if $typography-name == "headline-medium" {
    @include _font-style-headline-medium;
  } @else if $typography-name == "headline-small" {
    @include _font-style-headline-small;
  } @else if $typography-name == "body-large" {
    @include _font-style-body-large;
  } @else if $typography-name == "body-medium" {
    @include _font-style-body-medium;
  } @else if $typography-name == "body-small" {
    @include _font-style-body-small;
  } @else if $typography-name == "code-font" {
    @include _font-style-code-font;
  } @else {
    @error "Unknown typography: " + $typography-name;
  }
}