feat: port پرداخت‌ها (payments) tab from tauri to patient detail page

Replace the flat gateway-payment list on the patient detail «پرداخت‌ها» tab with
the session-grouped accordion design ported from clinic-pro-tauri PaymentsSection:

- New SessionPaymentAccordion mirrors the tauri accordion: header (service, date,
  final price, پرداخت شده/تسویه نشده badge) + a settlement line (date, amount,
  method, personnel=doctor) or the «هیچ پرداختی ثبت نشده است.» empty message.
- New PaymentsTab reuses the already-fetched sessions query (real model = one
  payment_method per session) — no extra request, no backend change, no new API.
- Add FilesServicePaymentsCheck icon (verbatim from tauri).
- Remove the now-unused paymentsQ (gateway list), PAYMENT_STATUS map and the dead
  TabList helper (both its callers replaced by the ported card/accordion tabs).
- Tests: SessionPaymentAccordion (paid/unpaid/collapsed/toggle) + updated the page
  payments-tab test to assert session accordions.

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

assets/admin/components/SessionPaymentAccordion.tsx

@@ -0,0 +1,106 @@
+import { ChevronDownIcon } from '@heroicons/react/24/outline';
+import { formatDate, formatRial } from '../lib/utils';
+import { FilesServicePaymentsCheck } from './icons/FilesServiceIcons';
+
+export interface SessionPaymentData {
+  uuid: string;
+  services?: Array<{ service_name?: string; name?: string }>;
+  visit_price_rials?: number;
+  doctor_name?: string | null;
+  final_price_rials?: number;
+  payment_method?: string;
+  is_paid?: boolean;
+  created_at?: number;
+  updated_at?: number;
+}
+
+const PAYMENT_LABELS: Record<string, string> = {
+  cash: 'نقدی', card: 'کارت', insurance: 'بیمه', online: 'آنلاین', pending: 'در انتظار',
+};
+
+/** vertical hairline divider between meta columns (tauri MUI vertical Divider). */
+function VDivider({ h = 24 }: { h?: number }) {
+  return <span className="dark:bg-[#35343D]" style={{ width: 1, height: h, background: '#E5E7EB', flexShrink: 0, margin: '0 16px', alignSelf: 'center' }} />;
+}
+
+function Meta({ label, value }: { label: string; value: string }) {
+  return (
+    <span style={{ display: 'inline-flex', alignItems: 'center', gap: 6, fontSize: 13 }}>
+      <span className="dark:text-[#A1A1A1]" style={{ color: '#6B7280' }}>{label}:</span>
+      <span className="dark:text-[#D7D8ED]" style={{ color: '#525252', fontWeight: 500 }}>{value}</span>
+    </span>
+  );
+}
+
+/**
+ * A patient «پرداخت‌ها» accordion — one settled/unsettled مراجعه (session) —
+ * ported from tauri files/tabs/PaymentsSection. Header shows the service, date,
+ * final price and settlement badge; the body lists the session's settlement
+ * (real model = one payment_method per session), or the empty message.
+ */
+export default function SessionPaymentAccordion({ session, expanded, onToggle }: {
+  session: SessionPaymentData;
+  expanded: boolean;
+  onToggle: () => void;
+}) {
+  const names = (session.services ?? []).map((s) => s.service_name || s.name).filter(Boolean) as string[];
+  if ((session.visit_price_rials ?? 0) > 0) names.unshift('ویزیت');
+  const name = names.length ? names.join(' - ') : 'ویزیت';
+  const paid = !!session.is_paid;
+  const finalPrice = formatRial(session.final_price_rials ?? 0);
+
+  return (
+    <div className="dark:border-[#35343D]" style={{ border: '1px solid #E5E7EB', borderRadius: 8, marginBottom: 16, overflow: 'hidden' }}>
+      {/* summary */}
+      <button
+        type="button"
+        onClick={onToggle}
+        aria-expanded={expanded}
+        className="bg-white dark:bg-[#2B2D3A]"
+        style={{ display: 'flex', alignItems: 'center', gap: 4, width: '100%', padding: '12px 16px', border: 'none', cursor: 'pointer', textAlign: 'start', flexWrap: 'wrap' }}
+      >
+        <span className="dark:text-[#D7D8ED]" style={{ minWidth: 150, color: '#2f2f2f', fontWeight: 500, fontSize: 14 }}>{name}</span>
+        <VDivider />
+        <Meta label="تاریخ" value={session.created_at ? formatDate(session.created_at) : '—'} />
+        <VDivider />
+        <Meta label="مبلغ نهایی" value={finalPrice} />
+        <span style={{ flex: 1 }} />
+        <VDivider />
+        <span style={{
+          color: '#fff', padding: '3px 16px', borderRadius: 4, fontSize: 12, fontWeight: 600,
+          textAlign: 'center', minWidth: 90, background: paid ? '#10B981' : '#F59E0B',
+        }}>
+          {paid ? 'پرداخت شده' : 'تسویه نشده'}
+        </span>
+        <ChevronDownIcon className="dark:text-[#D7D8ED]" style={{ width: 20, height: 20, color: '#525252', marginInlineStart: 8, transition: 'transform .2s', transform: expanded ? 'rotate(180deg)' : 'none' }} />
+      </button>
+
+      {/* details */}
+      {expanded && (
+        <div className="dark:border-[#35343D] dark:bg-[#222433]" style={{ borderTop: '1px solid #E5E7EB' }}>
+          <div style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '12px 16px 8px' }}>
+            <FilesServicePaymentsCheck color="#6B7280" size={18} style={{ transform: 'rotate(180deg)' }} />
+            <span className="dark:text-[#A1A1A1]" style={{ color: '#6B7280', fontWeight: 600, fontSize: 13 }}>پرداختی‌ها</span>
+          </div>
+
+          <div style={{ padding: '0 16px 16px' }}>
+            {paid ? (
+              <div style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '12px 0', flexWrap: 'wrap' }}>
+                <FilesServicePaymentsCheck color="#6B7280" size={20} />
+                <Meta label="تاریخ" value={formatDate(session.updated_at ?? session.created_at ?? 0)} />
+                <VDivider h={32} />
+                <Meta label="مبلغ" value={finalPrice} />
+                <VDivider h={32} />
+                <Meta label="نحوه پرداخت" value={PAYMENT_LABELS[session.payment_method ?? ''] ?? session.payment_method ?? '—'} />
+                <VDivider h={32} />
+                <Meta label="پرسنل" value={session.doctor_name || '—'} />
+              </div>
+            ) : (
+              <div className="dark:text-[#A1A1A1]" style={{ padding: 16, textAlign: 'center', color: '#6B7280', fontSize: 13 }}>هیچ پرداختی ثبت نشده است.</div>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}