feat(clerk): enhance disbursement review and my-requests UI components

- Update disbursement review and my-disbursement-requests components
  with improved layout and additional UI enhancements

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

src/app/clerk/my-disbursement-requests/my-disbursement-requests.component.ts

@@ -74,7 +74,8 @@ export class MyDisbursementRequestsComponent implements OnInit {
       { value: '', label: 'All' },
       { value: 'PENDING', label: 'Pending' },
       { value: 'APPROVED', label: 'Approved' },
-      { value: 'REJECTED', label: 'Rejected' }
+      { value: 'REJECTED', label: 'Rejected' },
+      { value: 'FAILED', label: 'Failed' }
     ];
   }
 
@@ -189,8 +190,10 @@ export class MyDisbursementRequestsComponent implements OnInit {
   statusClass(status: string): string {
     const map: Record<string, string> = {
       PENDING: 'mdr-status--pending',
+      PROCESSING: 'mdr-status--processing',
       APPROVED: 'mdr-status--approved',
-      REJECTED: 'mdr-status--rejected'
+      REJECTED: 'mdr-status--rejected',
+      FAILED: 'mdr-status--failed'
     };
     return map[status] ?? '';
   }
@@ -198,8 +201,10 @@ export class MyDisbursementRequestsComponent implements OnInit {
   statusLabel(status: string): string {
     const map: Record<string, string> = {
       PENDING: 'Pending Approval',
+      PROCESSING: 'Processing…',
       APPROVED: 'Approved',
-      REJECTED: 'Rejected'
+      REJECTED: 'Rejected',
+      FAILED: 'Processing Failed'
     };
     return map[status] ?? status;
   }