export const defaultTheme = {
  colors: {
    background: `
      radial-gradient(
        49.07% 49.07% at 50% 29.54%,
        rgba(255, 255, 255, 0.14) 0%,
        rgba(255, 255, 255, 0) 100%
      ),
      rgba(0, 0, 0, 0.9)`,
    black: '#000000',
    black40: 'rgba(0, 0, 0, 0.4)',
    black70: 'rgba(0, 0, 0, 0.7)',
    button: '#294FC3',
    buttonHover: '#3255be',
    collapseTournamentBackground: 'linear-gradient(236.13deg, rgba(53, 96, 225, 0.56) -4.49%, rgba(0, 0, 0, 0) 98.29%), #3F3F3F',
    comboboxBackground: '#3F3F3F',
    comboboxItemHover: '#999999',
    dateButton: 'rgba(255, 255, 255, 0.5)',
    dateFilter: '#656565',
    error: 'rgba(235, 87, 87, 1)',
    inputs: '#3F3F3F',
    liveMatchPlaylistBtnBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3F3F3F',
    liveMatchPlaylistBtnHover: '#555555',
    loader: '#FFFFFF',
    loaderAuth: '#FFFFFF',
    matchCardBackground: '#3F3F3F',
    matchHeaderBackground: '#2B2A28',
    modalBackground: '#333333',
    packageBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3F3F3F',
    playerActionBtnBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3F3F3F',
    primary: `
      linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.1) 0.01%,
        rgba(0, 0, 0, 0.1) 99.99%
      ),
      #0033CC
    `,
    searchBtnHover: '#3b3b3b',
    secondary: '#999999',
    shadow: '0px 1px 1px rgba(0, 0, 0, 0.3)',
    unsubscribeItemBackground: `linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.1) 0%,
      rgba(255, 255, 255, 0) 100%
    ),
    #3f3f3f`,
    white: '#FFFFFF',
    white50: 'rgba(255, 255, 255, 0.5)',
    white70: 'rgba(255, 255, 255, 0.7)',
  },
  name: 'dark' as Name,
}

export const lffTheme: CustomTheme = {
  ...defaultTheme,
  colors: {
    ...defaultTheme.colors,
    background: '#1D1D1D',
    button: '#A30C2F',
    buttonHover: '#DB1C49',
    dateButton: defaultTheme.colors.white,
    dateFilter: defaultTheme.colors.white50,
    inputs: 'transparent',
  },
  name: 'lff',
}

export const facrTheme: CustomTheme = {
  ...defaultTheme,
  colors: {
    ...defaultTheme.colors,
    button: '#00257A',
    inputs: 'transparent',
    loaderAuth: '#00257A',
  },
  name: 'facr',
}

export const tunisTheme: CustomTheme = {
  ...defaultTheme,
  colors: {
    ...defaultTheme.colors,
    background: '#1D1D1D',
    button: '#0E8F84',
    buttonHover: '#0E8F84',
    collapseTournamentBackground: 'linear-gradient(236.13deg, rgba(42, 183, 170, 0.56) -4.49%, rgba(0, 0, 0, 0) 98.29%), #3A4849',
    comboboxBackground: '#263233',
    comboboxItemHover: '#0E8F84',
    dateFilter: '#ffffff80',
    error: '#FF4E77',
    inputs: '#3A4849',
    liveMatchPlaylistBtnBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3A4849',
    liveMatchPlaylistBtnHover: '#0E8F84',
    loaderAuth: '#0B2E4D',
    matchCardBackground: '#3A4849',
    matchHeaderBackground: '#030F1B',
    modalBackground: '#263233',
    packageBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3A4849',
    playerActionBtnBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3A4849',
    searchBtnHover: '#0E8F84',
    unsubscribeItemBackground: 'linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%), #3A4849',
  },
  name: 'tunisia',
}

type Name = 'light' | 'dark' | 'lff' | 'facr' | 'tunisia'

export type CustomTheme = typeof defaultTheme