@use '@storyblok/design-tokens/tokens/scss/index' as *;

// Typography
// Deprecated variables
$primary-font-family: 'Roboto', sans-serif;
$font-size-default: 1.6rem;
$line-height-default: 1;

// Deprecated. Prefer to use semantic values
// text sizes
$font-10: $sb-font-size-xs; // 1rem
$font-12: $sb-font-size-sm; // 1.2rem
$font-13: 1.3rem;
$font-14: $sb-font-size-base; // 1.4rem
$font-16: $sb-font-size-lg; // 1.6rem
$font-18: 1.8rem;
$font-20: $sb-font-size-xl; // 2rem
$font-24: $sb-font-size-2xl; // 2.4rem
$font-26: 2.6rem;
$font-32: 3.2rem;

// Font weight
$font-light: 300; // deprecated
$font-regular: $sb-font-weight-regular;
$font-medium: $sb-font-weight-medium;
$font-bold: $sb-font-weight-bold;

// DEPRECATED. Prefer to use semantic values
// ----- Global Helper Classes -----
// -- Font size helper classes
// E.g. .font-10, font-12, ..
$font-size: (
  '10': $font-10,
  '12': $font-12,
  '13': $font-13,
  '14': $font-14,
  '16': $font-16,
  '18': $font-18,
  '20': $font-20,
  '24': $font-24,
  '26': $font-26,
  '32': $font-32,
);

// -- Font weight helper classes
// E.g. .font-thin, .font-light, ..
$font-weight: (
  'light': $font-light,
  'regular': $font-regular,
  'medium': $font-medium,
  'bold': $font-bold,
);

// new font sizes definitions using the semantic values
$semantic-font-size: (
  'xs': $sb-font-size-xs,
  'sm': $sb-font-size-sm,
  'base': $sb-font-size-base,
  'lg': $sb-font-size-lg,
  'xl': $sb-font-size-xl,
  '2xl': $sb-font-size-2xl,
  '3xl': $sb-font-size-3xl,
);

// -- Text transform helper classes
// E.g. .text-uppercase, .text-lowercase, ..
$text-transforms: (
  'uppercase': $sb-font-case-uppercase,
  'lowercase': $sb-font-case-lowercase,
  'capitalize': $sb-font-case-capitalize,
);