export type ThemeId =
  | "zai-light"
  | "zai-dark"
  | "chatgpt-dark"
  | "zai-sky"
  | "zai-violet"
  | "zai-emerald"
  | "zai-rose"
  | "absolutely-dark"
  | "raycast-dark"
  | "midnight"
  | "slate"
  | "graphite"
  | "espresso"
  | "forest"
  | "nordic-light"
  | "solarized-dark"
  | "paper";

export type FontFamilyId = "openai" | "geist" | "system" | "avenir" | "serif" | "mono" | "rounded";

export interface ThemeTokens {
  bg: string;
  fg: string;
  dim: string;
  border: string;
  surface: string;
  accent: string;
  hl1: string;
  hl2: string;
  hl3: string;
  err: string;
}

export interface ThemeMeta {
  id: ThemeId;
  name: string;
  description: string;
  group: string;
  swatches: [string, string, string, string];
  tokens: ThemeTokens;
  fontFamilyId: FontFamilyId;
  ui?: Partial<ThemeUiTokens>;
}

export interface ThemeUiTokens {
  "surface-2": string;
  "surface-3": string;
  rail: string;
  border: string;
  separator: string;
  hover: string;
  active: string;
  composer: string;
  "composer-footer": string;
  bubble: string;
}

const THEME_FONT_FAMILY_BY_ID: Partial<Record<ThemeId, FontFamilyId>> = {
  "chatgpt-dark": "openai",
  "absolutely-dark": "system",
  "raycast-dark": "system",
  midnight: "avenir",
  slate: "system",
  espresso: "serif",
  forest: "rounded",
  "nordic-light": "avenir",
  "solarized-dark": "system",
  paper: "serif",
};

const createTheme = (
  id: ThemeId,
  name: string,
  description: string,
  group: string,
  tokens: ThemeTokens,
): ThemeMeta => ({
  id,
  name,
  description,
  group,
  swatches: [tokens.bg, tokens.surface, tokens.accent, tokens.fg],
  tokens,
  fontFamilyId: THEME_FONT_FAMILY_BY_ID[id] ?? "geist",
});

// Canonical surfaces, expressed as concrete values (the bootstrap script
// writes them inline before paint). These mirror the `.theme-zai-*` blocks in
// tokens.css exactly.
const ZAI_LIGHT: ThemeTokens = {
  bg: "#ffffff",
  fg: "#1a1c1f",
  dim: "#5f6165",
  border: "#1a1c1f14",
  surface: "#ffffff",
  accent: "#0d0d0d",
  hl1: "#5f6165",
  hl2: "#8c8e91",
  hl3: "#8f8f8f",
  err: "#e02e2a",
};

const ZAI_DARK: ThemeTokens = {
  bg: "#181818",
  fg: "#ffffff",
  dim: "#ffffffb3",
  border: "#ffffff14",
  surface: "#212121",
  accent: "#ffffff",
  hl1: "#ffffffb3",
  hl2: "#ffffff80",
  hl3: "#8f8f8f",
  err: "#ff6764",
};

const CHATGPT_DARK: ThemeTokens = {
  bg: "#191919",
  fg: "#d9d9d8",
  dim: "#a0a09f",
  border: "#ffffff0d",
  surface: "#202020",
  accent: "#d9d9d8",
  hl1: "#a0a09f",
  hl2: "#7b7b7b",
  hl3: "#626262",
  err: "#ff6764",
};

const CHATGPT_DARK_UI: Partial<ThemeUiTokens> = {
  "surface-2": "#202020",
  "surface-3": "#282828",
  rail: "#212121",
  border: "#ffffff0d",
  separator: "#ffffff08",
  hover: "#282828",
  active: "#2e2e2e",
  composer: "#282828",
  "composer-footer": "#282828",
  bubble: "#232323",
};

// Accent variants keep the canonical dark surfaces; only the brand
// accent + hl1 (the data/links color) shift.
const skyAccent = (base: ThemeTokens): ThemeTokens => ({
  ...base,
  accent: "#339cff",
});

const violetAccent = (base: ThemeTokens): ThemeTokens => ({
  ...base,
  accent: "#ad7bf9",
});

const emeraldAccent = (base: ThemeTokens): ThemeTokens => ({
  ...base,
  accent: "#40c977",
});

const roseAccent = (base: ThemeTokens): ThemeTokens => ({
  ...base,
  accent: "#ff6764",
});

