// Surface color alpha levels
$as-color-strong: 1;
$as-color-normal: 0.7;
$as-color-helptext: 0.45;
$as-color-light: 0.24;
$as-color-disabled: 0.16;

// Border color alpha levels
$as-border-normal: 0.08;

// Interactiveness alpha levels
$as-border-hover: 0.15;
$as-border-active: 1;

@mixin createTheme(
  $level0,
  $level1,
  $level2,
  $level3,
  $level4,
  $text,
  $primary,
  $primaryHover,
  $primaryActive,
  $primaryText,
  $borderNormal,
  $borderHover,
  $borderActive,
  $secondary,
  $secondaryHover,
  $secondaryActive,
  $secondaryText,
  $focusColor
) {
  $text-rgb: getRgb($text);
  $primary-rgb: getRgb($primary);

  --as-surface-level-0: #{$level0};
  --as-surface-level-1: #{$level1};
  --as-surface-level-2: #{$level2};
  --as-surface-level-3: #{$level3};
  --as-surface-level-4: #{$level4};
  --as-text-strong: rgba(#{$text-rgb}, #{$as-color-strong});
  --as-text-normal: rgba(#{$text-rgb}, #{$as-color-normal});
  --as-text-helptext: rgba(#{$text-rgb}, #{$as-color-helptext});
  --as-text-light: rgba(#{$text-rgb}, #{$as-color-light});
  --as-text-disabled: rgba(#{$text-rgb}, #{$as-color-disabled});
  --as-border-normal: #{$borderNormal};
  --as-border-hover: #{$borderHover};
  --as-border-active: #{$borderActive};
  --as-primary: #{$primary};
  --as-primary-hover: #{$primaryHover};
  --as-primary-active: #{$primaryActive};
  --as-primary-text: #{$primaryText};
  --as-primary-shadow-1: 0 1px 8px 2px #{$primaryHover};
  --as-secondary: #{$secondary};
  --as-secondary-hover: #{$secondaryHover};
  --as-secondary-active: #{$secondaryActive};
  --as-secondary-text: #{$secondaryText};
  --as-secondary-shadow-1: 0 1px 8px 2px #{$secondaryHover};
  --as-focus: #{$focusColor};
}