Pagination active page-link lacks noticeable focus styling in Firefox

Created by: tmorehouse

• Operating system and version : Any
• Browser and version: Firefox (and maybe others)
• Reduced test case: https://codepen.io/tmorehouse/pen/MOQXyd

The current CSS for pagination .page-item.active .page-link does not include any noticeable focus styling when using Firefox, which makes it difficult for keyboard only users to know if the active link is focused or not.

Tab through the page links in the codepen to see the issue (and one possible solution) using Firefox

I've used the following workaround CSS to provide focus styling for the active page-link:

.pagination .page-item.active .page-link:focus {
    box-shadow: 0 0 0 3px rgba(0,123,255,.5);
    z-index: 2;
}

Currently the active page link looks like this with focused and not focused (the change in outline is negligible):

With the proposed focus styling it looks as follows (which uses similar styling as the primary button focus styling):

Another quick workaround is to place the class .btn-primary (without the .btn class) on the active page-link (the <a> tag), which produces the same effect when focused.