From eb1b9b1e90a96b8aa46dca826d7d68a403b84851 Mon Sep 17 00:00:00 2001
From: Alona Zherdetska <alionazhv@gmail.com>
Date: Wed, 18 Dec 2024 07:26:51 +0100
Subject: [PATCH] fix(accessibility): fixed visibility of the arrow-icon in
 high contrast mode

---
 packages/styles/src/components/form-select.scss | 13 +++++++++++++
 packages/styles/src/mixins/_forms.scss          |  3 +++
 2 files changed, 16 insertions(+)

diff --git a/packages/styles/src/components/form-select.scss b/packages/styles/src/components/form-select.scss
index b557ef2570..915150595d 100644
--- a/packages/styles/src/components/form-select.scss
+++ b/packages/styles/src/components/form-select.scss
@@ -52,6 +52,10 @@ tokens.$default-map: components.$post-select;
       @include utilities.high-contrast-mode {
         border-color: FieldText;
       }
+
+      @include utilities.high-contrast-mode-dark() {
+        @include forms.select-bg-image('selected-hcm', $mode: dark);
+      }
     }
 
     &:hover {
@@ -79,6 +83,15 @@ tokens.$default-map: components.$post-select;
     }
   }
 
+
+  @include utilities.high-contrast-mode-light() {
+    @include forms.select-bg-image('enabled-hcm', $mode: light);
+  }
+
+  @include utilities.high-contrast-mode-dark() {
+    @include forms.select-bg-image('enabled-hcm', $mode: dark);
+  }
+
   &.is-valid,
   &.is-invalid {
     &:not(:disabled) {
diff --git a/packages/styles/src/mixins/_forms.scss b/packages/styles/src/mixins/_forms.scss
index 0854d6adf0..1003563f09 100644
--- a/packages/styles/src/mixins/_forms.scss
+++ b/packages/styles/src/mixins/_forms.scss
@@ -41,6 +41,9 @@
     'selected-dark': #fff,
     'disabled-light': #696864,
     'disabled-dark': #fff,
+    'enabled-hcm-light': #050400,
+    'enabled-hcm-dark': #fff,
+    'selected-hcm-dark': #fff,
   );
 
   @if ($validation == 'valid') {