/**
 * The application palette.
 *
 * Colours live here rather than inline so that a change to, say, the danger red
 * happens in one place. Modal components still carry small local palettes of
 * their own — their key names mean different things (a modal's `bg` is a raised
 * surface, the app's `bg` is the page behind it), so they are deliberately not
 * folded in here.
 */

export interface Theme {
  bg: string;
  sidebar: string;
  sidebarActive: string;
  card: string;
  toolbar: string;
  border: string;
  borderLight: string;
  text: string;
  textSec: string;
  muted: string;
  faint: string;
  accent: string;
  accentSoft: string;
  accentText: string;
  danger: string;
  success: string;
  warning: string;
  inputBg: string;
  dashBg: string;
}

const DARK: Theme = {
  bg: "#0d1117",
  sidebar: "#010409",
  sidebarActive: "#161b22",
  card: "#161b22",
  toolbar: "#161b22",
  border: "#30363d",
  borderLight: "#21262d",
  text: "#e6edf3",
  textSec: "#c9d1d9",
  muted: "#8b949e",
  faint: "#484f58",
  accent: "#388bfd",
  accentSoft: "#388bfd22",
  accentText: "#58a6ff",
  danger: "#f85149",
  success: "#3fb950",
  warning: "#d29922",
  inputBg: "#0d1117",
  dashBg: "#0d1117",
};

const LIGHT: Theme = {
  bg: "#f6f8fa",
  sidebar: "#ffffff",
  sidebarActive: "#eef2ff",
  card: "#ffffff",
  toolbar: "#ffffff",
  border: "#d0d7de",
  borderLight: "#e5e7eb",
  text: "#1f2328",
  textSec: "#424a53",
  muted: "#656d76",
  faint: "#afb8c1",
  accent: "#0969da",
  accentSoft: "#0969da18",
  accentText: "#0550ae",
  danger: "#cf222e",
  success: "#1a7f37",
  warning: "#9a6700",
  inputBg: "#f6f8fa",
  dashBg: "#f0f2f5",
};

export const makeTheme = (dark: boolean): Theme => (dark ? DARK : LIGHT);

export const FONT_UI = "'DM Sans',sans-serif";
export const FONT_SERIF = "'Newsreader',Georgia,serif";