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

$scope: 'date-picker';

$themes: (
  'light': (
    'accent': color('light', 'primary-fill-2'),
    'background': color('light', 'base-white'),
    'hover': rgb(color('light', 'primary-fill-1'), 0.1),
    'interaction': rgb(color('light', 'primary-fill-2'), 0.1),
    'error': color('light', 'base-text-error'),
    'border': rgb(color('light', 'base-black'), 0.1),
    'shadow': rgb(color('light', 'base-black'), 0.2),
    'text-primary': color('light', 'base-text-primary'),
    'text-secondary': rgb(color('light', 'primary-fill-1'), 0.4),
    'text-disabled': color('light', 'base-text-disabled'),
    'text-active': color('light', 'base-text-reverse'),
    'input-background': rgb(color('light', 'base-white'), 0.05),
    'input-background-disabled': rgb(color('light', 'base-black'), 0.05),
    'input-text': color('light', 'base-text-primary'),
    'input-text-disabled': color('light', 'base-text-disabled'),
    'input-placeholder': color('light', 'base-text-secondary'),
    'input-border': rgb(color('light', 'base-black'), 0.3),
    'input-border-active': rgb(color('light', 'base-black'), 0.5),
    'input-icon': color('light', 'base-text-secondary'),
    'input-error': color('light', 'base-text-error'),
  ),
  'dark': (
    'accent': color('light', 'primary-fill-2'),
    'background': color('light', 'base-white'),
    'hover': rgb(color('light', 'primary-fill-1'), 0.1),
    'interaction': rgb(color('light', 'primary-fill-2'), 0.1),
    'error': color('light', 'semantic-error-fill-1'),
    'border': rgb(color('light', 'base-black'), 0.1),
    'shadow': rgb(color('light', 'base-black'), 0.2),
    'text-primary': color('light', 'base-text-primary'),
    'text-secondary': rgb(color('light', 'primary-fill-1'), 0.4),
    'text-disabled': color('light', 'base-text-disabled'),
    'text-active': color('light', 'base-text-reverse'),
    'input-background': rgb(color('light', 'base-white'), 0.05),
    'input-background-disabled': rgb(color('light', 'base-black'), 0.05),
    'input-text': color('light', 'base-text-primary'),
    'input-text-disabled': color('light', 'base-text-disabled'),
    'input-placeholder': color('light', 'base-text-secondary'),
    'input-border': rgb(color('light', 'base-black'), 0.3),
    'input-border-active': rgb(color('light', 'base-black'), 0.5),
    'input-icon': color('light', 'base-text-secondary'),
    'input-error': color('light', 'semantic-error-fill-1'),
  ),
);

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

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