feat: KYC re-verify UX, family/nominee tab gating, savings dialogs, cfcfrms shell

- KYC tab: fix Verify (PAN) and Send OTP (Aadhaar) being disabled in edit mode;
  unmask Aadhaar input and show on-file masked value as hint; resolve kycId
  from id/kycId/resourceId fallbacks.
- Client stepper/view: add familyAllowed / nomineeAllowed predicates +
  CanActivate route guards. Family tab hidden for non-individuals, Nominee
  tab hidden for non-proprietor entities. Family-members step accepts a
  nomineeOnly input for proprietorship clients. Add/Edit/Delete buttons
  inside family-members and nominee tabs gated by canAdd.
- cfcfrms: add cfcfrms-shell wrapper, restyle complaint/fraud/mule/escalate
  pages and dashboard.
- Savings: identity-verify and transaction-confirm dialogs, manage / activate
  / add-charge flows, account preview styling.
- Tasks, core shell, account-nominees, icons: minor style and behaviour
  updates.

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

src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.html

@@ -6,66 +6,81 @@
   file, You can obtain one at http://mozilla.org/MPL/2.0/.
 -->
 
-<div class="container">
-  <div class="table-header">
-    <div class="table-title-group">
-      <h2 class="table-title">
-        <span class="t-logomark"><span></span><span></span><span></span><span></span></span>
-        {{ 'labels.heading.Pending Tasks' | translate }}
-      </h2>
+<div class="ac-container">
+  <!-- Hero header -->
+  <div class="ac-header">
+    <div class="ac-header__left">
+      <fa-icon icon="check-double" class="ac-header__icon"></fa-icon>
+      <div>
+        <h2 class="ac-header__title">Approval Center</h2>
+        <div class="ac-header__sub">
+          Review pending checker actions, client &amp; loan approvals, disbursals, and reschedules.
+        </div>
+      </div>
     </div>
   </div>
 
-  <nav mat-tab-nav-bar class="cv-tab-nav" [tabPanel]="tabPanel">
+  <!-- Pill-style tab navigation -->
+  <nav mat-tab-nav-bar class="ac-tabs" [tabPanel]="tabPanel">
     <a
       mat-tab-link
+      class="ac-tab"
       [routerLink]="['./checker-inbox']"
       routerLinkActive
       #checkerInbox="routerLinkActive"
       [active]="checkerInbox.isActive"
       *mifosxHasPermission="'ALL_FUNCTIONS_READ'"
     >
-      <i class="fas fa-inbox cv-tab-icon"></i> {{ 'labels.inputs.Checker Inbox' | translate }}
+      <fa-icon icon="inbox" class="ac-tab__ic"></fa-icon>
+      <span>Checker Inbox</span>
     </a>
     <a
       mat-tab-link
+      class="ac-tab"
       [routerLink]="['./client-approval']"
       routerLinkActive
       #clientApproval="routerLinkActive"
       [active]="clientApproval.isActive"
       *mifosxHasPermission="'READ_CLIENT'"
     >
-      <i class="fas fa-user-check cv-tab-icon"></i> {{ 'labels.inputs.Client Approval' | translate }}
+      <fa-icon icon="user-check" class="ac-tab__ic"></fa-icon>
+      <span>Client Approval</span>
     </a>
     <a
       mat-tab-link
+      class="ac-tab"
       [routerLink]="['./loan-approval']"
       routerLinkActive
       #loanApproval="routerLinkActive"
       [active]="loanApproval.isActive"
       *mifosxHasPermission="'READ_LOAN'"
     >
-      <i class="fas fa-hand-holding-usd cv-tab-icon"></i> {{ 'labels.inputs.Loan Approval' | translate }}
+      <fa-icon icon="hand-holding-usd" class="ac-tab__ic"></fa-icon>
+      <span>Loan Approval</span>
     </a>
     <a
       mat-tab-link
+      class="ac-tab"
       [routerLink]="['./loan-disbursal']"
       routerLinkActive
       #loanDisbursal="routerLinkActive"
       [active]="loanDisbursal.isActive"
       *mifosxHasPermission="'READ_LOAN'"
     >
-      <i class="fas fa-money-bill-wave cv-tab-icon"></i> {{ 'labels.inputs.Loan Disbursal' | translate }}
+      <fa-icon icon="money-bill-wave" class="ac-tab__ic"></fa-icon>
+      <span>Loan Disbursal</span>
     </a>
     <a
       mat-tab-link
+      class="ac-tab"
       [routerLink]="['./reschedule-loan']"
       routerLinkActive
       #rescheduleLoan="routerLinkActive"
       [active]="rescheduleLoan.isActive"
       *mifosxHasPermission="'RESCHEDULE_LOAN'"
     >
-      <i class="fas fa-calendar-alt cv-tab-icon"></i> {{ 'labels.inputs.Reschedule Loan' | translate }}
+      <fa-icon icon="calendar-alt" class="ac-tab__ic"></fa-icon>
+      <span>Reschedule Loan</span>
     </a>
   </nav>