From 413832d1a2b98ee700d614c1f4ac33206235f2aa Mon Sep 17 00:00:00 2001
From: Edouard Vanbelle <opensource@edouard.vanbelle.fr>
Date: Mon, 13 Apr 2026 10:17:12 +0200
Subject: [PATCH] refactor(css): remove use generic colors for
 language-selector + correct item selection color

---
 static/css/components/languageSelector.css |  2 +-
 static/css/layout/topbar.css               |  2 +-
 static/css/themes/dark.css                 | 41 ++--------------------
 3 files changed, 4 insertions(+), 41 deletions(-)

diff --git a/static/css/components/languageSelector.css b/static/css/components/languageSelector.css
index b02f6a41..70ec79ef 100644
--- a/static/css/components/languageSelector.css
+++ b/static/css/components/languageSelector.css
@@ -98,7 +98,7 @@
 }
 
 .language-option:hover {
-    background-color: var(--color-bg-alt);
+    background-color: var(--color-bg-hover);
 }
 
 .language-option.active {
diff --git a/static/css/layout/topbar.css b/static/css/layout/topbar.css
index b637fe26..687ce831 100644
--- a/static/css/layout/topbar.css
+++ b/static/css/layout/topbar.css
@@ -77,7 +77,7 @@
     padding: 12px 50px 12px 44px;
     border-radius: 12px;
     border: 2px solid var(--color-border);
-    background-color: var(--color-bg-hover);
+    background-color: var(--color-bg-input);
     font-size: 14px;
     height: 46px;
     color: var(--color-text-heading);
diff --git a/static/css/themes/dark.css b/static/css/themes/dark.css
index fe41f3ad..77e398a4 100644
--- a/static/css/themes/dark.css
+++ b/static/css/themes/dark.css
@@ -3,7 +3,7 @@
     --color-bg-page: #0f172a;
     --color-bg-surface: #1e293b;
     --color-bg-input: #0f172a;
-    --color-bg-hover: #162032;
+    --color-bg-hover: #334155;
     --color-bg-muted: #1a2540;
     --color-bg-subtle: #162032;
     --color-bg-alt: #0f172a;
@@ -79,7 +79,7 @@
 
     /* Items */
     --color-item-selected: #1a1520;
-    --color-item-hover-accent: #1f1926;
+    --color-item-hover-accent: #21262d;
 }
 
 /* ------------ */
@@ -588,43 +588,6 @@
     color: var(--color-border-medium);
 }
 
-/* ── languageSelector.css ── */
-[data-theme="dark"] .language-selector-toggle {
-    background-color: var(--color-bg-surface);
-    border-color: var(--color-border);
-    color: var(--color-text-heading);
-}
-
-[data-theme="dark"] .language-selector-toggle:hover {
-    background-color: var(--color-border);
-}
-
-[data-theme="dark"] .language-selector-dropdown {
-    background-color: var(--color-bg-surface);
-    border-color: var(--color-border);
-    box-shadow: 0 8px 30px var(--color-overlay);
-}
-
-[data-theme="dark"] .language-selector-dropdown::-webkit-scrollbar-thumb {
-    background-color: var(--color-border-medium);
-}
-[data-theme="dark"] .language-selector-dropdown::-webkit-scrollbar-thumb:hover {
-    background-color: var(--color-text-subtle);
-}
-
-[data-theme="dark"] .language-option {
-    color: var(--color-text-heading);
-}
-
-[data-theme="dark"] .language-option:hover {
-    background-color: var(--color-border);
-}
-
-[data-theme="dark"] .language-option.active {
-    background-color: var(--color-accent-ring);
-    color: var(--color-accent);
-}
-
 /* ── modals.css ── */
 [data-theme="dark"] .about-modal {
     background: var(--color-bg-surface);