@use "../../../styles/tools/convert";
@use "../../../styles/tokens/color";

$sizes: (
  default: (
    small: convert.to-rem(16px),
    medium: convert.to-rem(24px),
    large: convert.to-rem(24px),
    xlarge: convert.to-rem(40px),
    xxlarge: convert.to-rem(48px),
    huge: convert.to-rem(56px),
  ),
  md: (
    large: convert.to-rem(32px),
    xlarge: convert.to-rem(48px),
    xxlarge: convert.to-rem(56px),
    huge: convert.to-rem(64px),
  ),
  lg: (
    large: convert.to-rem(32px),
    xlarge: convert.to-rem(48px),
    xxlarge: convert.to-rem(64px),
    huge: convert.to-rem(80px),
  ),
);

$pictogram-sizes: (
  small: convert.to-rem(16px),
  medium: convert.to-rem(24px),
  large: convert.to-rem(32px),
  xlarge: convert.to-rem(48px),
  xxlarge: convert.to-rem(64px),
  huge: convert.to-rem(80px),
);

$colors: (
  info: var(--color-icon-information),
  success: var(--color-icon-positive),
  warning: var(--color-icon-warning),
  danger: var(--color-icon-negative),
  orange: var(--color-icon-brand),
);