From 902b005f323c385b078913443a80908b3eab0151 Mon Sep 17 00:00:00 2001
From: Cyril <c.gromoff@gmail.com>
Date: Wed, 14 Jan 2026 13:55:46 +0100
Subject: [PATCH] =?UTF-8?q?=E2=99=BF=EF=B8=8F(frontend)=20improve=20contra?=
 =?UTF-8?q?st=20for=20selected=20options?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

add dark inner border to enhance visibility and accessibility
---
 CHANGELOG.md                                | 1 +
 src/frontend/src/primitives/buttonRecipe.ts | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 920358eb..ce7be8ba 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,6 +17,7 @@ and this project adheres to
 ### Fixed
 
 - 🔒(backend) prevent automatic upgrade setuptools
+- ♿(frontend) improve contrast for selected options #863
 
 ## [1.3.0] - 2026-01-13
 
diff --git a/src/frontend/src/primitives/buttonRecipe.ts b/src/frontend/src/primitives/buttonRecipe.ts
index 76114bbb..086490e9 100644
--- a/src/frontend/src/primitives/buttonRecipe.ts
+++ b/src/frontend/src/primitives/buttonRecipe.ts
@@ -112,7 +112,8 @@ export const buttonRecipe = cva({
         },
         transition: 'box-shadow 0.2s ease-in-out',
         '&[data-selected]': {
-          boxShadow: 'token(colors.primary.400) 0px 0px 0px 3px inset',
+          boxShadow:
+            '0 0 0 3px token(colors.primary.600) inset, 0 0 0 5px white inset',
         },
         '&[data-disabled]': {
           backgroundColor: 'greyscale.100',