// tailwind.config.ts import type { Config } from "tailwindcss"; // tailwind.config.js export default { darkMode: "class", // Enables class-based dark mode content: [ "./app/**/*.{js,ts,jsx,tsx}", "./app/components/**/*.{js,ts,jsx,tsx}", // Add other paths if necessary ], theme: { extend: { colors: { background: "var(--background)", foreground: "var(--foreground)", card: { DEFAULT: "var(--card)", foreground: "var(--card-foreground)", }, popover: { DEFAULT: "var(--popover)", foreground: "var(--popover-foreground)", }, primary: { DEFAULT: "var(--primary)", foreground: "var(--primary-foreground)", }, secondary: { DEFAULT: "var(--secondary)", foreground: "var(--secondary-foreground)", }, muted: { DEFAULT: "var(--muted)", foreground: "var(--muted-foreground)", }, accent: { DEFAULT: "var(--accent)", foreground: "var(--accent-foreground)", }, destructive: { DEFAULT: "var(--destructive)", foreground: "var(--destructive-foreground)", }, border: "var(--border)", input: "var(--input)", ring: "var(--ring)", cream: "#FDFCF8", sand: "#F3F1E7", stone: { 50: "#FAFAF9", 100: "#F5F5F4", 200: "#E7E5E4", 300: "#D6D3D1", 400: "#A8A29E", 500: "#78716C", 600: "#57534E", 700: "#44403C", 800: "#292524", 900: "#1C1917", }, liquid: { mint: "#A7F3D0", lavender: "#DDD6FE", blue: "#BFDBFE", rose: "#FECACA", yellow: "#FDE68A", peach: "#FED7AA", pink: "#FBCFE8", sky: "#BAE6FD", lime: "#D9F99D", coral: "#FCA5A5", purple: "#E9D5FF", teal: "#99F6E4", amber: "#FDE047", }, }, fontFamily: { sans: ["var(--font-inter)", "sans-serif"], mono: ["var(--font-roboto-mono)", "monospace"], }, }, }, plugins: [], } satisfies Config;