/* Payment pages share BAYAN's typography, palette and buttons. */
.payment-page{min-height:100vh;background:radial-gradient(ellipse at 10% 0%,rgba(168,120,60,.12),transparent 48%),radial-gradient(ellipse at 95% 10%,rgba(12,36,60,.09),transparent 45%),var(--cream)}
.payment-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 32px;max-width:1200px;margin:auto}
.payment-back{font-size:.88rem;color:var(--ink-soft)}
.payment-top .lang-switch{color:var(--navy);border-color:var(--line-2)}
.payment-main{max-width:520px;margin:22px auto 60px;padding:0 20px}
.payment-logo{display:block;width:105px;height:105px;object-fit:contain;margin:0 auto 20px}
.payment-sheet{background:#fff;border:1px solid var(--line);border-radius:26px;padding:32px;box-shadow:0 24px 70px -40px rgba(12,36,60,.4);border-top:3px solid var(--gold)}
.payment-sheet h1{font-size:1.8rem;margin:12px 0}
.payment-intro{font-size:.93rem;color:var(--ink-soft);margin-bottom:24px;line-height:1.9}
.payment-sheet label{display:block;font-weight:600;font-size:.88rem;margin-bottom:8px}
.payment-sheet input{width:100%;min-width:0;padding:13px 15px;border:1px solid var(--line-2);border-radius:12px;color:var(--navy);background:#fff;transition:border-color .2s,box-shadow .2s}
.payment-page :focus-visible{outline:3px solid var(--gold-400);outline-offset:3px}
.payment-sheet input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(168,120,60,.12);outline:none}
.payment-sheet input[readonly]{background:var(--cream)}
.payment-amount-wrap{position:relative}
.payment-amount-wrap input{font-family:var(--font-num);font-size:1.65rem;font-weight:600;padding:16px 18px 16px 76px;direction:ltr;text-align:right}
.payment-currency{position:absolute;left:18px;top:50%;transform:translateY(-50%);font-family:var(--font-num);font-size:.9rem;color:var(--muted)}
.payment-hint{font-size:.77rem;color:var(--muted);margin:8px 0 18px}
.payment-quick-label{font-size:.86rem;font-weight:600;margin-bottom:10px}
.payment-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.payment-quick{border:1px solid var(--line-2);border-radius:10px;padding:11px 4px;font-family:var(--font-num);font-weight:500;font-size:.88rem;background:#fff;transition:background .2s,border-color .2s}
.payment-quick:hover,.payment-quick[aria-pressed="true"]{background:var(--cream);border-color:var(--gold);color:var(--navy)}
.payment-submit{width:100%;margin-top:24px;min-height:54px}
.payment-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.payment-secure{display:flex;justify-content:center;gap:6px;align-items:center;margin-top:16px;font-size:.76rem;color:var(--muted)}
.payment-secure svg{width:15px;height:15px;flex-shrink:0}
.payment-footer{text-align:center;font-size:.77rem;color:var(--muted);margin-top:22px;line-height:2}
.payment-footer a{color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px}
.payment-error,.payment-notice{padding:12px 14px;border-radius:10px;font-size:.87rem;margin:16px 0;line-height:1.8}
.payment-error{background:#fff1f0;color:#982f29;border:1px solid #edc4c0}
.payment-notice{background:var(--cream);color:var(--ink-soft);border:1px solid var(--line)}
.payment-field{margin-top:16px}
.payment-edit{color:var(--gold);font-size:.86rem;text-decoration:underline;text-underline-offset:4px;margin-bottom:16px}
.payment-summary{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:14px 16px;background:var(--cream);border-radius:12px;margin-bottom:20px}
.payment-summary strong{font-family:var(--font-num);direction:ltr;font-size:1.1rem}
.payment-consent{display:flex;align-items:flex-start;gap:11px;padding:15px;margin-top:20px;background:var(--cream);border:1px solid var(--line);border-radius:12px}
.payment-consent input[type="checkbox"]{width:20px;height:20px;min-width:20px;flex-shrink:0;margin:3px 0 0;padding:0;accent-color:var(--gold);cursor:pointer}
.payment-consent label{font-size:.84rem;font-weight:400;color:var(--ink-soft);line-height:1.9;margin:0;cursor:pointer}
.payment-consent a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.payment-package{font-weight:600;color:var(--gold);margin:16px 0}
.payment-result{text-align:center}
.payment-result-icon{width:68px;height:68px;display:grid;place-items:center;margin:8px auto 24px;background:var(--cream);color:var(--gold);border-radius:50%;font-size:2rem}
.payment-result-icon[data-state="paid"]{background:#e8f4eb;color:#296a3c}
.payment-result-reference{font-family:var(--font-num);font-size:.8rem;overflow-wrap:anywhere;direction:ltr;margin:16px 0;color:var(--muted)}
.payment-result-amount{font-family:var(--font-num);font-size:1.7rem;color:var(--navy);direction:ltr;margin:16px 0}
.payment-result-actions{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.payment-page [hidden]{display:none!important}
.payment-busy::before{content:'';display:inline-block;width:17px;height:17px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:payment-spin .8s linear infinite}
@keyframes payment-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.payment-busy::before{animation:none}}
@media(max-width:540px){.payment-top{padding:18px 20px}.payment-main{margin-top:10px;padding:0 16px}.payment-sheet{padding:25px 22px;border-radius:22px}.payment-logo{width:88px;height:88px}.payment-sheet h1{font-size:1.6rem}}
