/** @type {import('tailwindcss').Config} */
export default {
  content: ["./index.html", "./src/**/*.{ts,tsx}"],
  theme: {
    extend: {
      colors: {
        surface: {
          base: "#1a1a2e",
          raised: "#1e1e35",
          recessed: "#16162a",
          overlay: "#22223a",
        },
        accent: {
          DEFAULT: "#f59e0b",
          bright: "#fbbf24",
          dim: "#d97706",
          glow: "#f59e0b40",
        },
        status: {
          running: "#22c55e",
          stopped: "#6b7280",
          crashed: "#ef4444",
          starting: "#f59e0b",
          restarting: "#3b82f6",
        },
        text: {
          primary: "#e2e8f0",
          secondary: "#94a3b8",
          muted: "#475569",
          inverse: "#1a1a2e",
        },
      },
      fontFamily: {
        sans: ["Inter", "system-ui", "sans-serif"],
        mono: ["JetBrains Mono", "Fira Code", "monospace"],
      },
      boxShadow: {
        "neu-raised": "4px 4px 8px #0d0d1f, -4px -4px 8px #27273f",
        "neu-raised-lg": "8px 8px 16px #0d0d1f, -8px -8px 16px #27273f",
        "neu-recessed": "inset 4px 4px 8px #0d0d1f, inset -4px -4px 8px #27273f",
        "glow-green": "0 0 8px #22c55e, 0 0 16px #22c55e40",
        "glow-amber": "0 0 8px #f59e0b, 0 0 16px #f59e0b40",
        "glow-red": "0 0 8px #ef4444, 0 0 16px #ef444440",
        "glow-gray": "0 0 4px #6b7280",
        "glow-blue": "0 0 8px #3b82f6, 0 0 16px #3b82f640",
      },
      borderRadius: {
        neu: "12px",
      },
      animation: {
        "pulse-slow": "pulse 3s ease-in-out infinite",
        "glow-pulse": "glow-pulse 2s ease-in-out infinite",
      },
      keyframes: {
        "glow-pulse": {
          "0%, 100%": { opacity: "1" },
          "50%": { opacity: "0.6" },
        },
      },
    },
  },
  plugins: [],
};