From 0dcc96a09de6b9f7ae85c1b52476528ba144d2ec Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Wed, 18 Feb 2026 20:04:44 +0100
Subject: [PATCH] Fix the color of the arrow on buttons when hovering in HCM
 (bug 2016311)

---
 web/views_manager.css | 31 ++++++++++++++++---------------
 1 file changed, 16 insertions(+), 15 deletions(-)

diff --git a/web/views_manager.css b/web/views_manager.css
index 60b320df3..952181cbc 100644
--- a/web/views_manager.css
+++ b/web/views_manager.css
@@ -270,13 +270,6 @@
             mask-repeat: no-repeat;
             mask-image: var(--views-manager-button-icon);
             background-color: var(--button-fg);
-
-            &:hover {
-              background-color: var(--button-hover-fg) !important;
-            }
-            &:active {
-              background-color: var(--button-active-fg) !important;
-            }
           }
 
           &::after {
@@ -289,11 +282,18 @@
             mask-position: center;
             mask-image: var(--views-manager-button-arrow-icon);
             background-color: var(--button-fg);
+          }
 
-            &:hover {
+          &:hover {
+            &::before,
+            &::after {
               background-color: var(--button-hover-fg) !important;
             }
-            &:active {
+          }
+
+          &:active {
+            &::before,
+            &::after {
               background-color: var(--button-active-fg) !important;
             }
           }
@@ -416,13 +416,14 @@
               mask-position: center;
               mask-image: var(--manage-button-icon);
               background-color: var(--button-fg);
+            }
 
-              &:hover {
-                background-color: var(--button-hover-fg) !important;
-              }
-              &:active {
-                background-color: var(--button-active-fg) !important;
-              }
+            &:hover::after {
+              background-color: var(--button-hover-fg) !important;
+            }
+
+            &:active::after {
+              background-color: var(--button-active-fg) !important;
             }
           }