//-------------------------------------------------------------------
// Typography
//-------------------------------------------------------------------

// Font Families
//-------------------------------------------------------------------

$default-font-family: (
  roboto,
  -apple-system,
  blinkmacsystemfont,
  'Segoe UI',
  'Helvetica Neue',
  arial,
  sans-serif,
  'Apple Color Emoji',
  'Segoe UI Emoji',
  'Segoe UI Symbol'
);
$font-family-primary-list:
  var(--primary-font-family),
  #{$default-font-family};
$font-families: (
  'main': (
    $font-family-primary-list,
  ),
);

// Typographic Scale
//-------------------------------------------------------------------

$font-sizes: (
  6: rem(6px),
  8: rem(8px),
  10: rem(10px),
  12: rem(12px),
  14: rem(14px),
  15: rem(15px),
  16: rem(16px),
  18: rem(18px),
  20: rem(20px),
  24: rem(24px),
  32: rem(32px),
  40: rem(40px),
  48: rem(48px),
  56: rem(56px),
  64: rem(64px),
  80: rem(80px),
  96: rem(96px),
  120: rem(120px),
  136: rem(136px),
);

// Font Weights
//-------------------------------------------------------------------

$font-weights: (
  'thin': 100,
  'extra-light': 200,
  'light': 300,
  'regular': 400,
  'medium': 500,
  'semi-bold': 600,
  'bold': 700,
  'extra-bold': 800,
  'black': 900,
);

// Line heights
//-------------------------------------------------------------------

$line-heights: (
  'single': 1,
  'small': 1.2,
  'normal': 1.6,
  'large': 1.8,
);

// Letter spacing
//-------------------------------------------------------------------

$letter-spacing: (
  'x-tight': '-0.05em',
  'tight': '-0.05em',
  'normal': 'normal',
  'loose': '0.05em',
  'x-loose': '0.1em',
);

// Font Presets
//-------------------------------------------------------------------

$font-settings: (
  'label-12': (
    12,
    'semi-bold',
    'main',
    'normal',
    'loose',
    'uppercase',
  ),
  'caption': (
    12,
    'medium',
  ),
  'body-12': (
    12,
    'medium',
  ),
  'body-14': (
    14,
    'medium',
  ),
  'body-16': (
    16,
    'medium',
  ),
  'subtitle': (
    18,
    'semi-bold',
  ),
  'headline-20': (
    20,
    'semi-bold',
    'main',
    'small',
    'tight',
  ),
  'headline-24': (
    24,
    'semi-bold',
    'main',
    'small',
    'tight',
  ),
  'headline-32': (
    32,
    'semi-bold',
    'main',
    'single',
    'tight',
  ),
  'headline-48': (
    48,
    'semi-bold',
    'main',
    'single',
    'tight',
  ),
);