Show when the booking was made in the verify-payment modal

The modal only had "User marked as paid", which is absent for manual
payments the customer never confirmed — those opened with no timestamp
at all. Show the payment's createdAt unconditionally as "Booking made",
and give both lines a relative age suffix.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

frontend/src/app/admin/payments/page.tsx

@@ -22,6 +22,7 @@ import {
   BoltIcon,
   BanknotesIcon,
   BuildingLibraryIcon,
+  CalendarDaysIcon,
   CreditCardIcon,
   EnvelopeIcon,
   FunnelIcon,
@@ -534,12 +535,29 @@ export default function AdminPaymentsPage() {
                 </div>
               )}
               
-              {selectedPayment.userMarkedPaidAt && (
+              {/* Always shown — for payments the customer never confirmed, this
-                <div className="flex items-center gap-2 text-sm text-gray-600">
+                  is the only timestamp there is. */}
-                  <ClockIcon className="w-4 h-4" />
+              {(() => {
-                  {locale === 'es' ? 'Usuario marcó como pagado:' : 'User marked as paid:'} {formatDate(selectedPayment.userMarkedPaidAt)}
+                const age = getAgeInfo(selectedPayment.createdAt);
-                </div>
+                return (
-              )}
+                  <div className="flex items-center gap-2 text-sm text-gray-600">
+                    <CalendarDaysIcon className="w-4 h-4" />
+                    {locale === 'es' ? 'Reserva realizada:' : 'Booking made:'} {formatDate(selectedPayment.createdAt)}
+                    {age && <span className="text-gray-400">({age.label})</span>}
+                  </div>
+                );
+              })()}
+
+              {selectedPayment.userMarkedPaidAt && (() => {
+                const age = getAgeInfo(selectedPayment.userMarkedPaidAt);
+                return (
+                  <div className="flex items-center gap-2 text-sm text-gray-600">
+                    <ClockIcon className="w-4 h-4" />
+                    {locale === 'es' ? 'Usuario marcó como pagado:' : 'User marked as paid:'} {formatDate(selectedPayment.userMarkedPaidAt)}
+                    {age && <span className="text-gray-400">({age.label})</span>}
+                  </div>
+                );
+              })()}
               
               {selectedPayment.reminderSentAt && (
                 <div className="flex items-center gap-2 text-sm text-amber-600">