feat(header-bar): add expandable notification dot indicator [LIBS-868]

[arina-gutuboe]

Implements LIBS-868

This is a follow-up PR that ports the equivalent badge behavior from the ui PR.

Description
Replaces the persistent notification counter badge with a compact indicator dot when unread notifications exist. The full counter badge is shown temporarily after login (3 seconds) and on hover or keyboard focus, then collapses back to the dot.

Known issue
A bug has been identified in the header bar: bgColor always has a default value, which means it is always truthy. As a result, the element background is not darkened when the default color is used, and the hover opacity is always applied.

Note for the reviewer (out of scope)
In this PR, the hoverStyle variable in notification-icon was split into two separate variables to avoid applying opacity to the badge itself. The underlying hover logic, however, was intentionally left unchanged.

My initial thought is that, since this behavior has been in place for a while, it may not be worth reintroducing separate hover styles for the default and custom background colors.

I'm wondering if it would make more sense to either keep the current opacity-based approach for consistency and clean up the old hover logic, or consider a different approach that makes the hover state more noticeable.

A possible alternative would be to adopt an approach similar to useOnlineStatusStyles, where the hover background is adjusted based on contrast:

// "Lighten" on light backgrounds with black text; "darken" on dark backgrounds
const customBgColor =
    color === 'black' ? 'rgba(255,255,255, 0.2)' : 'rgba(0,0,0, 0.2)';

Screenshots
A dot indicator is displayed by default, and a badge appears on hover:

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud