From 677a3c925b888dd1dd274214956241177f7c2b8a Mon Sep 17 00:00:00 2001
From: Lisbet Alvarez <107949262+lisbet-alvarez@users.noreply.github.com>
Date: Wed, 10 Jun 2026 16:26:55 -0700
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20color=20of=20search=20can?=
 =?UTF-8?q?cel=20button=20icon=20(#3314)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 addons/rose/addon/styles/hds/themes/dark-mode/index.scss | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/addons/rose/addon/styles/hds/themes/dark-mode/index.scss b/addons/rose/addon/styles/hds/themes/dark-mode/index.scss
index 0bd8dcfc4..e09307330 100644
--- a/addons/rose/addon/styles/hds/themes/dark-mode/index.scss
+++ b/addons/rose/addon/styles/hds/themes/dark-mode/index.scss
@@ -250,6 +250,13 @@
   /* stylelint-enable selector-class-pattern */
 }
 
+// Override to improve visibility of search clear ("x") icon.
+@mixin dark-mode-search-clear-override {
+  input[type='search']::-webkit-search-cancel-button {
+    filter: invert(1);
+  }
+}
+
 @media (prefers-color-scheme: dark) {
   // Apply dark style overrides to scrollbar when system is in dark mode and app theme is not set to light
   html:has(.ember-application:not(.rose-theme-light)) {
@@ -265,6 +272,7 @@
     @include dark-mode-app-header-override;
     @include dark-mode-app-side-nav-override;
     @include dark-mode-codemirror-override;
+    @include dark-mode-search-clear-override;
   }
 }
 
@@ -282,4 +290,5 @@ html:has(.ember-application.rose-theme-dark) {
   @include dark-mode-app-header-override;
   @include dark-mode-app-side-nav-override;
   @include dark-mode-codemirror-override;
+  @include dark-mode-search-clear-override;
 }