/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    './src/**/*.{js,ts,jsx,tsx}', 
    './src-migrate/**/*.{js,ts,jsx,tsx}'
  ],
  plugins: [require('flowbite/plugin')],
  darkMode: 'class',
  theme: {
    container: {
      center: true
    },
    extend: {
      typography: {
        DEFAULT: {
          css: {
            b: {
              fontWeight: 'inherit'
            }
          }
        }
      },
      container: {
        padding: '1rem',
        screens: {
          xl: '1288px'
        }
      },
      fontFamily: {
        sans: ['Inter', 'sans-serif']
      },
      fontSize: {
        'display-lg': ['56px', '100%'],
        'display-md': ['48px', '100%'],
        'display-sm': ['36px', '100%'],
        'title-lg': ['28px', '121%'],
        'title-md': ['24px', '121%'],
        'title-sm': ['20px', '121%'],
        'h-lg': ['18px', '121%'],
        'h-md': ['17px', '121%'],
        'h-sm': ['16px', '121%'],
        'body-1': ['15px', '121%'],
        'body-2': ['14px', '121%'],
        'paragraph-1': ['15px', '140%'],
        'paragraph-2': ['14px', '140%'],
        'caption-1': ['13px', '121%'],
        'caption-2': ['12px', '121%']
      },
      colors: {
        gray_r: {
          1: '#fcfcfc',
          2: '#f8f8f8',
          3: '#f3f3f3',
          4: '#ededed',
          5: '#e8e8e8',
          6: '#e2e2e2',
          7: '#dbdbdb',
          8: '#c7c7c7',
          9: '#8f8f8f',
          10: '#858585',
          11: '#6f6f6f',
          12: '#171717'
        },
        primary: {
          100: '#FDDACC',
          200: '#FCAE99',
          300: '#F67766',
          400: '#ED4540',
          500: '#E20613',
          600: '#C20420',
          700: '#A20329',
          800: '#83012C',
          900: '#6C012D'
        },
        success: {
          100: '#ECFBD2',
          200: '#D4F8A6',
          300: '#B1EB77',
          400: '#8ED853',
          500: '#5EBF22',
          600: '#45A418',
          700: '#308911',
          800: '#1E6E0A',
          900: '#125B06'
        },
        info: {
          100: '#CAFDF8',
          200: '#97FBF9',
          300: '#62EDF5',
          400: '#3BD5EC',
          500: '#00B3E0',
          600: '#008BC0',
          700: '#0068A1',
          800: '#004A81',
          900: '#00356B'
        },
        warning: {
          100: '#FEF8CD',
          200: '#FEEF9C',
          300: '#FCE26B',
          400: '#FAD646',
          500: '#F8C20A',
          600: '#D5A107',
          700: '#B28305',
          800: '#8F6503',
          900: '#775101'
        },
        danger: {
          100: '#FCE0D1',
          200: '#F9BBA5',
          300: '#EF8B76',
          400: '#E05E52',
          500: '#CC2020',
          600: '#AF1724',
          700: '#921026',
          800: '#760A26',
          900: '#610625'
        }
      },
      keyframes: {
        wobble: {
          '0%': { transform: 'translateY(0)' },
          '25%': { transform: 'translateY(-10px)' },
          '50%': { transform: 'translateY(0)' },
          '75%': { transform: 'translateY(10px)' },
          '100%': { transform: 'translateY(0)' },
        },
      },
      animation: {
        wobble: 'wobble 0.5s ease forwards',
      },
    }
  },
  plugins: [require('@tailwindcss/line-clamp'), require('@tailwindcss/typography')]
}