Add admin UI to cancel payment transactions.

Show cancelled rows in history with distinct styling and let admins
confirm cancellation so replacement transactions can be added later.

src/components/common/StatusTag.vue

@@ -46,7 +46,8 @@ const PAYMENT_LABELS = {
   paid: 'تسویه‌شده',
   partial: 'پرداخت جزئی',
   pending: 'در انتظار پرداخت',
-  overdue: 'معوق'
+  overdue: 'معوق',
+  cancelled: 'لغوشده'
 };
 
 const PENDING_STUDENT_LABELS = {
@@ -65,6 +66,7 @@ const severity = computed(() => {
     if (val === 'partial' || val === 'پرداخت جزئی') return 'contrast';
     if (val === 'pending' || val === 'در انتظار پرداخت') return 'info';
     if (val === 'overdue' || val === 'معوق شده' || val === 'معوق') return 'danger';
+    if (val === 'cancelled' || val === 'canceled' || val === 'لغوشده') return 'secondary';
   }
 
   if (props.type === 'session') {