/** @type {import('tailwindcss').Config} */
const plugin = require("tailwindcss/plugin");

module.exports = {
  content: [
    "./app/**/*.{js,ts,jsx,tsx,mdx}", // Note the addition of the `app` directory.
    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",

    // Or if using `src` directory:
    "./src/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      textShadow: {
        DEFAULT:
          "0 0 10px #fff, 0 0 20px #fff, 0 0 30px #00440b, 0 0 40px #00440b, 0 0 50px #0a7c00, 0 0 60px #00440b, 0 0 70px #00440b",
      },
      colors: {
        "stachowiak-green": {
          50: "#eeffef",
          100: "#d8ffdc",
          200: "#b4febb",
          300: "#79fc87",
          400: "#38f04c",
          500: "#0ed926",
          600: "#05b419",
          700: "#088d18",
          800: "#0c6f19",
          900: "#0c5b17",
          950: "#00440b", //stachowiak-green
        },
      },
    },
  },
  plugins: [
    plugin(function ({ matchUtilities, theme }) {
      matchUtilities(
        {
          "text-shadow": (value) => ({
            textShadow: value,
          }),
        },
        { values: theme("textShadow") }
      );
    }),
  ],
};