const defaultTheme = require('tailwindcss/defaultTheme');
const colors = require('tailwindcss/colors')

module.exports = {
  content: ['./src/**/*.js', './src/**/*.njk', './src/**/*.tce'],
  theme: {
    colors: {
      ...colors,
      primary: {
        DEFAULT: '#4DB844',
        50: '#CBEBC9',
        100: '#BDE5BA',
        200: '#A1DA9C',
        300: '#84CF7E',
        400: '#68C460',
        500: '#4DB844',
        600: '#2A8823',
        700: '#2E6E28',
        800: '#1E481B',
        900: '#0F230D'
      },
      neutral: {
        DEFAULT: '#0E2B45',
        50: '#D4EAFF',
        100: '#BFDEF9',
        200: '#97C5EE',
        300: '#6EACE4',
        400: '#4993D6',
        500: '#287AC4',
        600: '#1F609A',
        700: '#17456F',
        800: '#0E2B45',
        900: '#0C2236'
      },
      warn: colors.orange,
      danger: colors.red,
      success: colors.green,
      info: colors.sky,
    },
    fontSize: {
      sm: '0.8rem',
      base: '1.125rem',
      xl: '1.25rem',
      '2xl': '1.563rem',
      '3xl': '1.953rem',
      '4xl': '2.441rem',
      '5xl': '3.25rem',
    },
    extend: {
      fontFamily: {
        sans: ['Fredoka', ...defaultTheme.fontFamily.sans],
      },
    },
  },
  variants: {},
  plugins: [require('@tailwindcss/typography')],
};