Formulaire public : paiement de la cotisation via l'API SumUp (remplace Yapla)

Remplace le simple lien Yapla statique par une vraie intégration API SumUp :
checkout hébergé créé à la soumission du formulaire, statut de paiement
(PENDING/PAID/FAILED/EXPIRED) tenu à jour par un webhook SumUp et visible sur
la fiche du bénévole. La cotisation n'est plus un montant unique : la
coordination configure autant de types de paiement qu'elle veut (libellé +
montant, ex. « Cotisation classique », « Mécénat »), et le bénévole en
choisit un à l'inscription — le libellé et le montant choisis sont figés sur
le bénévole, indépendamment d'une modification ultérieure de la config.

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

frontend/src/pages/config/ConfigVolunteers.tsx

@@ -160,6 +160,13 @@ function VolunteerAccessSection({
   );
 }
 
+const FEE_STATUS_LABEL_KEY: Record<NonNullable<VolunteerRead['fee_payment_status']>, string> = {
+  PENDING: 'config.vol.feeStatus.pending',
+  PAID: 'config.vol.feeStatus.paid',
+  FAILED: 'config.vol.feeStatus.failed',
+  EXPIRED: 'config.vol.feeStatus.expired',
+};
+
 /**
  * Réponses du formulaire public d'inscription (voir `app/api/forms.py`) —
  * note de compagnon en texte libre (à résoudre manuellement en vrai vœu via
@@ -183,6 +190,10 @@ function PublicFormAnswers({
     volunteer.willing_to_pay_fee;
   if (!hasAnything) return null;
 
+  const feeStatusKey = volunteer.fee_payment_status
+    ? FEE_STATUS_LABEL_KEY[volunteer.fee_payment_status]
+    : null;
+
   return (
     <div className="flex flex-col gap-2 border-2 border-ink bg-sand p-[9px]">
       <FieldLabel>
@@ -228,6 +239,12 @@ function PublicFormAnswers({
           />
           <span className="font-mono text-[11px]">{t('form.field.willingToPayFee')}</span>
         </label>
+        {feeStatusKey ? (
+          <span className="border-2 border-ink bg-cream px-[8px] py-[3px] font-mono text-[10.5px] font-bold">
+            {volunteer.fee_payment_label ? `${volunteer.fee_payment_label} (${volunteer.fee_amount} €) — ` : ''}
+            {t(feeStatusKey)}
+          </span>
+        ) : null}
       </div>
     </div>
   );