import type { Config } from "tailwindcss";

const config: Config = {
  darkMode: "class",
  content: [
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      fontFamily: {
        inter: ["Inter", "sans-serif"],
        onest: ["Onest", "sans-serif"],
        playfair: ["Playfair Display", "serif"],
        heading: ["Onest", "sans-serif"],
        sans: ["Inter", "sans-serif"],
      },
      colors: {
        surface: "var(--surface)",
        "surface-elevated": "var(--surface-elevated)",
        ink: "var(--ink)",
        "ink-soft": "var(--ink-soft)",
        muted: "var(--muted)",
        border: "var(--border)",
        page: "var(--page)",
        "page-bg": "var(--page-bg)",
        "sidebar-bg": "var(--sidebar-bg)",
        "sidebar-bg-deep": "var(--sidebar-bg-deep)",
        "brand-green": "var(--brand-green)",
        "success-green": "var(--success-green)",
        "success-bg": "var(--success-bg)",
        "warning-amber": "var(--warning-amber)",
        green: {
          DEFAULT: "var(--green)",
          deep: "var(--green-deep)",
        },
        blue: {
          DEFAULT: "var(--blue)",
          deep: "var(--blue-deep)",
        },
      },
      borderRadius: {
        card: "var(--radius-card)",
        pill: "var(--radius-pill)",
      },
      boxShadow: {
        card: "var(--shadow-card)",
      },
    },
  },
  plugins: [],
};

export default config;