/** @type {import('tailwindcss').Config} */
export default {
  content: ["./index.html", "./src/**/*.{ts,tsx}"],
  // The result cards use a dynamic class `stagger-${index}` for the
  // per-card animation delay. Tailwind's content scanner can't statically
  // resolve that template literal, so without the safelist the four
  // matching rules from src/index.css get purged from the build.
  safelist: [{ pattern: /^stagger-[0-4]$/ }],
  darkMode: "class",
  theme: {
    extend: {
      colors: {
        // Dark mode (default) palette
        bg: {
          DEFAULT: "#080810",
          card: "#111118",
          hover: "#16161f",
        },
        // Light mode palette (applied via :root when not .dark)
        bgLight: {
          DEFAULT: "#f8fafc",
          card: "#ffffff",
        },
        border: {
          DEFAULT: "rgba(255, 255, 255, 0.06)",
        },
        borderLight: {
          DEFAULT: "rgba(0, 0, 0, 0.08)",
        },
        accent: {
          primary: "#7c3aed",
          secondary: "#06b6d4",
          secondaryLight: "#0891b2",
        },
        fg: {
          DEFAULT: "#e2e8f0",
          muted: "#64748b",
          dark: "#0f172a",
        },
        tag: "#a78bfa",
      },
      animation: {
        "gradient-shift": "gradient-shift 8s ease infinite",
        "fade-up": "fade-up 300ms ease-out forwards",
        "pulse-slow": "pulse 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite",
      },
      keyframes: {
        "gradient-shift": {
          "0%, 100%": { backgroundPosition: "0% 50%" },
          "50%": { backgroundPosition: "100% 50%" },
        },
        "fade-up": {
          "0%": { opacity: "0", transform: "translateY(20px)" },
          "100%": { opacity: "1", transform: "translateY(0)" },
        },
      },
      fontFamily: {
        mono: [
          "ui-monospace",
          "SFMono-Regular",
          "Menlo",
          "Monaco",
          "Consolas",
          "monospace",
        ],
      },
    },
  },
  plugins: [],
};