fix: 🤔 sd-button shows white focus border before blue focus ring

[auroraVasconcelos]

Current behavior

When focusing a button, a white border briefly appears around the button before the correct blue focus state is rendered. This is only visible with non-white backgrounds, and is noticeable when focusing via keyboard.
This causes a visual “flash” and inconsistent focus styling.

Expected behavior

When the button receives focus, it should directly show the correct blue focus border/ring, with no intermediate white border.

Steps to reproduce

• Open the Button documentation in Storybook.
• Change the story background to any color that is not white.
• Move focus to the button using the keyboard (e.g. with Tab).
• Observe the focus styles on the button.

Screen record:

Screen.Recording.2025-12-10.at.09.10.12.mov

Technical Information

DoR

• Item has business value
• Item has been estimated by the team
• Item is clear and well-defined
• Item dependencies have been identified