Checkout: Invoice Payment Landing Page

[0xdevcollins]

Summary

Build the consumer-facing page where customers land when clicking "Pay Now" from an invoice email.

Requirements

• Route: /invoice/[invoiceId] in checkout app
• Display: merchant logo/name, invoice summary, line items, total
• If partially paid: show remaining balance
• "Pay Now" button enters standard checkout flow (card/bank/crypto)
• If already paid: show "Invoice Paid" confirmation
• If expired/cancelled: show appropriate message with merchant contact
• Mobile-first design (375px primary breakpoint)
• Trust badges and security indicators
• Merchant branding (logo, color)

Acceptance Criteria

• Invoice details render correctly from API
• Partial payment shows correct remaining amount
• Paid/cancelled/expired states handled gracefully
• Flows into existing checkout payment method selection
• Mobile-optimized layout