.payment-result-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% 15%, rgba(255, 107, 44, .13), transparent 30%),
    radial-gradient(circle at 85% 80%, rgba(91, 154, 114, .12), transparent 28%),
    var(--paper);
}
.payment-result-page main { display: grid; min-height: calc(100vh - 190px); place-items: center; }
.payment-result-card {
  width: min(520px, 100%);
  padding: clamp(28px, 6vw, 52px);
  border: 1px solid var(--line);
  border-radius: 30px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 30px 90px rgba(52, 39, 28, .12);
  text-align: center;
}
.payment-result-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--ink); font-weight: 900; text-decoration: none; }
.payment-result-brand img { width: 45px; height: 45px; border: 1px solid var(--line); border-radius: 50%; object-fit: contain; }
.payment-result-icon { display: grid; width: 78px; height: 78px; margin: 30px auto 18px; place-items: center; border-radius: 50%; color: #fff; font-size: 2rem; font-weight: 900; }
.is-success .payment-result-icon { background: #4c936d; box-shadow: 0 13px 30px rgba(76, 147, 109, .25); }
.is-failed .payment-result-icon { background: #b64a3f; box-shadow: 0 13px 30px rgba(182, 74, 63, .22); }
.payment-result-kicker { margin: 0; color: var(--orange-dark) !important; font-size: .72rem !important; font-weight: 900; }
.payment-result-card h1 { margin: 6px 0 8px; font-size: clamp(2rem, 7vw, 2.7rem); line-height: 1.35; }
.payment-result-card > p { margin: 0 auto 24px; color: var(--muted); font-size: .86rem; }
.payment-receipt { margin: 0 0 24px; padding: 8px 18px; border-radius: 16px; background: #f8f4ed; }
.payment-receipt div { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.payment-receipt div:last-child { border-bottom: 0; }
.payment-receipt dt { color: var(--muted); font-size: .72rem; }
.payment-receipt dd { margin: 0; font-family: Vazirmatn, sans-serif; font-size: .78rem; font-weight: 850; }
.payment-result-actions { display: grid; gap: 10px; }
.payment-result-card .button { width: 100%; }
@media (max-width: 600px) {
  .payment-result-page main { padding: 28px 14px; }
  .payment-result-card { border-radius: 24px; }
}
