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

module.exports = {
  darkMode: 'class',
  content: [
    './templates/**/*.html',
    './static/css/src/**/*.css',
    './parks/templates/**/*.html',
    './rides/templates/**/*.html',
    './core/templates/**/*.html',
    './accounts/templates/**/*.html',
    './**/static/**/*.js',
  ],
  theme: {
    extend: {
      colors: {
        primary: '#4f46e5', // Vibrant indigo
        secondary: '#e11d48', // Vibrant rose
        accent: '#8b5cf6'
      },
      fontFamily: {
        'sans': ['Poppins', 'sans-serif'],
      },
    },
  },
  plugins: [
    require("@tailwindcss/typography"),
    require("@tailwindcss/forms"),
    require("@tailwindcss/aspect-ratio"),
    require("@tailwindcss/container-queries"),
    plugin(function ({ addVariant }) {
      addVariant("htmx-settling", ["&.htmx-settling", ".htmx-settling &"]);
      addVariant("htmx-request", ["&.htmx-request", ".htmx-request &"]);
      addVariant("htmx-swapping", ["&.htmx-swapping", ".htmx-swapping &"]);
      addVariant("htmx-added", ["&.htmx-added", ".htmx-added &"]);
    }),
  ],
}