/** @type {import('tailwindcss').Config} */
module.exports = {
    content: [
        "./templates/**/*.html",
        "./apps/**/templates/**/*.html",
        "./static/js/**/*.js",
    ],
    theme: {
        extend: {
            colors: {
                primary: {
                    50: "#F0FDFA",
                    100: "#CCFBF1",
                    200: "#99F6E4",
                    300: "#5EEAD4",
                    400: "#2DD4BF",
                    500: "#14B8A6",
                    600: "#0F766E",
                    700: "#115E59",
                    800: "#134E4A",
                },
                neutral: {
                    50: "#F8FAFC",
                    100: "#F1F5F9",
                    200: "#E2E8F0",
                    300: "#CBD5E1",
                    400: "#94A3B8",
                    500: "#64748B",
                    600: "#475569",
                    700: "#334155",
                    800: "#1E293B",
                    900: "#0F172A",
                },
                success: { 600: "#16A34A" },
                warning: { 600: "#D97706" },
                danger: { 600: "#DC2626" },
                info: { 600: "#2563EB" },
            },
            fontFamily: {
                sans: ["Inter", "PingFang SC", "Microsoft YaHei", "sans-serif"],
            },
            zIndex: {
                60: "60",
                70: "70",
            },
            boxShadow: {
                xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
            },
            keyframes: {
                "slide-in-right": {
                    "0%": { transform: "translateX(100%)", opacity: "0" },
                    "100%": { transform: "translateX(0)", opacity: "1" },
                },
            },
            animation: {
                "slide-in-right": "slide-in-right 0.2s ease-out",
            },
        },
    },
    plugins: [],
};