From ad847dcb2bfd1ea8b08a1bfce6572a0a30532a83 Mon Sep 17 00:00:00 2001
From: Felix Schneider <99918022+trueberryless@users.noreply.github.com>
Date: Wed, 3 Jun 2026 23:14:53 +0200
Subject: [PATCH] fix: override topics css styles to fix light mode colors
 (#52)

* fix: override topics css styles to fix light mode colors

* fix: topic background color in light mode

Inspired-by: HiDeoo <494699+hideoo@users.noreply.github.com>
---
 src/styles/starlight.css | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/styles/starlight.css b/src/styles/starlight.css
index bbaedea..3f3efac 100644
--- a/src/styles/starlight.css
+++ b/src/styles/starlight.css
@@ -193,13 +193,13 @@
     .sl-link-button>svg {
       fill: var(--color-white-100);
     }
+  }
+}
 
+/* this rule must not be layered because the Starlight Sidebar Topics plugin doesn't use Cascade Layers */
+:root[data-theme="light"] {
+  a:is(.starlight-sidebar-topics-current, :hover, :focus-visible)
     .starlight-sidebar-topics-icon {
-      background-color: var(--color-gray-20);
-    }
-
-    starlight-menu-button button {
-        background-color: var(--color-gray-20);
-    }
+    background-color: var(--sl-color-accent-low);
   }
 }
-- 
2.51.2