Add mock Razorpay/PhonePe UPI test flow

[Copilot]

Adds a mock Razorpay/PhonePe UPI payment flow for testing within the existing payment screen. The UI now supports simulated UPI requests with basic validation and mock reference generation.

• Mock UPI setup UI
  • Provider selector (Razorpay/PhonePe), UPI ID input, and mock request generation block.
• Validation + gating
  • Basic UPI ID format check and pay button enabled only after a mock request is generated for UPI.
• Mock reference generation
  • Uses crypto APIs when available; deterministic fallback counter for consistent mock references.

Example:

const isUpiRequestValid = (upiId: string, mockUpiRef: string | null) =>
  Boolean(isUpiIdValid(upiId) && mockUpiRef);

const isPaymentReady =
  selectedMethod === 'card' || (selectedMethod === 'upi' && isUpiRequestValid(upiId, mockUpiRef));

Screenshot

Original prompt

please research and add a mock razorpay or phone pay upi payment system for testing

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.