fix: highlight selected tab

- highlight selected tab

Contributes-to: #19140
Signed-off-by: Mariya George [email protected]

Author: mariyageorge01

packages/styles/scss/components/content-switcher/_content-switcher.scss

@@ -63,6 +63,8 @@
       @media (prefers-reduced-motion: reduce) {
         transition: none;
       }
+
+      @include high-contrast-mode('selected');
     }
 
     &:disabled::after {
@@ -302,6 +304,8 @@
     svg {
     z-index: 1;
     fill: $icon-inverse;
+
+    @include high-contrast-mode('icon-fill-selected');
   }
 
   .#{$prefix}--content-switcher--icon-only.#{$prefix}--content-switcher--sm

packages/styles/scss/utilities/_high-contrast-mode.scss

@@ -16,6 +16,10 @@
       fill: ButtonText;
     }
 
+    @if ($type == 'icon-fill-selected') {
+      fill: HighlightText;
+    }
+
     @if ($type == 'focus') {
       color: Highlight;
       outline: 1px solid Highlight;
@@ -26,7 +30,11 @@
     }
 
     @if ($type == 'bold-border') {
-      border: 2px solid Highlight;
+      border: 2px solid ButtonBorder;
+    }
+
+    @if ($type == 'selected') {
+      background-color: SelectedItem;
     }
 
     @if ($type == 'disabled') {