diff --git a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-dark-linux.png
index cdc0ca0662..9bdf13b804 100644
--- a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:882f4f7b683213539b2ac10d5e1cc6b7bbe4344fdb1a0eb36a9c0c07d1b1a520
-size 28973
+oid sha256:2867082f690e10b5ca178bf9e4b5b6c141b862e8f6c7dbd5883ed0135ed6932b
+size 28864
diff --git a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-light-linux.png
index d79dce7ff6..939eb1e987 100644
--- a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--normal-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:552a8cfd363c87f3caa2a3f83d909da41c632124b84a909761da99cd8baaacbe
-size 28123
+oid sha256:61e8941f5d27e7e9717678e0fb8b5949efa31a8c62692732aabbb6f6ac303d25
+size 28140
diff --git a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-dark-linux.png
index 371d7cc737..c6ccc3c53f 100644
--- a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d8583b950c90c3d15ba2e6171d2435594126f267c4bf0a4a07776f9b8cd421c9
-size 12757
+oid sha256:7ac3b8a64e5088a9a0800f692d45f163e519a2b0033ca7e5a95a5ff79835d00f
+size 12748
diff --git a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-light-linux.png
index 9f0b2300f6..44453c910a 100644
--- a/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-primary.spec.ts-snapshots/si-navbar--si-navbar-primary-end--small-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a6d0cf0f24f29e0a307caf5b6422ef5ebadc68e2cb5eb2dd9e5543b2c80a814e
-size 11997
+oid sha256:d5a77bae4fab81bedb58fda2b8f10a2da1e6197cf21cc4c9b1c4e7825b7a4865
+size 11995
diff --git a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-dark-linux.png
index e3e0bc88ae..51cb05a9ab 100644
--- a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d973a8311393b33ee15e037feaae2559763131dc2a2914411d0752e4d2a07fe8
-size 14689
+oid sha256:88e59dc09e6a930b00bf95c6fd9dc8550a9109ede7ce7f0a94db27977e4a9201
+size 14632
diff --git a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-light-linux.png
index c4cce21ac7..fded32749c 100644
--- a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:94ad331314d38574a07ba9f0333089419122c1274e9cbc5df9587b0e351dca2a
-size 14047
+oid sha256:b0823adf80e554b1ea762b0ff3f8bc065c1135cf60cd545feeb94f7d09c02976
+size 13997
diff --git a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-dark-linux.png
index 2d2f45d426..c6d9e42607 100644
--- a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ccbb463085564140ef7a98b42e308c8ccdd95e160401e91767e2944e5ef79b6c
-size 20864
+oid sha256:8c87ced7d726e8e190c37566e88eb9c7654b31e57213b3caac49a8fb652876b6
+size 20848
diff --git a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-light-linux.png
index e51ce09ebf..f3addd066c 100644
--- a/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-vertical-legacy.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-legacy--collapsed-flyout-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2dfd36b912bac6f04834dc06401cff046762521212529e7568885efeb522eebc
-size 20380
+oid sha256:c13d95830f1a8279ad279e46e1176a2e7cf203e09dfd8ee31d174fb90e44bcfc
+size 20322
diff --git a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-dark-linux.png
index 5f7f0ef47b..51c74ac1e2 100644
--- a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ec9f3ae7a622c8b769f6f916b633a6553bf066cc3f25edd3706fc052554424c4
-size 21830
+oid sha256:86437ff623ca16e5bccc901a0760042b88171260395ace46fe7e8b6de3e3dcbd
+size 21844
diff --git a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-light-linux.png
index f4e4fab501..2cdf432c43 100644
--- a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:24a2df2d2033f0f13292990467dc17ae4899a926039b4fbb6ea0afd1c05ed906
-size 21193
+oid sha256:42e79d96cff320f2efd00eb1088de277e11649ed10a1c08207b18e66d6425b1e
+size 21207
diff --git a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-dark-linux.png b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-dark-linux.png
index 3aecbd81f6..6ebffe5c6c 100644
--- a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6417d834a1c6fae7ece6c2746154678d007c920b6798d5775af36b43c6186277
-size 28899
+oid sha256:636a2907cb47a3c25762b5ed839b6ed050a64fc098945f3483eafae192fc517e
+size 28910
diff --git a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-light-linux.png b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-light-linux.png
index 5a60bf323c..25d2e67531 100644
--- a/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/navbar-vertical.spec.ts-snapshots/si-navbar-vertical--si-navbar-vertical-badges--collapsed-flyout-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:f700075c1dd53f3cb8fb3ae69d0138f54d0ef6c87fa2a18f0b47bf74887665d5
-size 28263
+oid sha256:e6722ce4e66b705280a5a3d69007bd0f1b847c7e805659010dcc30b43c1c2301
+size 28275
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-dark-linux.png
index d563867861..70c91a92b3 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:110ed69d0304386f4e22395ed9efcccd6dd985f64ced88cc8e6c2658463e527d
-size 26082
+oid sha256:3144819927477642342cad3e5014665e0325fb24f23025804ef4e4b67da11f25
+size 26146
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-light-linux.png
index 04a4a9a612..edfec3f762 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--account-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:f9070bc6f8f8dc706d4e0d6b5ba95b291a4c33acc6a061b09c6f9851114aaeb2
-size 25623
+oid sha256:5d130413fd1b61684a15304cdf10c44213356b87b05e7e879b0bb7130fbbc913
+size 25649
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-dark-linux.png
index cf021346ea..716012cbc8 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:744682d101184075cc6954c31d23a8603a25815da05d19c4631c4127ee1555e2
-size 13291
+oid sha256:e0a84a885f2b86ca8a2ca74eb4a0c7cfbeb1e542013026c2a485f7d4b7fb8d0c
+size 13300
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-light-linux.png
index 627b5e397a..68f6b70f8a 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--mobile-collapsible-actions-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6b3c9ed8d151c67696cc9d78228f04de5bad979ff629e3bd2b0d7ea9199f6288
-size 12626
+oid sha256:680ee5b8a2d418000e3ea1ce302e504354a1bdd43669c769ba2d38d1e0e8c16a
+size 12640
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-dark-linux.png
index 01d138f497..78b123d92b 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:fba9b37bf6c7aff5b6a653504198e5c9c9213d6f2ceaecac3ef1a3ff85352e63
-size 17696
+oid sha256:d2e5769c40a3e0fd50e25bec75a6d9c8995196d52d4e2c6de4a5f0e2208393ab
+size 17720
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-light-linux.png
index c10211e45d..430ae7c447 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--navigation-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b48a9ef5d42340291eea25b6dff6c906f16ed80de027b30bd526302e32ee5a5f
-size 17367
+oid sha256:c7474208fd7c8243d8e222fadc00357a60d579c0204abddcd95501614b4e4ab8
+size 17384
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-dark-linux.png
index 6fba8adf98..d642c77863 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:cb1befc11e9d7d525f5172b5c244d1faad4218068622f4a8fbed1c9905e305d4
-size 17760
+oid sha256:ff3b76c556c94b94f595811f48b54b3bcca312c44bd8d31e616b4ec7df09c855
+size 17767
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-light-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-light-linux.png
index df831a11f1..c027e7fae8 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header--notifications-expanded-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2d84fb716027bdb61287b689d7b82c2315867c3cc15fc7a0514e6a00cd8b88b2
-size 17409
+oid sha256:9a1f0a754a25f2f3512c937aad5a9ba8e283f00c7d3fef39471604e76f71e7e8
+size 17425
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-dark-linux.png
index 64e2da338f..fbe6437ca3 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7a2cf15716036cf7d68869be825930a48981394e98883aa0d71d52b4bcc8527c
-size 14577
+oid sha256:aaee51502e727eef19766f6db02cf5e9389d160414aa5b9be170fd8ef754a03e
+size 14606
diff --git a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-light-linux.png b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-light-linux.png
index 07d66be70d..ded44631d7 100644
--- a/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-application-header.spec.ts-snapshots/si-application-header--si-application-header-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:84955c7332fe5e399a6fa276f490f4765022f842319b612e602d566596012e64
-size 14017
+oid sha256:c811673a76bbc68052555201b9ed03bc2ffca2482959d58a61b94609b7d82896
+size 14028
diff --git a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-dark-linux.png
index 609b93fcad..d3edf8a50a 100644
--- a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5cf082e42dabfa10e231e5c171ae8d1a832088c29bdabb8238fb6138eb2d515b
-size 48500
+oid sha256:917c0085538ead5a11d1c80431cdbecdd2219146fb8c31462d1c6f2df47b44e0
+size 48511
diff --git a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-light-linux.png b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-light-linux.png
index 9d0a817bd1..60e18e66b1 100644
--- a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-popover--popover-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e67d5074cce1e85bb110f249d2814c7eec2c9afb25b23222571e9b570ba4c41e
-size 48053
+oid sha256:99f190957d61408c95f3977a6594834e689e2a53559834d47b218f21ce9f365d
+size 48079
diff --git a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-dark-linux.png
index 13f66eb1dc..1592c4476a 100644
--- a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9203afb22d90014a2879a694bf3af3229baa88debf70ad9017a643408ee5866e
-size 54103
+oid sha256:60176dfba99dd28d109b6fb856f1dd73a3ecce099c7f9df11d6f8f265ab19377
+size 54088
diff --git a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-light-linux.png b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-light-linux.png
index a40b262927..3095f7bfdd 100644
--- a/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-notification-item.spec.ts-snapshots/si-notification-item--si-notification-item-side-panel--popover-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3a56272a52ca462b32d7cd15ba8efde6ad48c79c74e6bf3f003ab28db8221c80
-size 51232
+oid sha256:0a8b0d49c64e999a2df636e801ce5b7fed9a10fbc7d4d7fd6d4ec2a709a5afe5
+size 51243
diff --git a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-dark-linux.png
index 8a8a923589..248dfe33dc 100644
--- a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e5895e2155d5ad912e6dce29a4b2a611f1dc5622796c0e24863dd986e06e0d10
-size 52403
+oid sha256:af53fa0b6abe45afd8b6d0d5cbc36f40fcd79bdb60f05f7ae9ea5d1e434974da
+size 52409
diff --git a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-light-linux.png b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-light-linux.png
index 236cac97c7..55d10fb9be 100644
--- a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible--closed-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:797e6f591c1e5cf84cc51198d4bbecc745860b7e572c356e5fa0aed4162ad0d1
-size 52411
+oid sha256:f0098cd53a60694438677d92cdf753a1e7bd4e8911217862d72c53f128315019
+size 52424
diff --git a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-dark-linux.png
index 71a5423ceb..e3c1ef4b30 100644
--- a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:482d799a0eec332e1c948a07b77effcb2d2d2f8bee0306a1cdbbe68684fa1e07
-size 52358
+oid sha256:d20db466cb66131639791771531da101defa9c5dff51a0ef1b67396b0bfa0553
+size 52363
diff --git a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-light-linux.png b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-light-linux.png
index 1493dea97b..1b1359c959 100644
--- a/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-side-panel.spec.ts-snapshots/si-side-panel--si-side-panel-collapsible-legacy-status-actions--legacy-closed-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:f3895ae97519547f243511096a96116e056605ee20617f6750fb2b62042913df
-size 52386
+oid sha256:2ed60578265f461cbfb4ecd16164cf5861e54a491a6ae5a81793859844834726
+size 52400
diff --git a/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-dark-linux.png
index e5f0392baa..1b1e836e65 100644
--- a/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ba9cb8f85ab19e1d9dd64d75f17e393ad27dea31ec546973373509ca0a662c42
-size 14369
+oid sha256:c2d0cb41f2cd125f179a34fea1753366d6ee7ef39aad8ff684d4e936c08ebbfc
+size 14356
diff --git a/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-light-linux.png b/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-light-linux.png
index 1e33f7b86a..da75308a54 100644
--- a/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-tabs-legacy.spec.ts-snapshots/si-tabs--si-tabs-legacy-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8a7e4406e5e117da65ef5451c79c2cf6fa2421c6ee3a58785650464e40e52ee5
-size 14451
+oid sha256:4dbf7bb27e91b9bd0f0b2a9d702343a692d5d7913b1bf6e64d3d92990c0ab0f8
+size 14462
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-dark-linux.png
index 9afa8e0b23..9d3c65749b 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:47ca9393835c9d09826e737770efd730da5d04b965e83bdc936783f9c3e2a11c
-size 13229
+oid sha256:283a1c251fd016264e1474730fefcce5c7f936a2405a7f97f52fe0fe74c8dae0
+size 13232
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-light-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-light-linux.png
index 765143c007..18e31edc8e 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--base-tabs-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d7024022f56d013b48d01294a88485a7097ee641ca54215ed0c1a71f8e50c4ea
-size 13503
+oid sha256:fefd02ad948417dfd71f9e7b9a17cb9ff18a4def35be05b1d592d431f1bcb02e
+size 13527
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-dark-linux.png
index 26ddb63948..adf034baeb 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3d5e46344003c3eb9398bdb4e219071a6999c33933336e4b586105ba692f5219
-size 17071
+oid sha256:5fb4813c543526e42a54524e1e989cc5f0acd940127946d203e391bcaf769284
+size 16955
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-light-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-light-linux.png
index 57a6ec6602..6637649cad 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-menu-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7dc3daaf5961bba774d8f1f1d5f424e48c31046d7b2541a571b4391b99ea6c27
-size 17307
+oid sha256:c6ff8c672a10c394b615315b0a8961637198c6a84e96bc41e1ad283ce2d78a78
+size 17251
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-dark-linux.png
index 731ae80861..8d6e4b92dd 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:91e4adefee03ab83d35bd475ee0767a48de505c8fd212abb559fe6139db6f882
-size 8706
+oid sha256:96afd6c4759109a852217387c54cf81529777438a89af752159a52e787919a0a
+size 8688
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-light-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-light-linux.png
index e4e20d8317..089e09a56b 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs--tabs-mobile-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9b40020a1f13d8cbd471e42e03eee79f205ea14ad5bf0c5397540399233357c1
-size 8935
+oid sha256:89644812c60be1b84fb40feb87c5c72bdf9ebe342ede4bd8915943c4e7ddf3c3
+size 8934
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-dark-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-dark-linux.png
index 8f2992b8aa..cb43bf2ef1 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:82d6fef3a59c150821b7c7ea8960b253a085d28e1e2759f14e74404290dfd573
-size 9236
+oid sha256:694cd88269a30111cdba1b08fe461f37a3126e9ced8b2f4aaab16b522caf1ce8
+size 9194
diff --git a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-light-linux.png b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-light-linux.png
index 7c9c8ffc13..b919c8057b 100644
--- a/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/si-tabs.spec.ts-snapshots/si-tabs--si-tabs-icons--tabs-icons-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:500b8ef2a3cb5b4ba456f4b95374fa88979a2e262693b1082b4d57ba39724851
-size 9308
+oid sha256:7f9541820c81178f02ca29d2d57e87834c55d1f0887decdd8c0efda69f83b61b
+size 9312
diff --git a/projects/element-ng/navbar-vertical-next/si-navbar-vertical-next-item.component.scss b/projects/element-ng/navbar-vertical-next/si-navbar-vertical-next-item.component.scss
index 026d12b557..dbe9a9913c 100644
--- a/projects/element-ng/navbar-vertical-next/si-navbar-vertical-next-item.component.scss
+++ b/projects/element-ng/navbar-vertical-next/si-navbar-vertical-next-item.component.scss
@@ -1,5 +1,6 @@
 @use 'sass:map';
 @use '@siemens/element-theme/src/styles/variables';
