.pro-pay-overlay{
  position:fixed;inset:0;z-index:9999;
  background:rgba(15,23,42,.55);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.pro-pay-overlay[hidden]{display:none;}
.pro-pay-panel{
  background:#fff;border-radius:20px;max-width:380px;width:100%;
  padding:28px 24px 24px;text-align:center;position:relative;
  box-shadow:0 24px 60px rgba(0,0,0,.18);
}
.pro-pay-close{
  position:absolute;top:12px;right:14px;border:none;background:none;
  font-size:24px;line-height:1;color:#9ca3af;cursor:pointer;
}
.pro-pay-title{font-size:22px;font-weight:800;color:#111827;margin:0 0 6px;}
.pro-pay-sub{font-size:13px;color:#6b7280;margin:0 0 14px;line-height:1.5;}
.pro-pay-amount{font-size:28px;font-weight:800;color:#047857;margin-bottom:16px;}
.pro-pay-qr-wrap{
  position:relative;width:220px;height:220px;margin:0 auto 16px;
  border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;
  background:#fafafa;
}
.pro-pay-qr-wrap canvas{display:block;}
.pro-pay-spinner{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.85);
}
.pro-pay-spinner::after{
  content:"";width:36px;height:36px;border:3px solid #d1d5db;
  border-top-color:#047857;border-radius:50%;animation:proPaySpin .8s linear infinite;
}
@keyframes proPaySpin{to{transform:rotate(360deg);}}
.pro-pay-status{font-size:13px;color:#374151;min-height:20px;margin:0 0 12px;}
.pro-pay-status.success{color:#047857;font-weight:600;}
.pro-pay-status.error{color:#dc2626;}
.pro-pay-qr-wrap[hidden],
.pro-pay-upi-btn[hidden],
.pro-pay-mock-btn[hidden]{
  display:none !important;
}
.pro-pay-upi-btn,.pro-pay-mock-btn{
  display:inline-block;width:100%;padding:12px 16px;border-radius:10px;
  font-size:14px;font-weight:600;text-decoration:none;cursor:pointer;
  border:none;margin-top:8px;
}
.pro-pay-upi-btn{background:#047857;color:#fff;}
.pro-pay-upi-btn:hover{background:#065f46;color:#fff;}
.pro-pay-mock-btn{background:#f3f4f6;color:#374151;}
.pro-pay-mock-btn:hover{background:#e5e7eb;}