// Import colors of default TailwindCSS theme
const { colors } = require('tailwindcss/defaultTheme');

module.exports = {
  theme: {
    // Manage breakpoints
    screens: {
      'md': '768px',
      'lg': '1024px',
      'xl': '1280px'
    },
    colors: {
      black: colors.black,
      white: colors.white,
      gray: colors.gray,
      // Add our custom "blue" and "green" colors
      blue: {
        '300': '#00b7ff',
        '400': '#04Aef0',
        '500': '#08a5e1',
        '600': '#0795d3',
        '700': '#0586c5'
      },
      green: {
        '300': '#25e471',
        '400': '#29d970',
        '500': '#2dcf6e',
        '600': '#30c46c',
        '700': '#33ba6a'
      }
    },
    // Extend default spacing with 72, 84 and 96 values
    extend: {
      spacing: {
        '72': '18rem',
        '84': '21rem',
        '96': '24rem'
      }
    }
  },
  variants: {},
  // Remove useless default utilities
  corePlugins: {
    float: false,
    visibility: false,
    objectPosition: false
  },
  plugins: []
};