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

$scope: 'single-toggle';

$themes: (
  'light': (
    'background': rgba(color('light', 'primary-fill-1'), 0.05),
    'border': rgba(color('light', 'primary-fill-1'), 0.3),
    'text': color('light', 'base-text-secondary'),
    'selected-background':
      linear-gradient(99.85deg, rgb(117, 215, 207) 0%, rgb(120, 221, 213) 0.01%, rgb(72, 193, 209) 100%),
    'selected-border': rgba(color('light', 'primary-fill-1'), 0.1),
    'selected-hover-background': color('light', 'primary-fill-3'),
    'selected-text': color('light', 'base-text-primary'),
    'selected-disabled-background': linear-gradient(99.85deg, rgba(117, 215, 207, 0.6) 0%, rgba(72, 193, 209, 0.6) 100%),
    'disabled-text': color('light', 'base-text-disabled'),
    'hover-text': color('light', 'base-text-primary'),
  ),
  'dark': (),
);

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

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