From e3eba21b71d2b33bb8898c41efe22cd0f1f5d557 Mon Sep 17 00:00:00 2001
From: Marco Beretta <81851188+berry-13@users.noreply.github.com>
Date: Sat, 4 Jul 2026 17:17:33 +0200
Subject: [PATCH] fix: make forced-colors icon tint override the inline
 background color
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The forced-colors rule for .custom-icon-tint had no !important, so it
lost the cascade to the element's inline `background-color: currentColor`
and the masked glyph still blanked out in Windows High Contrast — the
exact regression the rule was meant to prevent. Verified in a real
forced-colors render: without !important the tinted icon is invisible;
with it the glyph paints in CanvasText and stays visible.
---
 client/src/style.css | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/client/src/style.css b/client/src/style.css
index 3bb925271c..fa6edb4e5d 100644
--- a/client/src/style.css
+++ b/client/src/style.css
@@ -374,13 +374,14 @@ html {
   }
 }
 
-/* A theme-tinted custom icon paints its glyph via `background-color:
+/* A theme-tinted custom icon paints its glyph via an inline `background-color:
  * currentColor` clipped by a CSS mask. Forced-colors (Windows High Contrast)
- * overrides `background-color` and would blank the glyph, so repaint it with
- * the `CanvasText` system color the UA preserves. */
+ * overrides `background-color` and would blank the glyph, so repaint it with the
+ * `CanvasText` system color the UA preserves. `!important` is required: the tint
+ * color is set inline on the element, so a class rule cannot win without it. */
 @media (forced-colors: active) {
   .custom-icon-tint {
-    background-color: CanvasText;
+    background-color: CanvasText !important;
   }
 }