diff --git a/public/shell.php b/public/shell.php
index a72c572..d6805da 100644
--- a/public/shell.php
+++ b/public/shell.php
@@ -63,7 +63,7 @@
         }
 
         body {
-            font-family: 'IBM Plex Sans Arabic', 'Outfit', sans-serif;
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'IBM Plex Sans Arabic', Roboto, Helvetica, Arial, sans-serif;
             background: var(--bg);
             color: var(--text-1);
             -webkit-font-smoothing: antialiased;
@@ -72,15 +72,12 @@
         }
 
         .premium-font {
-            font-family: 'Outfit', sans-serif;
+            font-family: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
         }
 
-        h1,
-        h2,
-        h3,
-        h4 {
-            font-family: 'El Messiri', 'IBM Plex Sans Arabic', sans-serif;
-            line-height: 1.35;
+        h1, h2, h3, h4, h5, h6 {
+            font-family: 'El Messiri', 'IBM Plex Sans Arabic', -apple-system, sans-serif;
+            font-weight: 700;
         }
 
         [x-cloak] {
@@ -1530,7 +1527,7 @@
                                 <span class="premium-font" style="font-weight:700; color:var(--teal);" x-text="subscription?.invoices?.used + ' / ' + subscription?.invoices?.limit"></span>
                             </div>
                             <div style="height:10px; background:#f1f5f9; border-radius:10px; overflow:hidden; margin-bottom:12px;">
-                                <div :style="'width:' + (subscription?.invoices?.percent || 0) + '%; height:100%; background:linear-gradient(90deg, var(--teal), var(--teal-mid)); border-radius:10px; transition:width 1s ease;'"></div>
+                                <div :style="'width:' + (subscription?.invoices?.percent || 0) + '%; height:100%; background:var(--teal); border-radius:10px; transition:width 1s ease;'"></div>
                             </div>
                             <div style="display:flex; justify-content:space-between; font-size:12px; color:var(--text-3);">
                                 <span x-text="'يتم التصفير في: ' + (subscription?.period_end?.split(' ')[0] || '—')"></span>
@@ -1542,10 +1539,10 @@
                         <div class="table-container" style="padding:24px;">
                             <div style="display:flex; justify-content:space-between; margin-bottom:16px;">
                                 <span style="font-weight:700; color:var(--navy);">الشركات المدارة</span>
-                                <span class="premium-font" style="font-weight:700; color:var(--navy);" x-text="subscription?.companies?.used + ' / ' + subscription?.companies?.limit"></span>
+                                <span class="premium-font" style="font-weight:700; color:var(--teal);" x-text="subscription?.companies?.used + ' / ' + subscription?.companies?.limit"></span>
                             </div>
                             <div style="height:10px; background:#f1f5f9; border-radius:10px; overflow:hidden; margin-bottom:12px;">
-                                <div :style="'width:' + (subscription?.companies?.percent || 0) + '%; height:100%; background:linear-gradient(90deg, var(--navy), var(--navy-mid)); border-radius:10px;'"></div>
+                                <div :style="'width:' + (subscription?.companies?.percent || 0) + '%; height:100%; background:var(--teal); border-radius:10px;'"></div>
                             </div>
                             <div style="font-size:12px; color:var(--text-3);" x-text="'إجمالي الشركات المسموح بها'"></div>
                         </div>
@@ -1554,10 +1551,10 @@
                         <div class="table-container" style="padding:24px;">
                             <div style="display:flex; justify-content:space-between; margin-bottom:16px;">
                                 <span style="font-weight:700; color:var(--navy);">فريق العمل</span>
-                                <span class="premium-font" style="font-weight:700; color:var(--purple);" x-text="subscription?.users?.used + ' / ' + subscription?.users?.limit"></span>
+                                <span class="premium-font" style="font-weight:700; color:var(--teal);" x-text="subscription?.users?.used + ' / ' + subscription?.users?.limit"></span>
                             </div>
                             <div style="height:10px; background:#f1f5f9; border-radius:10px; overflow:hidden; margin-bottom:12px;">
-                                <div :style="'width:' + (subscription?.users?.percent || 0) + '%; height:100%; background:linear-gradient(90deg, var(--purple), #8b5cf6); border-radius:10px;'"></div>
+                                <div :style="'width:' + (subscription?.users?.percent || 0) + '%; height:100%; background:var(--teal); border-radius:10px;'"></div>
                             </div>
                             <div style="font-size:12px; color:var(--text-3);" x-text="'مستخدمين نشطين في النظام'"></div>
                         </div>
@@ -1618,7 +1615,7 @@
                                 <button x-show="subscription?.plan_id !== p.id" 
                                         @click="upgradePlan(p)"
                                         class="btn-primary" 
-                                        style="width:100%; height:54px; font-size:16px; font-weight:700; border-radius:14px; background:linear-gradient(135deg, var(--navy), var(--navy-mid)); box-shadow:0 4px 15px rgba(22, 50, 92, 0.2); margin-top:20px;">
+                                        style="width:100%; height:54px; font-size:16px; font-weight:800; border-radius:14px; background:linear-gradient(135deg, var(--teal), var(--teal-mid)); color:white; box-shadow:0 4px 15px rgba(5, 150, 105, 0.3); margin-top:20px; border:none; cursor:pointer;">
                                     ترقية الباقة الآن
                                 </button>