// Families
$euiFontFamily: 'Inter', BlinkMacSystemFont, Helvetica, Arial, sans-serif !default;
$euiCodeFontFamily: 'Roboto Mono', Menlo, Courier, monospace !default;

// Careful using ligatures. Code editors like ACE will often error because of width calculations
$euiFontFeatureSettings: 'calt' 1, 'kern' 1, 'liga' 1 !default;

// Font sizes -- scale is loosely based on Major Third (1.250)
$euiTextScale:      2.25, 1.75, 1.25, 1.125, 1, .875, .75 !default;

$euiFontSize:       $euiSize !default; // 5th position in scale
$euiFontSizeXS:     $euiFontSize * nth($euiTextScale, 7) !default; // 12px
$euiFontSizeS:      $euiFontSize * nth($euiTextScale, 6) !default; // 14px
$euiFontSizeM:      $euiFontSize * nth($euiTextScale, 4) !default; // 18px
$euiFontSizeL:      $euiFontSize * nth($euiTextScale, 3) !default; // 20px
$euiFontSizeXL:     $euiFontSize * nth($euiTextScale, 2) !default; // 28px
$euiFontSizeXXL:    $euiFontSize * nth($euiTextScale, 1) !default; // 36px

// Line height
$euiLineHeight:     1.5 !default;
$euiBodyLineHeight: 1 !default;

// Normally functions are imported before variables in `_index.scss` files
// But because they need to consume some typography variables they need to live here
@function convertToRem($size) {
  @return #{$size / $euiFontSize}rem;
}

// Our base gridline is at 1/2 the font-size, ensure line-heights stay on that gridline.
// EX: A proper line-height for text is 1.5 times the font-size.
//     If our base font size (euiFontSize) is 16, our baseline is 8 (16*1.5 / 3). To ensure the
//     text stays on the baseline, we pass a multiplier to calculate a line-height in rems.
@function lineHeightFromBaseline($multiplier: 3) {
  @return convertToRem(($euiFontSize / 2) * $multiplier);
}

// Titles map
// Lists all the properties per EuiTitle size that then gets looped through to create the selectors.
// The map allows for tokenization and easier customization per theme, otherwise you'd have to override the selectors themselves
$euiTitles: (
  'xxxs': (
    'font-size': $euiFontSizeXS,
    'line-height': lineHeightFromBaseline(3),
    'font-weight': $euiFontWeightBold,
  ),
  'xxs': (
    'font-size': $euiFontSizeS,
    'line-height': lineHeightFromBaseline(3),
    'font-weight': $euiFontWeightBold,
  ),
  'xs': (
    'font-size': $euiFontSize,
    'line-height': lineHeightFromBaseline(3),
    'font-weight': $euiFontWeightSemiBold,
    'letter-spacing': -.02em,
  ),
  's': (
    'font-size': $euiFontSizeL,
    'line-height': lineHeightFromBaseline(4),
    'font-weight': $euiFontWeightMedium,
    'letter-spacing': -.025em,
  ),
  'm': (
    'font-size': $euiFontSizeXL,
    'line-height': lineHeightFromBaseline(5),
    'font-weight': $euiFontWeightLight,
    'letter-spacing': -.04em,
  ),
  'l': (
    'font-size': $euiFontSizeXXL,
    'line-height': lineHeightFromBaseline(6),
    'font-weight': $euiFontWeightLight,
    'letter-spacing': -.03em,
  ),
) !default;
