From 453f68eb6f7cc7595082832430b85fd4f914433f Mon Sep 17 00:00:00 2001
From: DS123-ally <dineshseervi33716@gmail.com>
Date: Sun, 16 Aug 2026 10:51:32 +0530
Subject: [PATCH] Fix button focus styling

Signed-off-by: DS123-ally <dineshseervi33716@gmail.com>
---
 src/reusecore/Button/btn.style.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/reusecore/Button/btn.style.js b/src/reusecore/Button/btn.style.js
index ce5c981a88e96b..1d53f26ab0612e 100644
--- a/src/reusecore/Button/btn.style.js
+++ b/src/reusecore/Button/btn.style.js
@@ -18,12 +18,18 @@ const ButtonStyle = styled.button`
     color: ${props => props.theme.white };
     background-color: #00B39F;
     z-index: 999;
-    &:hover,
-    &:focus {
+    &:hover {
         color: white;
         background: ${props => props.theme.activeColor}; 
         box-shadow: 0 2px 10px ${props => props.theme.whiteFourToBlackFour};
     }
+    &:focus-visible {
+        outline: 3px solid ${props => props.theme.secondaryColor};
+        outline-offset: 3px;
+    }
+    &:focus:not(:focus-visible) {
+        outline: none;
+    }
     &:active{
         box-shadow: 0 2px 10px ${props => props.theme.blackFourToWhiteFour};
         transform: scale(0.98);