/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: "class",
  content: [
    "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
    "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      colors: {
        up: "var(--color-up)",
        down: "var(--color-down)",
        hot: "var(--color-hot)",
        bg: {
          primary: "var(--bg-primary)",
          secondary: "var(--bg-secondary)",
          card: "var(--bg-card)",
          elevated: "var(--bg-elevated)",
        },
        text: {
          primary: "var(--text-primary)",
          secondary: "var(--text-secondary)",
          muted: "var(--text-muted)",
        },
        accent: {
          amber: "var(--accent-amber)",
          cyan: "var(--accent-cyan)",
        },
        surface: {
          "1": "var(--surface-1)",
          "2": "var(--surface-2)",
          "3": "var(--surface-3)",
          "4": "var(--surface-4)",
        },
        border: {
          subtle: "var(--border-subtle)",
          default: "var(--border-default)",
        },
      },
      fontFamily: {
        display: ["'Outfit'", "system-ui", "sans-serif"],
        mono: ["'SF Mono'", "'JetBrains Mono'", "ui-monospace", "monospace"],
      },
      borderRadius: {
        "2xl": "16px",
        "3xl": "20px",
      },
      boxShadow: {
        card: "var(--shadow-card)",
        glow: "var(--shadow-glow)",
        "glow-sm": "var(--shadow-glow-sm)",
      },
      animation: {
        "fade-in-up": "fadeInUp 0.5s cubic-bezier(0.4, 0, 0.2, 1) both",
        shimmer: "shimmer 2s infinite",
        "pulse-ring": "pulse-ring 2s ease-in-out infinite",
      },
      keyframes: {
        fadeInUp: {
          from: { opacity: "0", transform: "translateY(12px)" },
          to: { opacity: "1", transform: "translateY(0)" },
        },
        shimmer: {
          "0%": { backgroundPosition: "-200% 0" },
          "100%": { backgroundPosition: "200% 0" },
        },
        pulseRing: {
          "0%, 100%": { transform: "scale(0.9)", opacity: "0.7" },
          "50%": { transform: "scale(1.05)", opacity: "1" },
        },
      },
    },
  },
  plugins: [],
};