import type { Config } from "tailwindcss";

/*
 * Tokens are shared with site/ and adminsite/ — same names, same values, in
 * app/globals.css. Nothing here may hold a hex value: if a colour needs to
 * change it changes in globals.css, in all three apps, in one commit.
 *
 * The colours keep this app's own names rather than site/'s. site/ says ink
 * and rule because it is a document; this is a console, so it says
 * text-primary and border, and every screen already reads that way. Same
 * colours, honest names on both sides — the aliasing adminsite/ does for
 * licence state, one level further.
 *
 * `<alpha-value>` is what makes bg-danger/10 and border-accent/50 compile.
 * It only works against the RGB channel variables, which is why globals.css
 * stores channels and derives the plain --token from them.
 */
const withAlpha = (channels: string) => `rgb(var(${channels}) / <alpha-value>)`;

const config: Config = {
    content: ["./pages/**/*.{js,ts,jsx,tsx,mdx}", "./components/**/*.{js,ts,jsx,tsx,mdx}", "./app/**/*.{js,ts,jsx,tsx,mdx}"],
    theme: {
        extend: {
            colors: {
                background: withAlpha("--ground-rgb"),
                logo: withAlpha("--logo-rgb"),
                surface: withAlpha("--panel-rgb"),
                "surface-2": withAlpha("--panel-2-rgb"),
                border: withAlpha("--rule-rgb"),
                "border-soft": withAlpha("--rule-soft-rgb"),
                "text-primary": withAlpha("--ink-rgb"),
                "text-secondary": withAlpha("--ink-2-rgb"),
                "text-tertiary": withAlpha("--ink-3-rgb"),
                accent: withAlpha("--accent-rgb"),
                "accent-hover": withAlpha("--accent-hover-rgb"),
                "accent-ink": withAlpha("--accent-ink-rgb"),
                success: withAlpha("--up-rgb"),
                warning: withAlpha("--pend-rgb"),
                danger: withAlpha("--down-rgb"),
                "danger-hover": withAlpha("--down-hover-rgb"),
                // The floor beneath the ground: install one-liners, key blobs,
                // run logs — surfaces showing machine output, not interface.
                well: withAlpha("--well-rgb"),
                // Attention that is not yet failure — an unsaved workflow, a
                // step about to run. Same amber as warning, because it is the
                // same signal at a different distance.
                signal: withAlpha("--pend-rgb"),
                "signal-ink": withAlpha("--accent-ink-rgb"),
                // Shell identity on step chips. Reusing the semantic pair is
                // safe here because the chip is labelled "bash" or "pwsh" in
                // text — the colour is recognition, never the whole message.
                bash: withAlpha("--up-rgb"),
                pwsh: withAlpha("--accent-rgb"),
            },
            fontFamily: {
                sans: ["ui-sans-serif", "system-ui", "-apple-system", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", "sans-serif"],
                mono: ["ui-monospace", "Cascadia Mono", "SF Mono", "JetBrains Mono", "Menlo", "Consolas", "monospace"],
            },
            /*
             * site/ is built on 4px, and the console inherits it. The scale
             * steps are collapsed rather than the ~140 rounded-lg/md/xl classes
             * across the app being rewritten: every one of them meant "a panel
             * corner", and this is where that decision now lives. rounded-full
             * is untouched — status dots and pills still need it.
             */
            borderRadius: {
                sm: "3px",
                DEFAULT: "4px",
                md: "4px",
                lg: "4px",
                xl: "6px",
                "2xl": "6px",
            },
            boxShadow: {
                panel: "var(--shadow)",
            },
        },
    },
    plugins: [],
};

export default config;