import type { Config } from "tailwindcss";

/**
 * Tailwind CSS v4 uses CSS-based configuration via @theme directives in globals.css.
 * This file is provided for compatibility with tooling that expects a tailwind.config.ts.
 *
 * Active theme tokens are defined in src/app/globals.css under @theme inline { ... }.
 *
 * Custom color palettes:
 *   - leaf-green  (50–900)  — primary brand, healthy plant states
 *   - soil-brown  (50–900)  — earth tones, secondary surfaces
 *   - warning-amber (50–900) — alerts, disease indicators
 *
 * Extended spacing: 72, 80, 96
 */
const config: Config = {
  content: ["./src/**/*.{js,ts,jsx,tsx,mdx}"],
  theme: {
    extend: {
      fontFamily: {
        sans: ["var(--font-inter)", "system-ui", "sans-serif"],
      },
      colors: {
        "leaf-green": {
          50: "#f0fdf4",
          100: "#dcfce7",
          200: "#bbf7d0",
          300: "#86efac",
          400: "#4ade80",
          500: "#22c55e",
          600: "#16a34a",
          700: "#15803d",
          800: "#166534",
          900: "#14532d",
        },
        "soil-brown": {
          50: "#fdf8f6",
          100: "#f2e8e5",
          200: "#e6d5ce",
          300: "#d4b5a9",
          400: "#c0907e",
          500: "#a3705a",
          600: "#8a5a48",
          700: "#724a3c",
          800: "#5e3e34",
          900: "#4d342b",
        },
        "warning-amber": {
          50: "#fffbeb",
          100: "#fef3c7",
          200: "#fde68a",
          300: "#fcd34d",
          400: "#fbbf24",
          500: "#f59e0b",
          600: "#d97706",
          700: "#b45309",
          800: "#92400e",
          900: "#78350f",
        },
      },
      spacing: {
        "72": "18rem",
        "80": "20rem",
        "96": "24rem",
      },
    },
  },
  plugins: [],
};

export default config;