@use 'styles/helpers.scss' as *;

$scope: 'chip';

$themes: (
  'light': (
    'background': rgb(color('light', 'primary-fill-1'), 0.1),
    'hover-background': rgb(color('light', 'primary-fill-1'), 0.2),
    'active-background': rgb(color('light', 'primary-fill-1'), 0.2),
    'focus-background': rgb(color('light', 'primary-fill-1'), 0.2),
    'disabled-background': rgb(color('light', 'primary-fill-1'), 0.1),
  ),
  'dark': (
    'background': rgb(color('dark', 'primary-fill-1'), 0.1),
    'hover-background': rgb(color('dark', 'primary-fill-1'), 0.2),
    'active-background': rgb(color('dark', 'primary-fill-1'), 0.2),
    'focus-background': rgb(color('dark', 'primary-fill-1'), 0.2),
    'disabled-background': rgb(color('dark', 'primary-fill-1'), 0.1),
  ),
);

@mixin chip-theme-modifiers() {
  @include theme-modifiers($scope, $themes);
}

@function chip-theme-color($name) {
  @return theme-color($scope, $name);
}