From 1ba7bdc26bfb10b75eac53fc7524cf7ae1bc7996 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Sat, 11 Jul 2026 10:24:33 +0200
Subject: [PATCH] fix(material/sort): double focus indicators when strong focus
 is enabled

Fixes that the sort header both its usual focus indicator and the strong focus one when strong focus is enabled.

Fixes #33519.
---
 src/material/core/focus-indicators/_private.scss | 3 +++
 src/material/sort/sort-header.scss               | 4 ++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/material/core/focus-indicators/_private.scss b/src/material/core/focus-indicators/_private.scss
index c71b3131efcf..c557ac8d9078 100644
--- a/src/material/core/focus-indicators/_private.scss
+++ b/src/material/core/focus-indicators/_private.scss
@@ -61,6 +61,9 @@ $default-border-radius: 4px;
     'mat-focus-indicator-border-radius': $border-radius,
     'mat-focus-indicator-border-color': $border-color,
     'mat-focus-indicator-display': $display,
+    // This isn't used for styling the actual focus indicator, but can
+    // be used to hide conflicting indicators when strong focus is enabled.
+    'mat-focus-indicator-fallback-border-style': none,
   );
 
   @if (&) {
diff --git a/src/material/sort/sort-header.scss b/src/material/sort/sort-header.scss
index feca45fa0edc..004617d1b638 100644
--- a/src/material/sort/sort-header.scss
+++ b/src/material/sort/sort-header.scss
@@ -25,14 +25,14 @@ $fallbacks: m3-sort.get-tokens();
   // active, the arrow will always be shown so the user has no way of telling the difference.
   [mat-sort-header].cdk-keyboard-focused &,
   [mat-sort-header].cdk-program-focused & {
-    border-bottom: solid 1px currentColor;
+    border-bottom: var(--mat-focus-indicator-fallback-border-style, solid) 1px currentColor;
   }
 
   // For the sort-header element, default inset/offset values are necessary to ensure that
   // the focus indicator is sufficiently contrastive and renders appropriately.
   &::before {
     $border-width: var(--mat-focus-indicator-border-width, #{private.$default-border-width});
-    $offset: calc(#{$border-width} + 2px);
+    $offset: calc(#{$border-width} + 4px);
     margin: calc(#{$offset} * -1);
   }
 }