Issue Summary

When clicking a Jira Menu Header link (EG Dashboards, Projects, etc), a blue border is displayed. This can contrast in a disturbing way when Jira's default theme is customized via the "Look and Feel" feature.

Unable to reproduce in 7.13.16

Steps to Reproduce

1. Browse to Jira Admin -> System -> Look and Feel, then upload this logo image to customize the theme: ceilingcat.png. You will note that the theme is customised to a brown color.
2. Now, click "Projects" menu bar item

Expected Results

The border colour should follow the theme settings, thus be visually pleasing. It should probably follow the "Header navigation - highlight background colour"

Actual Results

The border is shown in a non-customisable blue

The CSS is

.aui-header .aui-header-logo>a:focus, .aui-header .aui-header-primary>.aui-nav>li>a:not(.aui-button):focus, .aui-header .aui-header-secondary>.aui-nav>li>a:not(.aui-button):focus: {
 box-shadow: inset 0 0 0 2px var(--aui-focus);
}

Which is in-turn set to

--aui-focus: #4c9aff;

Workaround

Add the following code block to the Announcement Banner. You can customize the #000 value to whatever HTML HEX color code you prefer

<!-- Workaround for JRASERVER-73031 -->
<style>
.aui-header .aui-header-logo>a:focus, .aui-header .aui-header-primary>.aui-nav>li>a:not(.aui-button):focus, .aui-header .aui-header-secondary>.aui-nav>li>a:not(.aui-button):focus {box-shadow: inset 0 0 0 2px #000}
</style>