/* Pay your invoice (pay.html, scripts/pay.js). */
.pay-wrap{max-width:640px}
.pay-card{background:var(--color-surface);border:1px solid var(--color-divider);border-radius:14px;padding:24px;display:grid;gap:16px;margin:0 0 20px}
.pay-card label{display:grid;gap:6px;font-weight:700}
.pay-card input[type=text]{min-height:48px;font-size:1.1rem;padding:0 12px;border:1px solid var(--color-control-border);border-radius:8px}
.pay-step{margin:0;font-size:1.4rem}
.pay-intro,.pay-note,.pay-help{margin:0;color:var(--color-text-muted)}
.pay-go{width:100%;justify-content:center;min-height:56px;font-size:1.1rem}
.pay-mode{background:#fff4e5;border:1px solid var(--color-warning);border-radius:10px;padding:10px 14px;font-weight:700;margin:0 0 16px}
.pay-off{font-size:1.1rem;font-weight:700}
.pay-facts{display:grid;gap:8px;margin:0}
.pay-facts div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--color-divider);padding:6px 0}
.pay-facts dt{color:var(--color-text-muted)}
.pay-facts dd{margin:0;text-align:right;font-weight:600}
.pay-facts .pay-due dd,.pay-facts .pay-due dt{font-size:1.25rem;font-weight:800;color:var(--color-text)}
.pay-amount{border:0;padding:0;margin:0;display:grid;gap:10px}
.pay-amount legend{font-weight:800;margin-bottom:6px}
.pay-card .pay-choice{display:flex;align-items:center;gap:10px;font-weight:600}
.pay-card [hidden]{display:none}