// Typography
//
// Font, line-height, and color for body text, headings, and more.

// scss-docs-start font-variables
$font-family-sans-serif: "Jost", sans-serif !default;

// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins
// $font-size-base affects the font size of the body text
$font-size-root: 16px !default;
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`

// custom
$font-size-sm: var(--#{$prefix}fs-small) !default;
$font-size-sm-value: .875em !default;
// end custom

// custom
$font-weight-lighter-value: lighter !default;
$font-weight-light-value: 200 !default;
$font-weight-normal-value: 400 !default;
$font-weight-semibold-value: 500 !default;
$font-weight-bold-value: 600 !default;
$font-weight-bolder-value: 600 !default;

$font-weight-lighter: var(--#{$prefix}fw-lighter) !default;
$font-weight-light: var(--#{$prefix}fw-light) !default;
$font-weight-normal: var(--#{$prefix}fw-normal) !default;
$font-weight-semibold: var(--#{$prefix}fw-semibold) !default;
$font-weight-bold: var(--#{$prefix}fw-bold) !default;
$font-weight-bolder: var(--#{$prefix}fw-bolder) !default;
// end custom

$font-weight-base: $font-weight-normal !default;

$line-height-base: 1.5 !default;
$line-height-sm: 1.25 !default;
$line-height-lg: 2 !default;


// custom
$h1-font-size-value: $font-size-base * 3 !default;    // 48px - 30.675px
$h2-font-size-value: $font-size-base * 2.5 !default;  // 40px - 27.625px
$h3-font-size-value: $font-size-base * 2 !default;    // 32px - 25.575px
$h4-font-size-value: $font-size-base * 1.5 !default;  // 24px - 21.525px
$h5-font-size-value: $font-size-base * 1.25 !default; // 20px - 20px
$h6-font-size-value: $font-size-base !default;        // 16px - 16px

$h1-font-size: var(--#{$prefix}fs-1) !default;
$h2-font-size: var(--#{$prefix}fs-2) !default;
$h3-font-size: var(--#{$prefix}fs-3) !default;
$h4-font-size: var(--#{$prefix}fs-4) !default;
$h5-font-size: var(--#{$prefix}fs-5) !default;
$h6-font-size: var(--#{$prefix}fs-6) !default;
// end custom
// scss-docs-end font-variables

// scss-docs-start font-sizes
// custom
$font-size-values: (
  1: $h1-font-size-value,
  2: $h2-font-size-value,
  3: $h3-font-size-value,
  4: $h4-font-size-value,
  5: $h5-font-size-value,
  6: $h6-font-size-value
) !default;
// end custom

$font-sizes: (
  1: $h1-font-size,
  2: $h2-font-size,
  3: $h3-font-size,
  4: $h4-font-size,
  5: $h5-font-size,
  6: $h6-font-size
) !default;
// scss-docs-end font-sizes

// scss-docs-start headings-variables
$headings-margin-bottom: 0 !default;
$headings-font-weight: $font-weight-bold !default;
$headings-line-height-value: 1.2 !default;
$headings-line-height: var(--#{$prefix}heading-line-height) !default;
// scss-docs-end headings-variables

// scss-docs-start display-headings
// custom
$display1-font-size-value: $font-size-base * 6 !default;   // 96px - 48.975px
$display2-font-size-value: $font-size-base * 5.5 !default; // 88px - 45.925px
$display3-font-size-value: $font-size-base * 5 !default;   // 80px - 42.875px
$display4-font-size-value: $font-size-base * 4.5 !default; // 72px - 39.825px
$display5-font-size-value: $font-size-base * 4 !default;   // 64px - 36.775px
$display6-font-size-value: $font-size-base * 3.5 !default; // 56px - 33.725px

$display1-font-size: var(--#{$prefix}fs-display-1) !default;
$display2-font-size: var(--#{$prefix}fs-display-2) !default;
$display3-font-size: var(--#{$prefix}fs-display-3) !default;
$display4-font-size: var(--#{$prefix}fs-display-4) !default;
$display5-font-size: var(--#{$prefix}fs-display-5) !default;
$display6-font-size: var(--#{$prefix}fs-display-6) !default;

$display-font-size-values: (
  1: $display1-font-size-value,
  2: $display2-font-size-value,
  3: $display3-font-size-value,
  4: $display4-font-size-value,
  5: $display5-font-size-value,
  6: $display6-font-size-value
) !default;
// end custom

$display-font-sizes: (
  1: $display1-font-size,
  2: $display2-font-size,
  3: $display3-font-size,
  4: $display4-font-size,
  5: $display5-font-size,
  6: $display6-font-size
) !default;

$display-font-weight: $font-weight-base !default;
$display-line-height: $headings-line-height !default;
// scss-docs-end display-headings

// scss-docs-start type-variables
$lead-font-weight: $font-weight-normal !default;

// custom
$small-font-size: $font-size-sm !default;
$small-font-size-value: $font-size-sm-value !default;
// end custom

$sub-sup-font-size: .75em !default;

$blockquote-margin-y: var(--#{$prefix}ref-spacer-4) !default;
$blockquote-footer-color: var(--#{$prefix}gray-600) !default;

$hr-margin-y: var(--#{$prefix}ref-spacer-4) !default;
$hr-color: inherit !default;

$hr-border-color: $border-color !default; // Allows for inherited colors
$hr-opacity: 1 !default;

$mark-bg: var(--#{$prefix}warning-100) !default;
// scss-docs-end type-variables