Squashed 'ai-context/trustgraph-templates/' content from commit 338a8ffa

git-subtree-dir: ai-context/trustgraph-templates
git-subtree-split: 338a8ffadb1439013071ae922e55ed2421f17025

src/theme/colors.ts

@@ -0,0 +1,72 @@
+// Primary palette (migrated from useGraphData.ts)
+export const palette = {
+  emerald: "#6EE7B7",
+  pink: "#F9A8D4",
+  blue: "#93C5FD",
+  amber: "#FCD34D",
+  purple: "#C4B5FD",
+  rose: "#FDA4AF",
+  cyan: "#67E8F9",
+  red: "#FCA5A5",
+  orange: "#F97316",
+};
+
+// Semantic colors
+export const semantic = {
+  success: palette.emerald,
+  error: "#f66",
+  warning: palette.orange,
+  info: palette.blue,
+  thinking: palette.blue,
+  observation: palette.purple,
+  answer: palette.emerald,
+  user: palette.amber,
+};
+
+// Text colors (dark theme)
+export const text = {
+  primary: "#ddd",
+  secondary: "#bbb",
+  muted: "#aaa",
+  subtle: "#888",
+  faint: "#666",
+  disabled: "#555",
+  hint: "#444",
+};
+
+// Surface/background colors
+export const surface = {
+  base: "#0A0A0F",
+  overlay: "rgba(15,15,20,0.95)",
+  overlayLight: "rgba(15,15,20,0.8)",
+  card: "rgba(255,255,255,0.02)",
+  cardHover: "rgba(255,255,255,0.04)",
+};
+
+// Border colors
+export const border = {
+  subtle: "rgba(255,255,255,0.04)",
+  default: "rgba(255,255,255,0.06)",
+  medium: "rgba(255,255,255,0.1)",
+  grid: "rgba(255,255,255,0.015)",
+};
+
+// Helper: Generate glow color from hex
+export function withGlow(hex: string, opacity = 0.4): string {
+  const r = parseInt(hex.slice(1, 3), 16);
+  const g = parseInt(hex.slice(3, 5), 16);
+  const b = parseInt(hex.slice(5, 7), 16);
+  return `rgba(${r},${g},${b},${opacity})`;
+}
+
+// Domain color palette (array for cycling)
+export const domainColors = [
+  { color: palette.emerald, glow: withGlow(palette.emerald) },
+  { color: palette.pink, glow: withGlow(palette.pink) },
+  { color: palette.blue, glow: withGlow(palette.blue) },
+  { color: palette.amber, glow: withGlow(palette.amber) },
+  { color: palette.purple, glow: withGlow(palette.purple) },
+  { color: palette.rose, glow: withGlow(palette.rose) },
+  { color: palette.cyan, glow: withGlow(palette.cyan) },
+  { color: palette.red, glow: withGlow(palette.red) },
+];