import type { PaletteMode } from '@mui/material';
import { alpha } from '@mui/material/styles';

import { ShadesColor } from '@/mui/types';

import { ALPHA_300, ALPHA_500, ALPHA_700, ALPHA_800 } from '../../opacity';
import { ACTIONS_OPACITY } from '../index';

// export const TAG_PEOPLE = '#1A8236';
// export const TAG_BRANDS = '#1C5F99';
// export const TAG_IAB = '#8E2CA7';
// export const TAG_BRAND_SAFETY = '#B63104';
// export const TAG_KEYWORDS = '#155766';
// export const TAG_TEXT = '#785020';
// export const TAG_CC = '#5B2CC4';

const SHADES: ShadesColor = {
  0: '#161c24',
  50: '#161c24',
  100: '#212b36',
  200: '#454f5b',
  300: '#637381',
  400: '#919eab',
  500: '#c4cdd5',
  600: '#dfe3e8',
  700: '#f4f6f8',
  800: '#f9fafb',
  900: '#ffffff',
  A100: '#ffffff',
  A200: '#ffffff',
  A400: '#ffffff',
  A700: '#ffffff',
};

const palette = {
  mode: 'dark' as PaletteMode,
  primary: {
    dark: '#497af7',
    main: '#6e9efa',
    light: '#9fc0ff',
    contrastText: '#000000',
  },
  secondary: {
    dark: '#8744ef',
    main: '#9b61f3',
    light: '#b584ff',
    contrastText: '#000000',
  },
  info: {
    dark: '#7e8ab7',
    main: '#929ec8',
    light: '#acb9da',
    contrastText: '#000000',
  },
  success: {
    dark: '#6ee625',
    main: '#89fd42',
    light: '#b8ff8d',
    contrastText: '#000000',
  },
  warning: {
    dark: '#ffb800',
    main: '#ffca42',
    light: '#ffd873',
    contrastText: '#000000',
  },
  highlight: {
    dark: '#ffee58',
    main: '#fff176',
    light: '#fff59d',
    contrastText: '#000000',
  },
  highlight2: {
    dark: '#0293ea',
    main: '#00a0ff',
    light: '#32b3ff',
    contrastText: '#ffffff',
  },
  error: {
    dark: '#f43e37',
    main: '#f5605b',
    light: '#ff7772',
    contrastText: '#000000',
  },
  complimentary: {
    dark: '#37c7b9',
    main: '#4cddcf',
    light: '#75fbeb',
    contrastText: '#000000',
  },
  text: {
    primary: alpha('#ffffff', ALPHA_800),
    secondary: alpha('#ffffff', ALPHA_700),
    disabled: alpha('#ffffff', ALPHA_500),
  },
  gradient: ['#a1b6e0'],
  platform: {
    anyclip: '#663d9e',
    youtube: '#ff0000',
    linkedin: '#2867b2',
    facebook: '#1877f2',
    twitter: '#000000',
    whatsapp: '#25d366',
    default: '#6782a4',
  },
  '-tagText': {
    dark: '#ffdaae',
    main: '#ffe6c9',
    light: '#ffedd9',
    contrastText: '#785020',
  },
  '-tagBrandSafety': {
    dark: '#ffccbb',
    main: '#ffdfd3',
    light: '#ffeae2',
    contrastText: '#b63104',
  },
  '-tagBrands': {
    dark: '#ccdaf0',
    main: '#dbe8fb',
    light: '#e7f0ff',
    contrastText: '#1c5f99',
  },
  '-tagIAB': {
    dark: '#f3c5ff',
    main: '#f8dbff',
    light: '#fbe9ff',
    contrastText: '#8e2ca7',
  },
  '-tagPeople': {
    dark: '#bdfdd7',
    main: '#dafde8',
    light: '#e8fff1',
    contrastText: '#1a8236',
  },
  '-tagKeywords': {
    dark: '#abf0ff',
    main: '#c7f5ff',
    light: '#d9f8ff',
    contrastText: '#155766',
  },
  '-tagCC': {
    dark: '#d4c2fe',
    main: '#e2d7ff',
    light: '#ebe3ff',
    contrastText: '#5b2cc4',
  },
  '-graph': [
    '#7439d4', // 0
    '#c05ba4', // 1
    '#20914d', // 2
    '#1a658f', // 3
    '#637595', // 4
    '#71aed2', // 5
    '#8a502a', // 6
    '#e53436', // 7
    '#84eb34', // 8
    '#f0ad54', // 9
    '#9748ff', // 10
    '#fc73ff', // 11
    '#9be757', // 12
    // marketplace graphs
    '#2f56e7', // 13
    '#2bd7cc', // 14
    '#06a0ff', // 15
    '#ff4702', // 16
  ],
  divider: alpha(SHADES[900], ALPHA_300),
  background: {
    paper: '#2b343f',
    default: '#21262c',
  },
  shades: SHADES,
  action: {
    active: SHADES[900],
    hover: alpha(SHADES[900], ACTIONS_OPACITY.hoverOpacity),
    selected: alpha(SHADES[900], ACTIONS_OPACITY.selectedOpacity),
    disabled: alpha(SHADES[900], ACTIONS_OPACITY.disabledOpacity),
    disabledBackground: alpha(SHADES[900], ACTIONS_OPACITY.disabledBackgroundOpacity),
    focus: alpha(SHADES[900], ACTIONS_OPACITY.focusOpacity),
    ...ACTIONS_OPACITY,
  },
};

export default palette;
