feat(web): add Agent Profile, KYC, Subscription & Payment dashboard pages

Implement four new dashboard pages with full UI:
- /dashboard/profile: view/edit profile, agent details, KYC status
- /dashboard/kyc: multi-step KYC document submission flow
- /dashboard/subscription: plan comparison, quota usage, billing history
- /dashboard/payments: transaction history with filters and pagination

Also adds API client modules (profile-api, subscription-api, payment-api)
and updates dashboard navigation with new page links.

Co-Authored-By: Paperclip <noreply@paperclip.ing>

apps/web/lib/payment-api.ts

@@ -0,0 +1,59 @@
+import { apiClient } from './api-client';
+
+export interface CreatePaymentPayload {
+  provider: 'VNPAY' | 'MOMO' | 'ZALOPAY' | 'BANK_TRANSFER';
+  type: 'SUBSCRIPTION' | 'LISTING_FEE' | 'DEPOSIT' | 'FEATURED_LISTING';
+  amountVND: number;
+  description: string;
+  returnUrl: string;
+  idempotencyKey?: string;
+}
+
+export interface CreatePaymentResult {
+  paymentId: string;
+  paymentUrl: string;
+  providerTxId: string;
+}
+
+export interface PaymentStatusDto {
+  id: string;
+  provider: string;
+  type: string;
+  amountVND: string;
+  status: string;
+  providerTxId: string | null;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface TransactionListDto {
+  items: Array<{
+    id: string;
+    provider: string;
+    type: string;
+    amountVND: string;
+    status: string;
+    providerTxId: string | null;
+    createdAt: string;
+  }>;
+  total: number;
+  limit: number;
+  offset: number;
+}
+
+export const paymentApi = {
+  createPayment: (data: CreatePaymentPayload) =>
+    apiClient.post<CreatePaymentResult>('/payments', data),
+
+  getPaymentStatus: (id: string) =>
+    apiClient.get<PaymentStatusDto>(`/payments/${id}`),
+
+  getTransactions: (params: { status?: string; limit?: number; offset?: number } = {}) => {
+    const query = new URLSearchParams();
+    if (params.status) query.set('status', params.status);
+    if (params.limit) query.set('limit', String(params.limit));
+    if (params.offset) query.set('offset', String(params.offset));
+    const qs = query.toString();
+    return apiClient.get<TransactionListDto>(`/payments${qs ? `?${qs}` : ''}`);
+  },
+};