From 4dc1790c53e31f627cbc7b3f6020e21e49d90cb6 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Fri, 6 Sep 2024 08:17:38 +0200
Subject: [PATCH 1/2] fix(material/core): option showing double selected
 indicator in high contrast mode

Fixes that `mat-option` was showing a checkmark and a dot for selected options in high contrast mode. The dot is still necessary if the single selection indicator isn't shown.
---
 src/material/core/option/option.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/material/core/option/option.scss b/src/material/core/option/option.scss
index 6d4641a635af..e067624a0d4f 100644
--- a/src/material/core/option/option.scss
+++ b/src/material/core/option/option.scss
@@ -157,7 +157,7 @@ $_side-padding: 16px;
     // In single selection mode, the selected option is indicated by changing its
     // background color, but that doesn't work in high contrast mode. We add an
     // alternate indication by rendering out a circle.
-    &.mdc-list-item--selected:not(.mat-mdc-option-multiple)::after {
+    &.mdc-list-item--selected:not(:has(.mat-mdc-option-pseudo-checkbox))::after {
       $size: 10px;
       content: '';
       position: absolute;
@@ -170,7 +170,7 @@ $_side-padding: 16px;
       border-radius: $size;
     }
 
-    [dir='rtl'] &.mdc-list-item--selected:not(.mat-mdc-option-multiple)::after {
+    [dir='rtl'] &.mdc-list-item--selected:not(:has(.mat-mdc-option-pseudo-checkbox))::after {
       right: auto;
       left: $_side-padding;
     }

From 4392f0a8c7f4cb27bb34790757b7de53efa4e637 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Mon, 9 Sep 2024 07:02:12 +0200
Subject: [PATCH 2/2] fix(material/list): remove unnecessary high contrast
 styles

Removes some styles from the list meant for high contrast mode that we inherited from MDC. They aren't necessary, because we have our own way of handling high contrast styles and they were actively making `mat-option` worse by adding extra borders in several cases.
---
 .../list/_list-inherited-structure.scss       | 26 -------------------
 src/material/list/list.scss                   |  3 +++
 2 files changed, 3 insertions(+), 26 deletions(-)

diff --git a/src/material/list/_list-inherited-structure.scss b/src/material/list/_list-inherited-structure.scss
index b6c060100425..44b4b67c228c 100644
--- a/src/material/list/_list-inherited-structure.scss
+++ b/src/material/list/_list-inherited-structure.scss
@@ -1,4 +1,3 @@
-@use '@angular/cdk';
 @use '../core/style/vendor-prefixes';
 @use '../core/tokens/m2/mdc/list' as tokens-mdc-list;
 @use '../core/tokens/token-utils';
@@ -93,31 +92,6 @@
         margin-top: 16px;
       }
     }
-
-    &.mdc-list-item--selected::before,
-    &.mdc-list-item--selected:focus::before,
-    &:not(.mdc-list-item--selected):focus::before {
-      position: absolute;
-      box-sizing: border-box;
-      width: 100%;
-      height: 100%;
-      top: 0;
-      left: 0;
-      border: 1px solid transparent;
-      border-radius: inherit;
-      content: '';
-      pointer-events: none;
-
-      @include cdk.high-contrast {
-        border-color: CanvasText;
-      }
-    }
-
-    &.mdc-list-item--selected:focus::before,
-    &.mdc-list-item--selected::before {
-      border-width: 3px;
-      border-style: double;
-    }
   }
 
   a.mdc-list-item {
diff --git a/src/material/list/list.scss b/src/material/list/list.scss
index b379c695c87a..95098cebdf4c 100644
--- a/src/material/list/list.scss
+++ b/src/material/list/list.scss
@@ -116,6 +116,9 @@ a.mdc-list-item--activated {
   content: '';
   opacity: 0;
   pointer-events: none;
+
+  // This comes up in some internal implementations.
+  border-radius: inherit;
 }
 
 // The MDC-based list items already use the `::before` pseudo element for the standard