From 66366682608ef9757657824f0b62f0a882a94ae9 Mon Sep 17 00:00:00 2001
From: Jonathan Miller <jmiller-moko@noreply.git.mokoconsulting.tech>
Date: Tue, 14 Apr 2026 20:50:10 -0500
Subject: [PATCH] Add Unicode icon fallback for a11y, fix duplicate label color

- Add wheelchair symbol fallback when FA7 glyph fails to render
- Fix duplicate #mokoThemeFab .label rule missing color: #fff

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/media/css/template.css |  1 +
 src/media/js/template.js   | 12 +++++++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/media/css/template.css b/src/media/css/template.css
index 5b82fc3..1365d55 100644
--- a/src/media/css/template.css
+++ b/src/media/css/template.css
@@ -17389,6 +17389,7 @@ button#mokoThemeSwitch {
 #mokoThemeFab .label {
   user-select: none;
   font-size: .875rem;
+  color: #fff;
 }
 
 #mokoThemeFab.debug-outline {
diff --git a/src/media/js/template.js b/src/media/js/template.js
index f1fb442..49ae3ae 100644
--- a/src/media/js/template.js
+++ b/src/media/js/template.js
@@ -292,7 +292,17 @@
 		toggle.className = "a11y-toggle";
 		toggle.setAttribute("aria-label", "Accessibility options");
 		toggle.setAttribute("aria-expanded", "false");
-		toggle.appendChild(faIcon("fa-solid fa-universal-access"));
+		var a11yIcon = faIcon("fa-solid fa-universal-access");
+		// Unicode fallback if FA7 glyph doesn't render (e.g. FA6/FA7 conflict)
+		setTimeout(function () {
+			var cs = win.getComputedStyle(a11yIcon, "::before");
+			if (!cs.content || cs.content === "none" || cs.content === '""' || cs.content === '"" / ""') {
+				a11yIcon.className = "";
+				a11yIcon.textContent = "\u267F";
+				a11yIcon.style.fontSize = "1.1rem";
+			}
+		}, 500);
+		toggle.appendChild(a11yIcon);
 
 		// Panel
 		var panel = doc.createElement("div");