Issue Summary

Focus indicator of the "Save" button has an insufficient color contrast ratio.

Steps to Reproduce

1. Open the "Home" page.
2. Navigate to the "Issues" button in the header section and activate it.
3. Navigate to the "Create issues" link and activate it.
4. Now, navigate to the "Save as " button in the main content area and activate it > a modal appears.
5. Navigate using 'Tab' key to the mentioned button in the modal dialog.
6. Use any color contrast testing tool to check the color contrast.
7. Observe that the focus indicator of the mentioned button has an insufficient color contrast.

Screenshot

Actual Results

The #388BFF focus indicator of "Save" button present in the "Save Filter" modal dialog that becomes available after activating "Save as" button in the main content area has an insufficient color contrast ratio of 2:1 with #0055CC inner background.

Foreground: #388BFF
Background: #0055CC
Contrast ratio: 2:1

This will make it difficult for the people with low vision and color blindness to identify the focus indicator for the button that has insufficient color contrast.

Expected Results

The contrast ratio between the foreground color of the focus indicator and its inner background color should be sufficient. Ensure that the color contrast ratio of the focus indicator for all user interface controls is 3:1 with the foreground and background color.

Alternatively, set the CSS outline-offset property for the mentioned button to ensure that clear focus indication is available for users.

Workaround

Currently there is no known workaround for this behavior. A workaround will be added here when available.

Environment

MacBook Pro (16-inch, 2021)
macOs Sonoma 14.7
Chrome - Version 131.0.6778.86 (Official Build) (arm64)
Firefox- Version 134.0 (64-bit) 
Safari- Version 18.1.1 (20619.2.8.11.12)
JAWS- Version 2023
NVDA- Version 2021.2 
Voiceover - Version Latest