[UI] Fix status area bubble clipping in single-line mode

Replaced overflow: hidden with clip-path: inset() to prevent
absolute positioned hover bubbles from getting clipped while
still hiding the overflowing horizontal elements.

Closes #8316

Author: gajjararyan

src/ui/layout/layout.scss

@@ -289,7 +289,7 @@
     .l-shell__head--indicators-single-line & {
       flex-wrap: nowrap;
       justify-content: flex-start; // Overflow detection doesn't work with flex-end.
-      overflow: hidden;
+      clip-path: inset(-20px 0 -500px -500px);
 
       > *:first-child {
         margin-left: auto; // Mimics justify-content: flex-end when in single line mode.