From 59477c62f9606742ecddb986177d5355c9266e54 Mon Sep 17 00:00:00 2001
From: Deepak Kumar <deepak.kumar@rtcamp.com>
Date: Mon, 27 Jul 2026 22:46:37 +0530
Subject: [PATCH] Administration: A11y: Use a shape for the 'Collapse menu'
 focus style

---
 src/wp-admin/css/admin-menu.css     | 6 ++++--
 src/wp-admin/css/colors/_admin.scss | 5 +++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/wp-admin/css/admin-menu.css b/src/wp-admin/css/admin-menu.css
index 2b665f583484f..3747613282be1 100644
--- a/src/wp-admin/css/admin-menu.css
+++ b/src/wp-admin/css/admin-menu.css
@@ -470,12 +470,14 @@ ul#adminmenu > li.current > a.current:after {
 	cursor: pointer;
 }
 
-#collapse-button:hover {
+#collapse-button:hover,
+#collapse-button:focus {
 	color: #72aee6;
+	box-shadow: inset 4px 0 0 0 currentColor;
+	transition: box-shadow .1s linear;
 }
 
 #collapse-button:focus {
-	color: #72aee6;
 	/* Only visible in Windows High Contrast mode */
 	outline: 1px solid transparent;
 	outline-offset: -1px;
diff --git a/src/wp-admin/css/colors/_admin.scss b/src/wp-admin/css/colors/_admin.scss
index 313666e3ded73..2d10323c2749d 100644
--- a/src/wp-admin/css/colors/_admin.scss
+++ b/src/wp-admin/css/colors/_admin.scss
@@ -375,12 +375,13 @@ ul#adminmenu > li.current > a.current:after {
 /* Admin Menu: collapse button */
 
 #collapse-button {
-    color: variables.$menu-collapse-text;
+	color: variables.$menu-collapse-text;
 }
 
 #collapse-button:hover,
 #collapse-button:focus {
-    color: variables.$menu-submenu-focus-text;
+	color: variables.$menu-highlight-text;
+	background: variables.$menu-highlight-background;
 }
 
 /* Admin Bar */