+@use '@siemens/element-theme/src/styles/bootstrap/mixins/badge-text';
 @use '@siemens/element-theme/src/styles/bootstrap/mixins/visually-hidden';
 
 :host(.navbar-vertical-item) {
@@ -90,14 +91,7 @@
     position: absolute;
     inset-block-start: map.get(variables.$spacers, 2);
     inset-inline-end: map.get(variables.$spacers, 3);
-    block-size: 14px;
-    min-inline-size: 14px;
-    border-radius: 7px;
-    font-size: variables.$si-font-size-caption;
-    line-height: 14px;
-    padding-block: 0;
-    padding-inline: map.get(variables.$spacers, 2);
-    font-weight: variables.$si-font-weight-semibold;
+    @include badge-text.badge-text();
 
     &.badge-text-only {
       color: transparent;
diff --git a/projects/element-ng/navbar-vertical/si-navbar-vertical-item.component.scss b/projects/element-ng/navbar-vertical/si-navbar-vertical-item.component.scss
index fe2118dcf4..ce62a5bb62 100644
--- a/projects/element-ng/navbar-vertical/si-navbar-vertical-item.component.scss
+++ b/projects/element-ng/navbar-vertical/si-navbar-vertical-item.component.scss
@@ -1,5 +1,6 @@
 @use 'sass:map';
 @use '@siemens/element-theme/src/styles/variables';
+@use '@siemens/element-theme/src/styles/bootstrap/mixins/badge-text';
 @use '@siemens/element-theme/src/styles/bootstrap/mixins/visually-hidden';
 
 :host(.navbar-vertical-item) {
@@ -85,17 +86,11 @@
 
 :host-context(.nav-collapsed) {
   .badge {
+    @include badge-text.badge-text();
+
     position: absolute;
     inset-block-start: map.get(variables.$spacers, 2);
     inset-inline-end: map.get(variables.$spacers, 3);
-    block-size: 14px;
-    min-inline-size: 14px;
-    border-radius: 7px;
-    font-size: variables.$si-font-size-caption;
-    line-height: 14px;
-    padding-block: 0;
-    padding-inline: map.get(variables.$spacers, 2);
-    font-weight: variables.$si-font-weight-semibold;
 
     &.badge-text-only {
       color: transparent;
diff --git a/projects/element-theme/src/styles/bootstrap/_badges.scss b/projects/element-theme/src/styles/bootstrap/_badges.scss
index 35d3b3e9a1..93e60b6635 100644
--- a/projects/element-theme/src/styles/bootstrap/_badges.scss
+++ b/projects/element-theme/src/styles/bootstrap/_badges.scss
@@ -1,6 +1,7 @@
 @use '../variables/semantic-tokens';
 @use '../variables/spacers';
 @use '../variables/typography';
+@use './mixins/badge-text';
 @use './variables';
 
 @use 'sass:map';
@@ -139,9 +140,9 @@
 
   &::after {
     content: '';
-    inline-size: 10px;
-    block-size: 10px;
-    border-radius: 5px;
+    inline-size: 0.625rem;
+    block-size: 0.625rem;
+    border-radius: 50%;
     position: absolute;
     inset-block-start: 0;
     inset-inline-end: 0;
@@ -150,22 +151,14 @@
 }
 
 .badge-text {
-  block-size: 14px;
-  min-inline-size: 14px;
-  border-radius: 7px;
-  position: relative;
+  @include badge-text.badge-text();
   background-color: semantic-tokens.$element-action-danger;
   color: semantic-tokens.$element-action-danger-text;
-  font-size: typography.$si-font-size-caption;
-  line-height: 13px;
-  padding-block: 0;
-  padding-inline: map.get(spacers.$spacers, 2);
-  font-family: variables.$font-family-sans-serif;
-  font-weight: typography.$si-font-weight-semibold;
+  position: relative;
 }
 
 :is(.icon, .icon-sm, .icon-lg) + .badge-text {
-  inset-block-start: -8px;
-  inset-inline-start: -12px;
-  margin-inline-end: -12px;
+  inset-block-start: -0.5rem;
+  inset-inline-start: -0.75rem;
+  margin-inline-end: -0.75rem;
 }
diff --git a/projects/element-theme/src/styles/bootstrap/mixins/_badge-text.scss b/projects/element-theme/src/styles/bootstrap/mixins/_badge-text.scss
new file mode 100644
index 0000000000..2c59c8a66b
--- /dev/null
+++ b/projects/element-theme/src/styles/bootstrap/mixins/_badge-text.scss
@@ -0,0 +1,16 @@
+@use 'sass:map';
+
+@use '../../variables/spacers';
+@use '../../variables/typography';
+@use '.././variables';
+
+@mixin badge-text {
+  min-inline-size: 0.875rem;
+  border-radius: 0.4375rem;
+  font-size: typography.$si-font-size-caption;
+  line-height: 0.875rem;
+  padding-block: 0;
+  padding-inline: map.get(spacers.$spacers, 2);
+  font-family: variables.$font-family-sans-serif;
+  font-weight: typography.$si-font-weight-semibold;
+}