PaymentProviderPicker + BankInvoiceCard

Two composed components for the online-payment and bank-payment signup flows. The provider picker is a role="radiogroup"with one-click selection; the invoice card surfaces the reference, amount, 72-hour countdown, and partner banks with clipboard copy-to-confirm. Countdown ticks client-side only to keep prerendered HTML deterministic.

Provider picker

Selected card gets an accent border + primary-tinted icon. Use arrow keys + Enter to navigate via keyboard.

Amount dueSLE 250.00

Invoice — issued (72h countdown)

Live invoice for the Bank Transfer channel. Click the copy icon — a role="status" region confirms the copy for screen readers.

Invoice — paid

Invoice — expired