//#region src/components/organisms/ai/AIMermaidDiagram/mermaid-theme.ts
/**
* Resolve a CSS custom property to a hex color string at runtime.
* Falls back to the provided default if the variable is not available.
*/
/**
* Build a color palette by resolving CSS custom properties at runtime.
* Uses a single getComputedStyle() call for efficiency, then reads
* all token values from the cached CSSStyleDeclaration object.
* Falls back to hard-coded hex when tokens are unavailable (SSR, missing vars).
*/
function resolveColors(el) {
	if (typeof window === "undefined") return {
		blue500: "#3b82f6",
		blue600: "#2563eb",
		gray900: "#0f172a",
		gray50: "#f8fafc",
		gray300: "#cbd5e1",
		gray500: "#475569",
		gray200: "#e2e8f0",
		gray700: "#334155",
		gray800: "#1e293b",
		gray100: "#f1f5f9"
	};
	const styles = getComputedStyle(el ?? document.documentElement);
	const r = (token, fallback) => styles.getPropertyValue(token).trim() || fallback;
	return {
		blue500: r("--blue-500", "#3b82f6"),
		blue600: r("--blue-600", "#2563eb"),
		gray900: r("--gray-900", "#0f172a"),
		gray50: r("--gray-50", "#f8fafc"),
		gray300: r("--gray-300", "#cbd5e1"),
		gray500: r("--gray-500", "#475569"),
		gray200: r("--gray-200", "#e2e8f0"),
		gray700: r("--gray-700", "#334155"),
		gray800: r("--gray-800", "#1e293b"),
		gray100: r("--gray-100", "#f1f5f9")
	};
}
/**
* Get mermaid configuration based on theme
*
* Maps design system tokens to mermaid theme variables.
* Colors are resolved from CSS custom properties at runtime so the
* diagram follows whatever palette the host page provides. Hard-coded
* fallbacks are used when getComputedStyle cannot read the tokens.
*/
function getMermaidConfig(theme, el) {
	const isDark = theme === "dark";
	const c = resolveColors(el);
	return {
		startOnLoad: false,
		securityLevel: "strict",
		suppressErrorRendering: true,
		theme: "base",
		themeVariables: {
			primaryColor: isDark ? c.blue500 : c.blue600,
			primaryTextColor: isDark ? c.gray50 : c.gray900,
			primaryBorderColor: isDark ? c.gray500 : c.gray300,
			secondaryColor: isDark ? c.gray700 : c.gray200,
			secondaryTextColor: isDark ? c.gray100 : c.gray800,
			secondaryBorderColor: isDark ? c.gray500 : c.gray300,
			tertiaryColor: isDark ? c.gray800 : c.gray100,
			tertiaryTextColor: isDark ? c.gray200 : c.gray700,
			tertiaryBorderColor: isDark ? c.gray700 : c.gray200,
			background: isDark ? c.gray900 : "#ffffff",
			mainBkg: isDark ? c.gray800 : c.gray50,
			textColor: isDark ? c.gray200 : c.gray800,
			titleColor: isDark ? c.gray50 : c.gray900,
			lineColor: isDark ? c.gray500 : "#94a3b8",
			nodeBorder: isDark ? c.gray500 : c.gray300,
			noteBkgColor: isDark ? c.gray700 : "#fef9c3",
			noteTextColor: isDark ? c.gray100 : c.gray800,
			noteBorderColor: isDark ? c.gray500 : "#fde047",
			clusterBkg: isDark ? c.gray800 : c.gray100,
			clusterBorder: isDark ? c.gray700 : c.gray200,
			actorBkg: isDark ? c.gray800 : c.gray50,
			actorBorder: isDark ? c.gray500 : c.gray300,
			actorTextColor: isDark ? c.gray100 : c.gray800,
			actorLineColor: isDark ? "#64748b" : "#94a3b8",
			signalColor: isDark ? "#64748b" : "#64748b",
			signalTextColor: isDark ? c.gray200 : c.gray800,
			labelBoxBkgColor: isDark ? c.gray700 : c.gray100,
			labelBoxBorderColor: isDark ? c.gray500 : c.gray300,
			labelTextColor: isDark ? c.gray100 : c.gray800,
			loopTextColor: isDark ? c.gray100 : c.gray800,
			activationBkgColor: isDark ? c.blue500 : "#dbeafe",
			activationBorderColor: isDark ? c.blue600 : c.blue500,
			sequenceNumberColor: isDark ? c.gray50 : c.gray900,
			classText: isDark ? c.gray200 : c.gray800,
			labelColor: isDark ? c.gray200 : c.gray800,
			entityBorder: isDark ? c.gray500 : c.gray300,
			entityBkg: isDark ? c.gray800 : c.gray50,
			entityTextColor: isDark ? c.gray100 : c.gray800,
			relationColor: isDark ? "#64748b" : "#94a3b8",
			relationLabelColor: isDark ? c.gray200 : c.gray800,
			relationLabelBackground: isDark ? c.gray900 : "#ffffff",
			attributeBackgroundColorOdd: isDark ? c.gray700 : c.gray100,
			attributeBackgroundColorEven: isDark ? c.gray800 : c.gray50,
			sectionBkgColor: isDark ? c.gray700 : c.gray200,
			altSectionBkgColor: isDark ? c.gray800 : c.gray100,
			sectionBkgColor2: isDark ? c.gray800 : c.gray50,
			gridColor: isDark ? c.gray700 : c.gray200,
			doneTaskBkgColor: isDark ? "#22c55e" : "#86efac",
			doneTaskBorderColor: isDark ? "#16a34a" : "#22c55e",
			activeTaskBkgColor: isDark ? c.blue500 : "#93c5fd",
			activeTaskBorderColor: isDark ? c.blue600 : c.blue500,
			critBkgColor: isDark ? "#ef4444" : "#fecaca",
			critBorderColor: isDark ? "#dc2626" : "#ef4444",
			taskBkgColor: isDark ? c.gray500 : c.gray300,
			taskBorderColor: isDark ? "#64748b" : "#94a3b8",
			taskTextColor: isDark ? c.gray100 : c.gray800,
			taskTextOutsideColor: isDark ? c.gray200 : c.gray800,
			taskTextLightColor: isDark ? c.gray50 : c.gray900,
			todayLineColor: isDark ? "#f472b6" : "#ec4899",
			pieStrokeColor: isDark ? c.gray900 : "#ffffff",
			pieLegendTextColor: isDark ? c.gray200 : c.gray800,
			pieSectionTextColor: isDark ? c.gray50 : c.gray900,
			pieStrokeWidth: "2px",
			pieOuterStrokeWidth: "2px",
			pie1: isDark ? c.blue500 : c.blue600,
			pie2: isDark ? "#22c55e" : "#16a34a",
			pie3: isDark ? "#f59e0b" : "#d97706",
			pie4: isDark ? "#ef4444" : "#dc2626",
			pie5: isDark ? "#a855f7" : "#9333ea",
			pie6: isDark ? "#ec4899" : "#db2777",
			pie7: isDark ? "#06b6d4" : "#0891b2",
			pie8: isDark ? "#84cc16" : "#65a30d",
			pie9: isDark ? "#f97316" : "#ea580c",
			pie10: isDark ? "#6366f1" : "#4f46e5",
			pie11: isDark ? "#14b8a6" : "#0d9488",
			pie12: isDark ? "#f43f5e" : "#e11d48",
			mindmapColors: isDark ? [
				c.blue500,
				"#22c55e",
				"#f59e0b",
				"#ef4444",
				"#a855f7",
				"#ec4899"
			] : [
				c.blue600,
				"#16a34a",
				"#d97706",
				"#dc2626",
				"#9333ea",
				"#db2777"
			],
			git0: isDark ? c.blue500 : c.blue600,
			git1: isDark ? "#22c55e" : "#16a34a",
			git2: isDark ? "#f59e0b" : "#d97706",
			git3: isDark ? "#ef4444" : "#dc2626",
			git4: isDark ? "#a855f7" : "#9333ea",
			git5: isDark ? "#ec4899" : "#db2777",
			git6: isDark ? "#06b6d4" : "#0891b2",
			git7: isDark ? "#84cc16" : "#65a30d",
			gitBranchLabel0: isDark ? c.gray50 : c.gray900,
			gitBranchLabel1: isDark ? c.gray50 : c.gray900,
			gitBranchLabel2: isDark ? c.gray50 : c.gray900,
			gitBranchLabel3: isDark ? c.gray50 : c.gray900,
			gitBranchLabel4: isDark ? c.gray50 : c.gray900,
			gitBranchLabel5: isDark ? c.gray50 : c.gray900,
			gitBranchLabel6: isDark ? c.gray50 : c.gray900,
			gitBranchLabel7: isDark ? c.gray50 : c.gray900,
			commitLabelColor: isDark ? c.gray50 : c.gray900,
			commitLabelBackground: isDark ? c.gray700 : c.gray200,
			quadrant1Fill: isDark ? c.blue500 : "#dbeafe",
			quadrant2Fill: isDark ? "#22c55e" : "#dcfce7",
			quadrant3Fill: isDark ? "#f59e0b" : "#fef3c7",
			quadrant4Fill: isDark ? "#ef4444" : "#fee2e2",
			quadrant1TextFill: isDark ? c.gray50 : c.gray800,
			quadrant2TextFill: isDark ? c.gray50 : c.gray800,
			quadrant3TextFill: isDark ? c.gray50 : c.gray800,
			quadrant4TextFill: isDark ? c.gray50 : c.gray800,
			quadrantPointFill: isDark ? c.gray200 : c.gray800,
			quadrantPointTextFill: isDark ? c.gray200 : c.gray800,
			quadrantExternalBorderStrokeFill: isDark ? c.gray500 : c.gray300,
			quadrantInternalBorderStrokeFill: isDark ? c.gray700 : c.gray200,
			quadrantTitleFill: isDark ? c.gray50 : c.gray900,
			quadrantXAxisTextFill: isDark ? c.gray200 : c.gray800,
			quadrantYAxisTextFill: isDark ? c.gray200 : c.gray800,
			cScale0: isDark ? c.blue500 : c.blue600,
			cScale1: isDark ? "#22c55e" : "#16a34a",
			cScale2: isDark ? "#f59e0b" : "#d97706",
			cScale3: isDark ? "#ef4444" : "#dc2626",
			cScale4: isDark ? "#a855f7" : "#9333ea",
			cScale5: isDark ? "#ec4899" : "#db2777",
			cScale6: isDark ? "#06b6d4" : "#0891b2",
			cScale7: isDark ? "#84cc16" : "#65a30d",
			fontFamily: "ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\"",
			fontSize: "14px"
		},
		flowchart: {
			htmlLabels: true,
			curve: "basis",
			padding: 15,
			nodeSpacing: 50,
			rankSpacing: 50
		},
		sequence: {
			diagramMarginX: 50,
			diagramMarginY: 10,
			actorMargin: 50,
			width: 150,
			height: 65,
			boxMargin: 10,
			boxTextMargin: 5,
			noteMargin: 10,
			messageMargin: 35,
			mirrorActors: true,
			bottomMarginAdj: 1,
			showSequenceNumbers: false
		},
		gantt: {
			titleTopMargin: 25,
			barHeight: 20,
			barGap: 4,
			topPadding: 50,
			leftPadding: 75,
			gridLineStartPadding: 35,
			fontSize: 11,
			sectionFontSize: 11,
			numberSectionStyles: 4
		},
		er: {
			diagramPadding: 20,
			layoutDirection: "TB",
			minEntityWidth: 100,
			minEntityHeight: 75,
			entityPadding: 15,
			stroke: isDark ? c.gray500 : c.gray300,
			fill: isDark ? c.gray800 : c.gray50,
			fontSize: 12
		},
		pie: { textPosition: .75 },
		mindmap: {
			padding: 10,
			maxNodeWidth: 200
		},
		class: { titleTopMargin: 25 },
		state: {
			dividerMargin: 10,
			sizeUnit: 5,
			padding: 8,
			textHeight: 10,
			titleShift: -15,
			noteMargin: 10,
			forkWidth: 70,
			forkHeight: 7,
			miniPadding: 2,
			fontSizeFactor: 5.02,
			fontSize: 24,
			labelHeight: 16,
			edgeLengthFactor: "20",
			compositTitleSize: 35,
			radius: 5
		}
	};
}
//#endregion
export { getMermaidConfig };

//# sourceMappingURL=index428.js.map