import merge from 'lodash.merge';
import { defaultTheme } from './theme';
import { codeSnippetDarkThemeOverrides } from './theme/components/codeSnippet';

export const colors = {
  surface: {
    main: '#181a1c',
    dark: '#bec4ca',
    light: '#555f68',
    highlight: '#22262a',
    contrast: '#f5f6f7',
  },
  primary: {
    main: '#1f80ff',
    dark: '#71aeff',
    light: '#004094',
    highlight: '#00214d',
    contrast: '#000000',
  },
  secondary: {
    main: '#a665eb',
    dark: '#b9a0f3',
    light: '#683ae6',
    highlight: '#361299',
    contrast: '#000000',
  },
  success: {
    main: '#27963c',
    dark: '#8bc3a2',
    light: '#004d0f',
    highlight: '#001f00',
    contrast: '#000000',
  },
  error: {
    main: '#f85249',
    dark: '#fa7c75',
    light: '#c51107',
    highlight: '#4a0603',
    contrast: '#000000',
  },
  warning: {
    main: '#EF7A33',
    dark: '#FF985A',
    light: '#FF6304',
    highlight: '#C45512',
    contrast: '#000000',
  },
};

const darkTheme = merge({}, defaultTheme, {
  globals: {
    colors,
  },
  components: {
    ...codeSnippetDarkThemeOverrides,
  },
});

export default darkTheme;
