.paddle-pay-wrap{ --b:#e6e8ef; --txt:#0f172a; --mut:#64748b; --soft:#f6f8fc; --danger:#b42318; --ok:#067647; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; }
.paddle-pay-card{ max-width: 1040px; margin: 24px auto; background:#fff; border:1px solid var(--b); border-radius:18px; box-shadow:0 12px 30px rgba(15,23,42,.08); overflow:hidden; }
.paddle-pay-head{ padding:18px 22px; background:linear-gradient(90deg,#0b1f3a,#123a74); color:#fff; }
.paddle-pay-title{ margin:0; font-size:22px; font-weight:900; }
.paddle-pay-sub{ margin-top:6px; opacity:.9; font-size:13px; }

.paddle-pay-body{ padding:18px 22px 22px; color:var(--txt); }
.paddle-pay-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:16px; align-items:start; }

.paddle-pay-qr{ background:var(--soft); border:1px solid var(--b); border-radius:16px; padding:16px; text-align:center; }
.paddle-qr-img{ width:100%; max-width:420px; height:auto; border-radius:14px; border:1px solid var(--b); background:#fff; }
.paddle-qr-note{ margin-top:10px; font-size:13px; color:var(--mut); }
.paddle-qr-missing{ padding:14px; border:1px dashed var(--b); border-radius:12px; color:var(--mut); background:#fff; }

.paddle-pay-formbox{ border:1px solid var(--b); border-radius:16px; padding:16px; background:#fff; }
.paddle-pay-alert{ padding:12px; border:1px solid rgba(180,35,24,.25); background:rgba(180,35,24,.06); border-radius:12px; color:#7a271a; margin-bottom:12px; }

.paddle-pay-field{ margin-bottom:12px; }
.paddle-pay-field label{ display:block; font-size:14px; font-weight:800; margin-bottom:6px; }
.req{ color:var(--danger); font-weight:900; margin-left:2px; }

.paddle-title, .paddle-pay-title {
  color: white;
}

.paddle-pay-field input[type="text"],
.paddle-pay-field input[type="email"],
.paddle-pay-field input[type="date"],
.paddle-pay-field input[type="file"]{
  width:100%; border:1px solid var(--b); border-radius:12px; padding:11px 12px; font-size:14px; outline:none;
}
.paddle-pay-field input:focus{ border-color: rgba(37,99,235,.55); box-shadow:0 0 0 4px rgba(37,99,235,.12); }
.paddle-help{ font-size:12px; color:var(--mut); margin-top:6px; }
.paddle-error{ font-size:12px; color:var(--danger); margin-top:6px; min-height:16px; }
.paddle-invalid{ border-color: rgba(180,35,24,.7) !important; box-shadow:0 0 0 4px rgba(180,35,24,.10) !important; }

.paddle-pay-btn{
  width:100%; border:0; border-radius:12px; padding:12px 16px; font-weight:900; cursor:pointer;
  color:#fff; background:linear-gradient(135deg,#0d47a1,#1976d2);
  display:flex; justify-content:center; align-items:center; gap:10px;
}
.paddle-payment-form.is-loading .paddle-pay-btn{ opacity:.85; cursor:wait; }
.paddle-spinner{ width:18px; height:18px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; display:none; animation:pSpin .9s linear infinite; }
.paddle-payment-form.is-loading .paddle-spinner{ display:inline-block; }
@keyframes pSpin{ to{ transform:rotate(360deg);} }

.paddle-pay-msg{ margin-top:10px; font-weight:800; font-size:14px; }
.paddle-pay-msg.ok{ color:var(--ok); }
.paddle-pay-msg.err{ color:var(--danger); }

@media (max-width: 900px){
  .paddle-pay-grid{ grid-template-columns: 1fr; }
}