From 24e9341e1f98ed1f3af4262c5603cc1a5e72227a Mon Sep 17 00:00:00 2001
From: WilliamK112 <164879897+WilliamK112@users.noreply.github.com>
Date: Thu, 18 Jun 2026 00:41:53 -0500
Subject: [PATCH] fix(ui): derive page tab label width

---
 libs/ui/src/lib/page-tabs/page-tabs.component.html |  3 +--
 libs/ui/src/lib/page-tabs/page-tabs.component.scss | 14 ++++++++++++++
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/libs/ui/src/lib/page-tabs/page-tabs.component.html b/libs/ui/src/lib/page-tabs/page-tabs.component.html
index abd39226c..d649bb38f 100644
--- a/libs/ui/src/lib/page-tabs/page-tabs.component.html
+++ b/libs/ui/src/lib/page-tabs/page-tabs.component.html
@@ -47,8 +47,7 @@
     [size]="deviceType === 'mobile' ? 'large' : 'small'"
   />
   <div
-    class="d-none d-sm-block ml-1 text-truncate"
-    style="max-width: 10.5rem"
+    class="d-none d-sm-block flex-grow-1 ml-1 page-tab-label text-truncate"
     [innerHTML]="tab.label"
   ></div>
 </ng-template>
diff --git a/libs/ui/src/lib/page-tabs/page-tabs.component.scss b/libs/ui/src/lib/page-tabs/page-tabs.component.scss
index 3415a7cb0..eb8c2e9e4 100644
--- a/libs/ui/src/lib/page-tabs/page-tabs.component.scss
+++ b/libs/ui/src/lib/page-tabs/page-tabs.component.scss
@@ -61,6 +61,16 @@
             justify-content: flex-start;
             margin: 0 0.5rem 0.1rem 0.5rem;
 
+            .mdc-tab__content,
+            .mdc-tab__text-label {
+              min-width: 0;
+              width: 100%;
+            }
+
+            .mdc-tab__text-label {
+              display: flex;
+            }
+
             &.mdc-tab--active {
               background-color: rgba(var(--palette-foreground-base), 0.05);
               font-weight: 500;
@@ -72,6 +82,10 @@
   }
 }
 
+.page-tab-label {
+  min-width: 0;
+}
+
 :host-context(.theme-dark) {
   @media (min-width: 576px) {
     @include mat.tabs-overrides(