From c6fcc5419a046b70a27c13a574e52cb2637ec62b Mon Sep 17 00:00:00 2001
From: Marcos Caceres <caceres_m@apple.com>
Date: Sat, 9 May 2026 14:25:06 +1000
Subject: [PATCH] fix(styles/webidl): add dark mode color variants for contrast

Add prefers-color-scheme: dark overrides for WebIDL syntax colors.
The hardcoded dark-blue (#005a9c) and orangered (#ff4500) have poor
contrast on dark backgrounds. The header badge also gets a darker
blue background with light text.

Partially addresses #4871
---
 src/styles/webidl.css.js | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/src/styles/webidl.css.js b/src/styles/webidl.css.js
index f4db208983..f7047b9e23 100644
--- a/src/styles/webidl.css.js
+++ b/src/styles/webidl.css.js
@@ -136,4 +136,39 @@ a.idlEnumItem {
     visibility: hidden;
   }
 }
+
+@media (prefers-color-scheme: dark) {
+  .idlHeader {
+    background: #1a5276;
+    color: #e8e8e8;
+  }
+
+  .idlID,
+  .idlType,
+  .idlSuperclass {
+    color: #6cb4ee;
+  }
+
+  .idlName {
+    color: #ff7b4f;
+  }
+
+  .idlName a {
+    color: #ff7b4f;
+    border-bottom-color: #ff7b4f;
+  }
+
+  a.idlEnumItem {
+    color: #e8e8e8;
+    border-bottom-color: #555;
+  }
+
+  .extAttr {
+    color: #aaa;
+  }
+
+  .idlSectionComment {
+    color: #999;
+  }
+}
 `;