feat: add Pending Account and Reject Account tabs to Approval Center

- Added Pending Account tab showing savings/FD/RD/current accounts with status=pending (100)
- Added Reject Account tab showing accounts with status=rejected (500)
- Each tab displays: account no, client name, product, type badge, office, field officer, submitted/rejected date, status
- Bulk approve with correct endpoint per deposit type (savings/FD/RD/current)
- Resolvers use forkJoin to fetch savings + current accounts in parallel
- Office name resolved via /offices map; field officer name taken directly from API response

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/tasks/checker-inbox-and-tasks-tabs/pending-account/pending-account.component.html

@@ -0,0 +1,120 @@
+<!--
+  Copyright since 2025 Mifos Initiative
+
+  This Source Code Form is subject to the terms of the Mozilla Public
+  License, v. 2.0. If a copy of the MPL was not distributed with this
+  file, You can obtain one at http://mozilla.org/MPL/2.0/.
+-->
+
+<div class="cv-tab-content">
+  @if (showData) {
+    <div class="cv-action-bar">
+      <mat-form-field appearance="outline" class="cv-search-field">
+        <mat-icon matPrefix>search</mat-icon>
+        <input
+          #filterInput
+          matInput
+          placeholder="Search by client or account"
+          (keyup)="applyFilter(filterInput.value)"
+        />
+      </mat-form-field>
+      <div class="cv-action-buttons">
+        <button mat-stroked-button class="cv-btn cv-btn-approve" (click)="approveAccounts()">
+          <fa-icon icon="check" class="m-r-10"></fa-icon>Approve
+        </button>
+      </div>
+    </div>
+
+    <div class="table-container">
+      <table mat-table [dataSource]="dataSource" class="modern-table">
+        <ng-container matColumnDef="select">
+          <th mat-header-cell *matHeaderCellDef>
+            <mat-checkbox
+              (change)="$event ? masterToggle() : null"
+              [checked]="selection.hasValue() && isAllSelected()"
+              [indeterminate]="selection.hasValue() && !isAllSelected()"
+              [aria-label]="checkboxLabel()"
+            ></mat-checkbox>
+          </th>
+          <td mat-cell *matCellDef="let row">
+            <mat-checkbox
+              (click)="$event.stopPropagation()"
+              (change)="$event ? selection.toggle(row) : null"
+              [checked]="selection.isSelected(row)"
+              [aria-label]="checkboxLabel(row)"
+            ></mat-checkbox>
+          </td>
+        </ng-container>
+
+        <ng-container matColumnDef="accountNo">
+          <th mat-header-cell *matHeaderCellDef>Account No</th>
+          <td mat-cell *matCellDef="let account" class="cell-mono">{{ account.accountNo }}</td>
+        </ng-container>
+
+        <ng-container matColumnDef="clientName">
+          <th mat-header-cell *matHeaderCellDef>Client Name</th>
+          <td mat-cell *matCellDef="let account">{{ account.clientName }}</td>
+        </ng-container>
+
+        <ng-container matColumnDef="productName">
+          <th mat-header-cell *matHeaderCellDef>Product</th>
+          <td mat-cell *matCellDef="let account">{{ account.savingsProductName || account.productName }}</td>
+        </ng-container>
+
+        <ng-container matColumnDef="accountType">
+          <th mat-header-cell *matHeaderCellDef>Type</th>
+          <td mat-cell *matCellDef="let account">
+            <span
+              class="type-badge"
+              [class.type-badge--current]="account.accountType === 'Current'"
+              [class.type-badge--fd]="account.accountType === 'Fixed Deposit'"
+              [class.type-badge--rd]="account.accountType === 'Recurring Deposit'"
+            >
+              {{ account.accountType }}
+            </span>
+          </td>
+        </ng-container>
+
+        <ng-container matColumnDef="officeName">
+          <th mat-header-cell *matHeaderCellDef>Office</th>
+          <td mat-cell *matCellDef="let account">{{ account.officeName }}</td>
+        </ng-container>
+
+        <ng-container matColumnDef="fieldOfficerName">
+          <th mat-header-cell *matHeaderCellDef>Field Officer</th>
+          <td mat-cell *matCellDef="let account">{{ account.fieldOfficerName || '—' }}</td>
+        </ng-container>
+
+        <ng-container matColumnDef="submittedOnDate">
+          <th mat-header-cell *matHeaderCellDef>Submitted On</th>
+          <td mat-cell *matCellDef="let account">
+            {{ formatDate(account.timeline?.submittedOnDate) }}
+          </td>
+        </ng-container>
+
+        <ng-container matColumnDef="status">
+          <th mat-header-cell *matHeaderCellDef>Status</th>
+          <td mat-cell *matCellDef="let account">
+            <span class="status-badge status-badge--pending">{{ account.status?.value }}</span>
+          </td>
+        </ng-container>
+
+        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+        <tr
+          mat-row
+          *matRowDef="let row; columns: displayedColumns"
+          (click)="selection.toggle(row)"
+          class="table-row"
+        ></tr>
+      </table>
+    </div>
+  }
+
+  @if (!showData) {
+    <div class="empty-state">
+      <i class="fas fa-clock empty-icon"></i>
+      <p class="empty-title">No pending accounts</p>
+      <p class="empty-text">There are no savings accounts awaiting approval at this time.</p>
+    </div>
+  }
+</div>