Update focus styles for inputs

[rak-phillip]

Summary

This updates focus styles for inputs to match the updated design and colors.

Fixes #13522

Occurred changes and/or fixed issues

• Add new colors, waterhole & waterhole-60
• Change display of inputs from display: table to display: flex
• Update focus ring offset
• Add focus ring to select component

Technical notes summary

In order to resolve an issue with displaying the focus ring in Firefox, we had to update the display of the labeled input from table to flex. This change requires some additional style updates. For example, the password input needed some additional changes to properly display the show/hide toggle.

Areas or cases that should be tested

• Inputs & Selects
• Forms

Areas which could experience regressions

• Labeled Input

Screenshot/Video

Before

After

Checklist

• The PR is linked to an issue and the linked issue has a Milestone, or no issue is needed
• The PR has a Milestone
• The PR template has been filled out
• The PR has been self reviewed
• The PR has a reviewer assigned
• The PR has automated tests or clear instructions for manual tests and the linked issue has appropriate QA labels, or tests are not needed
• The PR has reviewed with UX and tested in light and dark mode, or there are no UX changes

[rak-phillip]

@kwwii let me know if you'd like to sync so we can give this one a review. I'm trying to limit the scope of this change to just the focus ring that inputs receive, but I'm also noting some inconsistencies with colors used for borders and labels (see screenshots). Changing these colors will have knock-on effects for other areas of Dashboard, so I'm looking for feedback on how much we really want to change at this point.

FYI - @edenhernandez-suse