import { HuiThemes, HuiThemesExpressiveness, HuiThemesPalette } from './index'
import { defaultBreakpoints, defaultFont, defaultLayout } from './shared'

export const palette: HuiThemesPalette = {
  global: {
    base: {
      white: '#ffffff',
      black: '#000000'
    },
    grayscale: {
      12: '#FBFCFD',
      11: '#F8F9FA',
      10: '#F1F3F5',
      9: '#ECEEF0',
      8: '#E6E8EB',
      7: '#DFE3E6',
      6: '#D7DBDF',
      5: '#C1C8CD',
      4: '#889096',
      3: '#7E868C',
      2: '#687076',
      1: '#11181C'
    }
  },
  brand: {
    primary: {
      12: '#FCFBFF',
      11: '#F8F4FE',
      10: '#F4EEFF',
      9: '#EBDEFE',
      8: '#E3D3FE',
      7: '#D9C1FE',
      6: '#C8A6FD',
      5: '#B385FC',
      4: '#8435FF',
      3: '#7521F9',
      2: '#5811C9',
      1: '#1C005A'
    }
  },
  system: {
    info: {
      12: '#FDFDFE',
      11: '#F8FAFF',
      10: '#F0F4FF',
      9: '#E6EDFE',
      8: '#D9E2FC',
      7: '#C6D4F9',
      6: '#AEC0F5',
      5: '#8DA4EF',
      4: '#3E63DD',
      3: '#3A5CCC',
      2: '#3451B2',
      1: '#101D46'
    },
    warn: {
      12: '#FEFDFB',
      11: '#FFF9ED',
      10: '#FFF4D5',
      9: '#FFECBC',
      8: '#FFE3A2',
      7: '#FFD386',
      6: '#F3BA63',
      5: '#EE9D2B',
      4: '#FFB224',
      3: '#FFA01C',
      2: '#AD5700',
      1: '#4E2009'
    },
    error: {
      12: '#FFFCFC',
      11: '#FFF8F7',
      10: '#FFF0EE',
      9: '#FFE6E2',
      8: '#FDD8D3',
      7: '#FAC7BE',
      6: '#F3B0A2',
      5: '#EA9280',
      4: '#E54D2E',
      3: '#DB4324',
      2: '#CA3214',
      1: '#341711'
    },
    success: {
      12: '#FBFEFC',
      11: '#F2FCF5',
      10: '#E9F9EE',
      9: '#DDF3E4',
      8: '#CCEBD7',
      7: '#B4DFC4',
      6: '#92CEAC',
      5: '#5BB98C',
      4: '#30A46C',
      3: '#299764',
      2: '#18794E',
      1: '#153226'
    }
  },
  accents_12: '#FBFCFD',
  accents_11: '#F8F9FA',
  accents_10: '#F1F3F5',
  accents_9: '#ECEEF0',
  accents_8: '#E6E8EB',
  accents_7: '#DFE3E6',
  accents_6: '#D7DBDF',
  accents_5: '#C1C8CD',
  accents_4: '#889096',
  accents_3: '#7E868C',
  accents_2: '#687076',
  accents_1: 'var(--axo-background, hsl(234deg 17% 12%))',

  background: 'var(--axo-background, hsl(234deg 17% 12%))',
  foreground: '#fff',
  selection: '#5811C9',
  secondary: '#889096',
  code: '#f81ce5',
  border: '#1d2630',
  error: '#e00',
  errorLighter: '#f7d4d6',
  errorLight: '#ff1a1a',
  errorDark: '#c50000',
  success: '#7521F9',
  successLight: '#5811C9',
  successLighter: '#1C005A',
  successDark: '#8435FF',
  warning: '#f5a623',
  warningLighter: '#ffefcf',
  warningLight: '#f7b955',
  warningDark: '#ab570a',
  viridian: '#12939a',
  viridianLighter: '#68E7ED',
  viridianLight: '#1AD2DC',
  viridianDark: '#0E757A',
  violet: '#7521F9',
  violetLighter: '#1C005A',
  violetLight: '#5811C9',
  violetDark: '#8435FF',
  purple: '#f81ce5',
  alert: '#ff0080',
  magenta: '#eb367f',
  link: '#8435FF'
}

export const expressiveness: HuiThemesExpressiveness = {
  linkStyle: 'none',
  linkHoverStyle: 'none',
  dropdownBoxShadow: '#101820',
  scrollerStart: 'transparent',
  scrollerEnd: '#000000',
  shadowSmallest: '0 0 0 1px #454545',
  shadowExtraSmall: '0 0 0 1px #454545',
  shadowSmall: '0 0 0 1px #454545',
  shadowMedium: '0 0 0 1px #454545',
  shadowLarge: '0 0 0 1px #454545',
  shadowHover: '0 0 0 1px #ffff',
  shadowSticky: '0 0 0 1px #454545',
  portalOpacity: 0.75
}

export const font = defaultFont

export const breakpoints = defaultBreakpoints

export const layout = defaultLayout

export const themes: HuiThemes = {
  type: 'dark',
  font,
  layout,
  palette,
  breakpoints,
  expressiveness
}

export default themes