/* Pulse Moments — generic payment modal (dark luxury, navy/gold/cream) */

/* Generic pay button (shortcode + reusable) */
.pm-pay-btn{
	display:inline-block;cursor:pointer;border:none;
	font:700 15px/1 'Inter',sans-serif;letter-spacing:.3px;
	padding:14px 28px;border-radius:12px;
	background:linear-gradient(135deg,#c9a24b,#e2c074);color:#11161f;
	box-shadow:0 12px 28px -12px rgba(201,162,75,.7);
	transition:transform .15s ease,box-shadow .15s ease;
}
.pm-pay-btn:hover{transform:translateY(-2px);box-shadow:0 18px 36px -12px rgba(201,162,75,.8)}
.pm-pay-btn:active{transform:translateY(0)}

/* Overlay */
.pm-pay-overlay{
	position:fixed;inset:0;z-index:99999;display:none;
	align-items:center;justify-content:center;padding:20px;
	background:rgba(5,8,14,.78);backdrop-filter:blur(6px);
}
.pm-pay-overlay.open{display:flex;animation:pmPayFade .2s ease}
@keyframes pmPayFade{from{opacity:0}to{opacity:1}}

.pm-pay-modal{
	position:relative;width:100%;max-width:420px;
	background:linear-gradient(165deg,#1c2333,#11161f);
	border:1px solid rgba(201,162,75,.3);border-radius:22px;
	box-shadow:0 50px 100px -40px rgba(0,0,0,.9);
	padding:30px 28px 26px;color:#f5efe0;
	animation:pmPayUp .25s cubic-bezier(.16,1,.3,1);
}
@keyframes pmPayUp{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}

.pm-pay-close{
	position:absolute;top:14px;right:16px;width:34px;height:34px;
	border:none;border-radius:50%;cursor:pointer;font-size:22px;line-height:1;
	background:rgba(255,255,255,.06);color:#c8cdd8;transition:.15s;
}
.pm-pay-close:hover{background:rgba(201,162,75,.2);color:#f5efe0}

.pm-pay-head{text-align:center;margin-bottom:18px}
.pm-pay-badge{
	display:inline-block;background:linear-gradient(135deg,#c9a24b,#e2c074);
	color:#11161f;font:800 10px/1 'Inter',sans-serif;letter-spacing:1.2px;
	text-transform:uppercase;padding:6px 13px;border-radius:999px;
}
.pm-pay-head h3{
	font:700 21px/1.3 'Fraunces',serif;margin:14px 0 6px;color:#f5efe0;
}
.pm-pay-amount{font:800 30px/1 'Fraunces',serif;color:#e2c074;margin:4px 0}
.pm-pay-desc{color:#8a93a6;font-size:13px;margin:2px 0 0}

#pm-pay-form{display:flex;flex-direction:column}
.pm-pay-lbl{font:600 12px/1 'Inter',sans-serif;color:#aeb6c4;margin:14px 0 6px}
.pm-pay-lbl small{color:#6b7280;font-weight:400}
#pm-pay-form input{
	width:100%;padding:13px 15px;border-radius:11px;
	background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
	color:#f5efe0;font-size:15px;outline:none;transition:.15s;
}
#pm-pay-form input::placeholder{color:#5d6577}
#pm-pay-form input:focus{border-color:#c9a24b;background:rgba(201,162,75,.06)}

.pm-pay-msg{min-height:18px;font-size:13px;margin:12px 0 0;text-align:center}
.pm-pay-msg.err{color:#ef6e6e}
.pm-pay-msg.ok{color:#5fcf8e}

.pm-pay-submit{
	margin-top:16px;width:100%;cursor:pointer;border:none;
	font:800 16px/1 'Inter',sans-serif;padding:15px;border-radius:12px;
	background:linear-gradient(135deg,#c9a24b,#e2c074);color:#11161f;
	transition:transform .15s,box-shadow .15s,opacity .15s;
	box-shadow:0 14px 30px -12px rgba(201,162,75,.7);
}
.pm-pay-submit:hover{transform:translateY(-1px)}
.pm-pay-submit:disabled{opacity:.6;cursor:default;transform:none}
.pm-pay-secure{text-align:center;color:#6b7280;font-size:11px;margin:14px 0 0}

/* Success screen */
.pm-pay-done{text-align:center;padding:14px 6px}
.pm-pay-done__tick{
	width:70px;height:70px;margin:0 auto 18px;border-radius:50%;
	display:flex;align-items:center;justify-content:center;
	font-size:36px;color:#11161f;font-weight:800;
	background:linear-gradient(135deg,#5fcf8e,#3fae6e);
	box-shadow:0 16px 40px -14px rgba(95,207,142,.8);
	animation:pmPayPop .4s cubic-bezier(.16,1,.3,1);
}
@keyframes pmPayPop{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}
.pm-pay-done h3{font:700 22px 'Fraunces',serif;color:#f5efe0;margin:0 0 10px}
.pm-pay-done p{color:#c8cdd8;font-size:14px;line-height:1.7;margin:6px 0}
.pm-pay-ref{color:#e2c074 !important;letter-spacing:1px}
.pm-pay-rec{color:#8a93a6 !important;font-size:12px !important}

@media (max-width:480px){
	.pm-pay-modal{padding:26px 20px 22px}
	.pm-pay-amount{font-size:26px}
}
