Login: Replace hardcoded focus color with CSS variable

[HasnainAshfaq]

Summary

Fixes the focus color on login page links (← Go to [Site Name], Lost your password?, and the WP logo link) which were still using the old hardcoded color #043959 instead of the updated admin theme color variable.

• Replaces #043959 with var(--wp-admin-theme-color-darker-20) in the a:focus rule
• Replaces #043959 with var(--wp-admin-theme-color-darker-20) in the .login #nav a:focus, .login #backtoblog a:focus, .login h1 a:focus rule

The hover state for these same selectors already correctly uses var(--wp-admin-theme-color-darker-20) — this change makes focus consistent with hover.

Trac Ticket

https://core.trac.wordpress.org/ticket/64953

Test Plan

• Go to /wp-login.php
• Tab through the links: Lost your password? and ← Go to [Site Name]
• Confirm the focused link color matches the hover color (blue, matching the admin theme)
• Test with different admin color schemes (Modern, Light, etc.) — color should adapt via CSS variable
• Confirm no regressions on other login page states

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Core Committers: Use this line as a base for the props when committing in SVN:

Props hasnainashfaq, nimeshatxecurify.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[github-actions]

Test using WordPress Playground

The changes in this pull request can previewed and tested using a WordPress Playground instance.

WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser.

Some things to be aware of

• All changes will be lost when closing a tab with a Playground instance.
• All changes will be lost when refreshing the page.
• A fresh instance is created each time the link below is clicked.
• Every time this pull request is updated, a new ZIP file containing all changes is created. If changes are not reflected in the Playground instance,
  it's possible that the most recent build failed, or has not completed. Check the list of workflow runs to be sure.

For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation.

Test this pull request with WordPress Playground.

[nimesh-xecurify]

Thanks for the PR @HasnainAshfaq!

Could you also attach some screenshots in the PR, including before and after pics?

[HasnainAshfaq]

Thanks for the PR @HasnainAshfaq!

Could you also attach some screenshots in the PR, including before and after pics?

Thanks for the review @nimesh-xecurify! Here are the before and after screenshots:

Before (unfixed - focus color is hardcoded #043959, dark teal):

 

After (fixed - focus color uses var(--wp-admin-theme-color-darker-20), consistent with hover):
 

 

The change ensures the focus state matches the hover state and adapts correctly to all admin color schemes.

[Copilot]

Pull request overview

Updates the login screen link focus styles to use the admin theme CSS token instead of a legacy hardcoded hex color, ensuring the focus state matches the already-tokenized hover state and adapts to different admin color schemes.

Changes:

• Replaced #043959 with var(--wp-admin-theme-color-darker-20) for the global a:focus color.
• Replaced #043959 with var(--wp-admin-theme-color-darker-20) for focus styles on login navigation/back links and the logo link.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.