/** @type {import('tailwindcss').Config} */

module.exports = {
  content: [
    './src/App.{js,jsx,ts,tsx}',
    './src/screens/**/*.{js,jsx,ts,tsx}',
    './src/components/**/*.{js,jsx,ts,tsx}',
  ],
  theme: {
    fontSize: {
      BASE: '16px',
      sm: '14px',
      md: '18px',
      lg: '20px',
      xl: '24px',
      '2xl': '30px',
    },
    spacing: {
      1: '2px',
      2: '8px',
      3: '12px',
      4: '16px',
      5: '24px',
      6: '32px',
    },
    borderRadius: {
      none: '0',
      xs: '2px',
      sm: '8px',
      DEFAULT: '12px',
    },
    borderWidth: {
      DEFAULT: '2px',
      sm: '1px',
      0: '0',
      1: '1px',
      3: '3px',
      4: '4px',
      6: '6px',
      8: '8px',
    },
    extend: {
      colors: {
        primary: {
          DEFAULT: '#2B4885',
          text: '#000000',
          bg: '#ECF0F5',
        },
        secondary: {
          DEFAULT: '#E27100',
          text: '#5E5E5E',
          bg: '#FFFFFF',
        },
        disabled: {
          input: '#CCCCCC',
          button: '#5E5E5E',
        },
        divider: {
          DEFAULT: '#CCCCCC',
        },
        warning: {
          DEFAULT: '#F20000',
        },
      },
      fontFamily: {
        panton: ['Panton'],
        montserrat: ['Montserrat'],
      },
    },
  },
  plugins: [],
};
