diff --git a/components/payments-table.tsx b/components/payments-table.tsx
index e6756d0..5dcab40 100644
--- a/components/payments-table.tsx
+++ b/components/payments-table.tsx
@@ -84,7 +84,6 @@ export async function PaymentsTable({
 											>
 												<div className="flex items-center gap-2">
 													<Calendar size={16} opacity={0.5} />
-													<pre>{JSON.stringify(payment.created_at, null, 2)}</pre>
 													<span className="text-muted-foreground">
 														{new Date(payment.created_at).toLocaleDateString(
 															"en-US",
@@ -196,8 +195,10 @@ function MobilePaymentDetails({ payment }: { payment: Payment }) {
 			className={cn(
 				"flex flex-col items-start border rounded p-2 my-2",
 				payment?.paid
-					? "bg-green-500/10 border-dashed border-green=500"
-					: "bg-yellow-500/10 border-dashed border-yellow-500 dark:border-yellow-500/50",
+					? "bg-green-500/10 border-dashed border-green-500"
+					: payment?.is_expired
+						? "bg-gray-500/10 border-dashed border-gray-500 dark:border-gray-500/50"
+						: "bg-yellow-500/10 border-dashed border-yellow-500 dark:border-yellow-500/50",
 			)}
 		>
 			<div className="flex items-center gap-2">