/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./input.css",
    "./static/dist/output.css",
    "./osinacore/templates/**/*.html",
    "./customercore/templates/**/*.html",
  ],
  theme: {
    screens: {
      xs: '380px',
      xsm: '500px',
      sm: '550px',
      s: '650px',
      md: '798px',
      l: '960px',
      lg: '1110px',
      xlg1: '1200px',
      xlg: '1300px',
      xxlg1: '1350px',
      xxlg: '1390px',
      xl: '1536px',
      xll: '1600px',
      xxl: '1750px',
      k: '2400px',
    },
    fontFamily: {
      'poppinsLight': ['Poppins', 'sans-serif'],
      'poppinsExtraBold': ['Poppins ExtraBold', 'sans-serif'],
      'poppinsBold': ['Poppins Bold', 'sans-serif']
    },
    extend: {
      colors: {
        osiblue: '#20336b',
        secondosiblue: '#374a7a',
        fifthosiblue: '#929cb7',
      },
      keyframes: {
        bounce: {
          '0%, 100%': { transform: 'translateY(-0.5rem)' },
          '50%': { transform: 'translateY(0.5rem)' },
        },
        bounceX: {
          '0%, 100%': {
            transform: 'scale(1)',
            opacity: 1,
          },
          '50%': {
            transform: 'scale(0.95)',
            opacity: 1,
          },
        },
        blob: {
          "0%": {
            transform: "translate(0px, 0px) scale(1)",
          },
          "33%": {
            transform: "translate(30px, -50px) scale(1.1)",
          },
          "66%": {
            transform: "translate(-20px, 20px) scale(0.9)",
          },
          "100%": {
            transform: "tranlate(0px, 0px) scale(1)",
          },
        },
      },
      animation: {
        bounce: 'bounce 3s infinite',
        bouncePop: 'bounceX 4s infinite',
        blob: "blob 7s infinite",
      },
    },
  },
  plugins: [],
}