import type { Config } from 'tailwindcss'

const config: Config = {
  content: [
    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      colors: {
        pink: {
          50: '#FFF0F5',
          100: '#FFE0EB',
          200: '#FFB8D9',
          300: '#FF8AC8',
          400: '#F45D9E',
          500: '#D23B80',
        },
        sage: {
          200: '#D4E6D5',
          300: '#B5D4B7',
          400: '#8AB68C',
          500: '#6A9A6C',
        },
        cream: {
          50: '#FFFEF5',
          100: '#FFF9F0',
        },
      },
      spacing: {
        'xs': '0.25rem',
        'sm': '0.5rem',
        'md': '1rem',
        'lg': '1.5rem',
        'xl': '2rem',
        'xxl': '3rem',
      },
      maxWidth: {
        'container': '1200px',
      },
      transitionDuration: {
        'transition': '200ms',
      },
    },
  },
  plugins: [],
}

export default config