/* v1.9.11 reskin — the portal now wears the same black-and-gold as the site
 * and the app (accent #c8a24b) instead of the old white-card/navy look that
 * read as a third-party widget on the page where we ask for card details.
 * Layout and class structure are unchanged; this is palette + polish only.
 * NOTE: .pbp-cc-field stays WHITE — Clover renders the card inputs inside its
 * own iframes with dark text, which would vanish on a dark background. */
.pbp-wrap{--pbp-bg:#171c22;--pbp-bg2:#1e242c;--pbp-line:#2a323c;--pbp-ink:#e8edf2;--pbp-muted:#9aa7b4;--pbp-gold:#c8a24b;--pbp-gold2:#e0be6a;--pbp-gold-ink:#20160a;max-width:560px;margin:0 auto;color:var(--pbp-ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5}
.pbp-card{background:var(--pbp-bg);border:1px solid var(--pbp-line);border-radius:16px;padding:28px;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.pbp-h{font-size:22px;margin:0 0 6px;font-weight:600;color:var(--pbp-ink)}
.pbp-sub{color:var(--pbp-muted);margin:0 0 18px;font-size:14px}
.pbp-brand{font-weight:600;color:var(--pbp-gold)}
.pbp-label{display:block;font-weight:600;font-size:14px;margin:14px 0 6px;color:var(--pbp-ink)}
.pbp-input{width:100%;padding:13px 14px;font-size:17px;border:1px solid var(--pbp-line);border-radius:10px;background:var(--pbp-bg2);color:var(--pbp-ink);box-sizing:border-box}
.pbp-input::placeholder{color:#5f6b78}
.pbp-input:focus{outline:2px solid var(--pbp-gold);border-color:var(--pbp-gold)}
.pbp-code{text-align:center;letter-spacing:.4em;font-size:24px}
.pbp-btn{margin-top:16px;width:100%;padding:14px;font-size:16px;font-weight:700;color:var(--pbp-gold-ink);background:linear-gradient(180deg,var(--pbp-gold2),var(--pbp-gold));border:0;border-radius:10px;cursor:pointer}
.pbp-btn:hover{filter:brightness(1.06)}
.pbp-btn-secondary{background:transparent;color:var(--pbp-ink);border:1px solid var(--pbp-line)}
.pbp-btn-secondary:hover{background:var(--pbp-bg2);border-color:var(--pbp-gold);filter:none}
.pbp-btn-sm{margin-top:0;width:auto;padding:8px 14px;font-size:14px}
.pbp-msg{padding:12px 14px;border-radius:10px;font-size:14px;margin-bottom:16px}
.pbp-err{background:#2e1414;color:#f29b98;border:1px solid #5a2320}
.pbp-ok{background:#12291d;color:#7ee2a8;border:1px solid #1f9d55}
.pbp-hint{color:var(--pbp-muted);font-size:13px;margin-top:14px}
.pbp-hint a{color:var(--pbp-gold)}
.pbp-account{max-width:640px;margin:0 auto}
.pbp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px}
.pbp-logout{margin:0}
.pbp-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.pbp-stat{background:var(--pbp-bg,#171c22);border:1px solid var(--pbp-line,#2a323c);border-radius:12px;padding:16px}
.pbp-stat-l{font-size:12px;color:var(--pbp-muted,#9aa7b4)}
.pbp-stat-v{font-size:24px;font-weight:600;margin-top:4px;color:var(--pbp-ink,#e8edf2)}
.pbp-loans{margin-top:16px;display:flex;flex-direction:column;gap:12px}
.pbp-loan{border:1px solid var(--pbp-line,#2a323c);border-radius:12px;padding:16px;background:var(--pbp-bg2,#1e242c)}
.pbp-loan-main{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.pbp-item{font-weight:600}
.pbp-meta{font-size:12px;color:var(--pbp-muted,#9aa7b4)}
.pbp-meta strong{color:var(--pbp-gold2,#e0be6a)}
.pbp-note{font-size:12px;color:var(--pbp-muted,#9aa7b4);font-style:italic;margin-top:4px}
.pbp-right{text-align:right;white-space:nowrap}
.pbp-badge{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:999px}
.pbp-badge-active{background:#12291d;color:#7ee2a8}
.pbp-badge-other{background:#232a33;color:#9aa7b4}
.pbp-amt{font-size:20px;font-weight:700;margin-top:2px}
.pbp-redeem{font-size:11px;color:var(--pbp-muted,#9aa7b4)}
.pbp-amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.pbp-amt-box{background:#171c22;border:1px solid #2a323c;border-radius:10px;padding:10px 12px;text-align:center}
.pbp-amt-l{font-size:11px;color:var(--pbp-muted,#9aa7b4);text-transform:uppercase;letter-spacing:.4px}
.pbp-amt-v{font-size:18px;font-weight:700;margin-top:3px}
/* v1.9.11: highlight RENEW (2nd box) — it's the action the button below takes.
 * The old rule tinted Pick up, which can't even be paid online. */
.pbp-amt-box:nth-child(2){background:#2b2415;border-color:#c8a24b}
.pbp-amt-box:nth-child(2) .pbp-amt-l{color:#e0be6a}
.pbp-pay-form{margin-top:12px}
.pbp-pay-btn{margin-top:12px}
.pbp-pay-btn:disabled{background:#3a414b;color:#8a94a0;cursor:not-allowed}
.pbp-paynote{font-size:11px;color:var(--pbp-muted,#9aa7b4);margin-top:6px;text-align:center}
.pbp-foot{text-align:center;color:var(--pbp-muted,#9aa7b4);font-size:12px;margin-top:20px}
.pbp-pay-panel{margin-top:12px;padding:14px;background:#171c22;border:1px solid #2a323c;border-radius:10px}
.pbp-cc-field{background:#fff;border:1px solid #2a323c;border-radius:10px;padding:0 12px;margin-top:8px;height:46px;overflow:hidden;box-sizing:border-box;display:flex;align-items:center}
.pbp-cc-field iframe{width:100% !important;height:44px !important;min-height:0 !important;border:0 !important;display:block}
.pbp-cc-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pbp-cc-col{min-width:0}
.pbp-cc-cap{font-size:10px;color:var(--pbp-muted,#9aa7b4);text-transform:uppercase;letter-spacing:.4px;margin-top:4px;text-align:center}
.pbp-cc-postalnote{font-size:12px;color:var(--pbp-muted,#9aa7b4);margin:10px 0 0}
.pbp-cc-postalnote strong{color:var(--pbp-gold2,#e0be6a)}
.pbp-pay-submit{margin-top:12px}
/* v1.9.11: success confirmation shown in place of the pay form */
.pbp-success{text-align:center;padding:10px 4px}
.pbp-success-mark{width:52px;height:52px;margin:0 auto 10px;border-radius:50%;background:#12291d;color:#7ee2a8;border:1px solid #1f9d55;font-size:28px;font-weight:700;display:flex;align-items:center;justify-content:center}
.pbp-success-h{font-size:17px;font-weight:700;color:var(--pbp-ink,#e8edf2)}
.pbp-success-l{font-size:13px;color:var(--pbp-muted,#9aa7b4);margin-top:10px}
.pbp-success-date{font-size:22px;font-weight:700;color:var(--pbp-gold2,#e0be6a);margin-top:2px}
.pbp-success-note{font-size:12px;color:var(--pbp-muted,#9aa7b4);margin-top:14px}
.pbp-pay-msg{font-size:13px;margin-top:10px}
.pbp-pay-msg.pbp-err{color:#f29b98;background:transparent;border:0;padding:0}
.pbp-pay-msg.pbp-ok{color:#7ee2a8;background:transparent;border:0;padding:0}
@media(max-width:520px){.pbp-summary{grid-template-columns:1fr 1fr}.pbp-stat-v{font-size:20px}.pbp-amounts{grid-template-columns:1fr 1fr}.pbp-amt-v{font-size:16px}.pbp-cc-row{grid-template-columns:1fr}}
