Payment step¶

Payment screen { width="320" }

Purpose¶

Confirm payment for the order using one of the supported methods.

Payment methods¶

Two tabs are visible: - Scan QR (default in screenshot) – scan a payment QR code - Enter ID – manually enter a payment identifier (e.g., transaction/reference ID)

UI elements¶

Amount banner at the top (example: CFA 20)
Scan area with a call-to-action (e.g., Tap to Scan)
Helper text: Scan payment QR code

Actions¶

Scan Payment QR triggers the QR scanner
Back returns to Preview

Suggested validations & flows¶

If QR scan returns an invalid/expired code, show an actionable error and allow retry.
If manual ID is used, validate format and confirm the payment status before completion.
Ensure the confirmed payment is tied to the correct customer + package + plan + total.