// Derive the supporting tokens from a bg/fg/surface/accent quartet so new
// themes stay consistent with the workbench ratios.
const darkTheme = (bg: string, fg: string, surface: string, accent: string): ThemeTokens => ({
  bg,
  fg,
  dim: `${fg}b3`,
  border: `${fg}14`,
  surface,
  accent,
  hl1: `${fg}b3`,
  hl2: `${fg}80`,
  hl3: "#8f8f8f",
  err: "#ff6764",
});

const lightTheme = (bg: string, fg: string, surface: string, accent: string): ThemeTokens => ({
  bg,
  fg,
  dim: `${fg}b3`,
  border: `${fg}1f`,
  surface,
  accent,
  hl1: `${fg}b3`,
  hl2: `${fg}80`,
  hl3: "#8f8f8f",
  err: "#e02e2a",
});

export const THEMES: ThemeMeta[] = [
  createTheme(
    "zai-dark",
    "Studio Dark",
    "Unified charcoal canvas, hairline borders, one blue accent",
    "Studio",
    ZAI_DARK,
  ),
  createTheme(
    "zai-light",
    "Studio Light",
    "Pure white canvas, near-black brand, one blue accent",
    "Studio",
    ZAI_LIGHT,
  ),
  {
    ...createTheme(
      "chatgpt-dark",
      "ChatGPT Dark",
      "ChatGPT app charcoal surfaces paired with OpenAI Sans",
      "Reference",
      CHATGPT_DARK,
    ),
    ui: CHATGPT_DARK_UI,
  },
  createTheme(
    "zai-sky",
    "Sky",
    "Dark with a sky-blue brand accent",
    "Accents",
    skyAccent(ZAI_DARK),
  ),
  createTheme(
    "zai-violet",
    "Violet",
    "Dark with a violet brand accent",
    "Accents",
    violetAccent(ZAI_DARK),
  ),
  createTheme(
    "zai-emerald",
    "Emerald",
    "Dark with an emerald brand accent",
    "Accents",
    emeraldAccent(ZAI_DARK),
  ),
  createTheme("zai-rose", "Rose", "Dark with a rose brand accent", "Accents", roseAccent(ZAI_DARK)),
  createTheme(
    "absolutely-dark",
    "Absolutely Dark",
    "Warm charcoal with a terracotta accent, ported from Codex",
    "Ported",
    darkTheme("#2d2d2b", "#f9f9f7", "#373735", "#cc7d5e"),
  ),
  createTheme(
    "raycast-dark",
    "Raycast Dark",
    "Near-black launcher tones with an electric blue accent",
    "Ported",
    darkTheme("#141414", "#ffffff", "#1e1e1e", "#4fa3f8"),
  ),
  createTheme(
    "midnight",
    "Midnight",
    "Blue-black canvas with a soft azure accent",
    "Atmosphere",
    darkTheme("#0d1117", "#e6edf3", "#161b22", "#58a6ff"),
  ),
  createTheme(
    "slate",
    "Slate",
    "Cool graphite blues with a periwinkle accent",
    "Atmosphere",
    darkTheme("#12151a", "#e2e8f0", "#1a1f27", "#7aa2f7"),
  ),
  createTheme(
    "graphite",
    "Graphite",
    "Ultra-dark neutral with a pure white accent",
    "Atmosphere",
    darkTheme("#0d0d0d", "#ededed", "#171717", "#ffffff"),
  ),
  createTheme(
    "espresso",
    "Espresso",
    "Roasted browns with a caramel accent",
    "Atmosphere",
    darkTheme("#1a1512", "#f2e9df", "#241d18", "#d9954a"),
  ),
  createTheme(
    "forest",
    "Forest",
    "Deep evergreen with a spring-green accent",
    "Atmosphere",
    darkTheme("#0f1512", "#e8f2ec", "#18211b", "#4fd08a"),
  ),
  createTheme(
    "nordic-light",
    "Nordic Light",
    "Cool daylight neutrals with crisp indigo controls",
    "Studio",
    lightTheme("#f4f6f8", "#20242a", "#ffffff", "#5e6ad2"),
  ),
  createTheme(
    "solarized-dark",
    "Solarized Dark",
    "Low-contrast blue-green surfaces with a cyan accent",
    "Reference",
    darkTheme("#002b36", "#eee8d5", "#073642", "#2aa198"),
  ),
  createTheme(
    "paper",
    "Paper",
    "Warm paper white with a burnt-sienna accent",
    "Studio",
    lightTheme("#faf8f2", "#2a2723", "#ffffff", "#b05f2d"),
  ),
];