feat: complete UI redesign — client creation tabs, footer, home page, CIF & occupation fields

- Client creation: replaced vertical stepper with 3-tab layout (General, KYC & Nominee, Preview)
- All form fields redesigned with appearance="outline" and section grouping
- Preview tab with profile card, info tables, KYC details, family members
- Footer redesigned: security bar, LincShield certifications, regulatory & legal, quick navigation, support & contact, LincPay branding
- Home page redesigned: welcome banner, quick action cards, info row
- Client view header redesigned: ID chips row (Account No, CIF Number, External Id), 4-column details grid
- Added CIF Number column to clients list table
- Added CIF Number display to client view sidebar and personal data tab
- Added occupationCategoryId and occupationId dropdowns to client creation form
- Added occupation fields to client view sidebar, personal data tab, and preview
- Added 51+ missing translation keys to en-US.json
- Toolbar: added Last login chip
- Registered faUserPlus icon

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/app/home/dashboard/dashboard.component.html

@@ -19,19 +19,47 @@
       <span>Regulatory &amp; Compliance</span>
     </div>
     <div class="cards-row four-col">
-      <!-- CRR / SRR -->
-      <div class="dash-card mini">
-        <div class="mini-icon blue"><fa-icon icon="lock"></fa-icon></div>
-        <div class="mini-label">CRR / SRR</div>
-        <div class="mini-value">&#8377; 20.14 Cr</div>
-        <div class="mini-sub">8% <span class="tag-success">Within Limits</span></div>
+      <!-- CRR / SLR -->
+      <div class="dash-card mini crr-slr-card">
+        <div class="mini-header-row">
+          <div class="mini-icon blue"><fa-icon icon="lock"></fa-icon></div>
+          <div class="mini-label">CRR / SLR</div>
+          <button class="view-details-btn" (click)="openCrrSlrDialog()" matTooltip="View Details">
+            <fa-icon icon="external-link-alt"></fa-icon> View
+          </button>
+        </div>
+        <div class="card-metrics">
+          <div class="metric-row">
+            <span class="metric-label">CRR Required (3%)</span>
+            <span class="metric-value">&#8377;2,077 Cr</span>
+          </div>
+          <div class="metric-row">
+            <span class="metric-label">SLR Required (18%)</span>
+            <span class="metric-value">&#8377;12,460 Cr</span>
+          </div>
+        </div>
+        <div class="mini-sub"><span class="tag-success">Within Limits</span></div>
       </div>
 
       <!-- CRAR -->
-      <div class="dash-card mini">
-        <div class="mini-icon green"><fa-icon icon="chart-line"></fa-icon></div>
-        <div class="mini-label">CRAR %</div>
-        <div class="mini-value">21%</div>
+      <div class="dash-card mini crr-slr-card">
+        <div class="mini-header-row">
+          <div class="mini-icon green"><fa-icon icon="chart-line"></fa-icon></div>
+          <div class="mini-label">CRAR %</div>
+          <button class="view-details-btn" (click)="openCrarDialog()" matTooltip="View Details">
+            <fa-icon icon="external-link-alt"></fa-icon> View
+          </button>
+        </div>
+        <div class="card-metrics">
+          <div class="metric-row">
+            <span class="metric-label">CRAR (Basel III)</span>
+            <span class="metric-value">16.84%</span>
+          </div>
+          <div class="metric-row">
+            <span class="metric-label">CET1 Ratio</span>
+            <span class="metric-value">12.42%</span>
+          </div>
+        </div>
         <div class="mini-sub"><span class="tag-success">Healthy (Min 9%)</span></div>
       </div>