From 3354a7942686b341eeabc32cda6ea21a3dd55c83 Mon Sep 17 00:00:00 2001
From: sdrozdsap <163305268+sdrozdsap@users.noreply.github.com>
Date: Tue, 1 Oct 2024 10:00:13 +0100
Subject: [PATCH] fix(a11y): Focus outline overlapping with breadcrumbs
 separator (#19243)

---
 .../scss/components/content/navigation/_breadcrumb.scss      | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/projects/storefrontstyles/scss/components/content/navigation/_breadcrumb.scss b/projects/storefrontstyles/scss/components/content/navigation/_breadcrumb.scss
index e0d41baa325..ceb6f11d27f 100644
--- a/projects/storefrontstyles/scss/components/content/navigation/_breadcrumb.scss
+++ b/projects/storefrontstyles/scss/components/content/navigation/_breadcrumb.scss
@@ -74,6 +74,11 @@ html[dir='rtl'] cx-breadcrumb nav span:not(:last-child):after {
 
           @include forFeature('a11yImproveContrast') {
             color: var(--cx-color-primary);
+
+            &:focus {
+              outline-offset: -4px;
+              box-shadow: inset 0 0 0 2px var(--cx-color-inverse);
+            }
           }
         }
       }