/** @type {import('tailwindcss').Config} */
module.exports = {
  // NOTE: Update this to include the paths to all files that contain Nativewind classes.
    content: [
        "./app/**/*.{js,jsx,ts,tsx}",
        "./screens/**/*.{js,jsx,ts,tsx}",
        "./components/**/*.{js,jsx,ts,tsx}",
    ],

    presets: [require("nativewind/preset")],

    darkMode: "media", // follows system preference
    theme: {
        extend: {
            colors: {
                // ── Brand accent ──────────────────────────────
                accent: {
                    DEFAULT: "#C4622D",
                    dark: "#E07B45",
                    muted: "#E8A882",
                },

                // ── Light theme surfaces ───────────────────────
                parchment: {
                    50:  "#FDFAF5",
                    100: "#F7F3EB",
                    200: "#EDE7D9",
                    300: "#DDD5C4",
                    400: "#C9BEA9",
                },

                // ── Dark theme surfaces ────────────────────────
                obsidian: {
                    50:  "#2A2825",
                    100: "#1F1E1B",
                    200: "#161513",
                    300: "#0E0D0C",
                    400: "#080807",
                },

                // ── Semantic aliases (used in components) ──────
                surface: {
                    light: "#FFFFFF",
                    dark:  "#1C1B19",
                },
                border: {
                    light: "#E8E2D5",
                    dark:  "#2C2A27",
                },
                ink: {
                    light: "#1A1714",
                    dark:  "#F0EDE8",
                },
                muted: {
                    light: "#8A8278",
                    dark:  "#706D67",
                },
            },

            fontFamily: {
                // Use with expo-font or react-native-google-fonts
                display: ["Playfair Display", "serif"],
                sans:    ["DM Sans", "sans-serif"],
                mono:    ["DM Mono", "monospace"],
            },

            borderRadius: {
                "4xl": "2rem",
            },

            spacing: {
                "18": "4.5rem",
                "22": "5.5rem",
            },

            boxShadow: {
                card:      "0 1px 4px rgba(0,0,0,0.08), 0 4px 16px rgba(0,0,0,0.06)",
                "card-dark": "0 1px 4px rgba(0,0,0,0.4), 0 4px 16px rgba(0,0,0,0.3)",
                tab:       "0 -1px 0 rgba(0,0,0,0.06)",
            },
        },
    },
    plugins: [],
};