Jun 28 - Update and polish UI/UX

app/templates/billing/email/payment_failed.html

@@ -0,0 +1,39 @@
+{% extends "billing/email/base.html" %}
+{% set subject = "Action Required: Payment failed for your JQC subscription" %}
+{% block body %}
+<h2 style="margin:0 0 8px;font-size:1.2rem;color:#111827;">Payment failed</h2>
+<p style="margin:0 0 20px;color:#6b7280;font-size:.9rem;">We were unable to process your most recent payment.</p>
+
+<table width="100%" cellpadding="12" cellspacing="0" style="background:#fef3c7;border-radius:6px;margin-bottom:24px;">
+  <tr>
+    <td>
+      <p style="margin:0;font-size:.9rem;color:#92400e;line-height:1.5;">
+        <strong>&#9888; Your subscription may be suspended</strong> if the payment is not resolved.
+        Please update your payment method as soon as possible.
+      </p>
+    </td>
+  </tr>
+</table>
+
+<p style="margin:0 0 24px;font-size:.9rem;color:#374151;line-height:1.6;">
+  This can happen when a card expires, has insufficient funds, or is declined by
+  your bank. Updating your payment method takes less than a minute.
+</p>
+
+<table width="100%" cellpadding="0" cellspacing="0" style="margin-bottom:24px;">
+  <tr>
+    <td align="center">
+      <a href="{{ portal_url }}"
+         style="display:inline-block;background:#1a56db;color:#fff;text-decoration:none;
+                padding:12px 28px;border-radius:6px;font-size:.95rem;font-weight:600;">
+        Update Payment Method
+      </a>
+    </td>
+  </tr>
+</table>
+
+<p style="margin:0;font-size:.85rem;color:#9ca3af;">
+  Or copy this link into your browser:<br>
+  <a href="{{ portal_url }}" style="color:#1a56db;word-break:break-all;">{{ portal_url }}</a>
+</p>
+{% endblock %}