import type { Config } from "tailwindcss";

export default <Config>{
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        bg: "#131313",
        panel: "#1a1a1a",
        surface: "#212121",
        row: "#272727",
        card: "#2d2d2d",
        "border-default": "#444444a8",
        secondary: "#656565",
        primary: "#737a81",
        text: "#ffffff",
        "text-muted": "#d4d4d4",
        accent: {
          DEFAULT: "#FA5C01",
          hover: "#d4581a",
          light: "rgba(236, 105, 37, 0.08)",
          border: "rgba(236, 105, 37, 0.25)",
          dark: "#b8461a",
        },
        success: "#4ade80",
        "success-bg": "rgba(74, 222, 128, 0.08)",
        error: "#f87171",
        "error-bg": "rgba(248, 113, 113, 0.08)",
        warning: "#fbbf24",
        info: "#60a5fa",
      },
      borderRadius: {
        sm: "2px",
        md: "3px",
        lg: "4px",
        xl: "4px",
        full: "9999px",
      },
      fontFamily: {
        sans: ["Inter", "system-ui", "sans-serif"],
      },
      boxShadow: {
        sm: "0 1px 2px 0 rgb(0 0 0 / 0.3)",
        md: "0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.3)",
        lg: "0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.3)",
        xl: "0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.3)",
      },
      transitionDuration: {
        fast: "150ms",
        base: "250ms",
        slow: "400ms",
      },
      maxWidth: {
        "7xl": "1280px",
      },
    },
  },
  plugins: [],
};