diff --git a/core/themes/claro/css/components/vertical-tabs.css b/core/themes/claro/css/components/vertical-tabs.css index 85d0f0f82f38..2fded23efd8d 100644 --- a/core/themes/claro/css/components/vertical-tabs.css +++ b/core/themes/claro/css/components/vertical-tabs.css @@ -193,6 +193,12 @@ border-end-start-radius: var(--base-border-radius); } +@media (forced-colors: active) { + .vertical-tabs__menu-item.is-selected .vertical-tabs__menu-link::before { + border-inline-start: var(--vertical-tabs-menu-link--active-border-size) solid canvastext; + } +} + .vertical-tabs__menu-item.is-selected .vertical-tabs__menu-link:hover::before { background: none; } diff --git a/core/themes/claro/css/components/vertical-tabs.pcss.css b/core/themes/claro/css/components/vertical-tabs.pcss.css index 7c38c47e95cf..fbc0002f8a31 100644 --- a/core/themes/claro/css/components/vertical-tabs.pcss.css +++ b/core/themes/claro/css/components/vertical-tabs.pcss.css @@ -170,6 +170,10 @@ border-start-end-radius: 0; border-end-end-radius: 0; border-end-start-radius: var(--base-border-radius); + + @media (forced-colors: active) { + border-inline-start: var(--vertical-tabs-menu-link--active-border-size) solid canvastext; + } } .vertical-tabs__menu-item.is-selected .vertical-tabs__menu-link:hover::before {