/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",
    "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
    "./plugins/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      colors: {
        backgroundPrimary: {
          100: "#FFFBE6",
        },
        primary: {
          50: "#f0fdf5",
          100: "#dcfce9",
          200: "#bbf7d3",
          300: "#86efb0",
          400: "#4ade85",
          500: "#22c563",
          600: "#16a34e",
          700: "#15803f",
          800: "#166535",
          900: "#14532d",
          950: "#052e15",
        },

        secondary: {
          50: "#f8f8ed",
          100: "#edefd8",
          200: "#dbe0b6",
          300: "#c8cf94",
          400: "#abb566",
          500: "#8e9a48",
          600: "#6f7a36",
          700: "#555e2d",
          800: "#454c28",
          900: "#3c4225",
          950: "#1f2310",
        },

        textMain: {
          100: "#444444",
        },
        mainDisable: {
          100: "#888888",
        },
        info: {
          100: "#2B91EF",
          200: "#0061bd",
        },
        danger: {
          100: "#FF2C2C",
        },
        body: {
          100: "#EEEEEE",
        },
      },
    },

    screens: {
      xs: "290px",
      sm: "640px",
      // => @media (min-width: 640px) { ... }

      md: "768px",
      // => @media (min-width: 768px) { ... }

      lg: "1024px",
      // => @media (min-width: 1024px) { ... }

      xl: "1440px",
      // => @media (min-width: 1280px) { ... }

      "2xl": "1536px",
      // => @media (min-width: 1536px) { ... }
    },

    animation: {
      "infinite-scroll": "infinite-scroll 200s linear infinite",
    },

    keyframes: {
      "infinite-scroll": {
        from: { transform: "translateX(0)" },
        to: { transform: "translateX(-100%)" },
      },
    },
  },
  plugins: [],
  corePlugins: {
    backdropOpacity: false,
    backgroundOpacity: false,
    borderOpacity: false,
    divideOpacity: false,
    ringOpacity: false,
    textOpacity: false,
  },
};