.mcs-stripe-panel { margin: 0; padding: 14px 16px 10px; border: 1px solid #cbd8e0; border-radius: 7px; background: #fff; color: #243745; text-align: left; }
.mcs-stripe-panel[hidden] { display: none !important; }
.payment-choices[hidden] { display: none !important; }
.mcs-stripe-panel h3 { margin: 0 0 4px; font-size: 18px; }
.mcs-stripe-panel label { display: block; float: none; width: auto; text-align: left; font-weight: 600; margin: 12px 0 6px; }
.mcs-stripe-panel input[type=email] { box-sizing: border-box; width: 100%; min-height: 44px; border: 1px solid #aabcc8; border-radius: 6px; padding: 10px 12px; font: inherit; background: #fff; color: #243745; }
.mcs-stripe-panel input:focus-visible, .mcs-stripe-panel button:focus-visible { outline: 3px solid #8dbbd8; outline-offset: 2px; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-panel p { padding: 0; margin: 6px 0; text-align: left; line-height: 1.4; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-panel .mcs-stripe-help { font-size: 12px; color: #526571; margin: 6px 0 10px; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-panel .mcs-stripe-terms { margin: 8px 0 0; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-panel :is(#mcsStripeSummary,[data-stripe-node="mcsStripeSummary"]) { margin: 0 0 10px; font-size: 13px; }
:is(#mcsStripeElement,[data-stripe-node="mcsStripeElement"]) { margin: 12px 0; }
:is(#mcsStripeWallets,[data-stripe-node="mcsStripeWallets"]) { margin: 12px 0 0; }
:is(#mcsStripeWallets,[data-stripe-node="mcsStripeWallets"])[hidden] { display: none; }
/* Keep a measurable width while Stripe checks wallet availability, without a blank row. */
:is(#mcsStripeWallets,[data-stripe-node="mcsStripeWallets"])[data-available=false] { height: 0; margin: 0; overflow: hidden; visibility: hidden; }
.mcs-stripe-divider { display: flex; align-items: center; gap: 10px; margin: 10px 0 0; color: #526571; font-size: 12px; }
.mcs-stripe-divider::before, .mcs-stripe-divider::after { content: ''; flex: 1; border-top: 1px solid #dce4e9; }
:is(#mcsStripePay,[data-stripe-node="mcsStripePay"]) { width: 100%; min-height: 46px; background: #367ba4; color: #fff; border: 0; border-radius: 7px; font: inherit; font-weight: 700; padding: 12px; cursor: pointer; }
:is(#mcsStripePay,[data-stripe-node="mcsStripePay"]):disabled { opacity: .65; cursor: wait; }
:is(#paymentDialog,.mcs-stripe-dialog) :is(#mcsStripePay,[data-stripe-node="mcsStripePay"]) { color: #fff; }
:is(#mcsStripeMessage,[data-stripe-node="mcsStripeMessage"]) { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
:is(#mcsStripeMessage,[data-stripe-node="mcsStripeMessage"])[data-error=true] { color: #9d2727; }
:is(#paymentDialog,.mcs-stripe-dialog) :is(#mcsStripeMessage,[data-stripe-node="mcsStripeMessage"]):empty { display: none; }
:is(#paymentDialog,.mcs-stripe-dialog).mcs-stripe-active .payment-reassurance { display: none; }
:is(#paymentDialog,.mcs-stripe-dialog).mcs-stripe-active #paymentRoadsOffer { display: none !important; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice { width: auto; flex: none; gap: 5px; margin: 0; padding: 6px 8px; border: 1px solid #cbd8e0; border-radius: 5px; background: #fff; color: #367ba4; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice svg { width: 17px; height: 17px; color: currentColor; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice strong { font-size: 12px; font-weight: 600; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice small, :is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice>span:last-child { display: none; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-heading #paymentBankChoice[hidden] { display: none; }
:is(#paymentDialog,.mcs-stripe-dialog).mcs-stripe-active:not(.mcs-stripe-expanded) #paymentBankChoice { display: none; }
:is(#paymentDialog,.mcs-stripe-dialog).mcs-stripe-active .payment-security { margin: 8px 0 0; }
/* A clear next step after payment, shared by unlock, renewal and upgrade dialogs. */
:is(#mcsStripeSuccess,[data-stripe-node="mcsStripeSuccess"]) { padding: 6px 0 2px; line-height: 1.6; }
.mcs-stripe-success-actions { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px; margin:16px 0 6px; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; min-height:44px; width:auto; margin:0; padding:11px 18px; border:1px solid transparent; border-radius:6px; font:600 14px/1.35 Arial,sans-serif; text-align:center; text-decoration:none; cursor:pointer; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action-primary { background:#367ba4; border-color:#367ba4; color:#fff; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action-primary:hover { background:#28668d; border-color:#28668d; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action-secondary { background:#f5f9fc; border-color:#b9cdd9; color:#28668d; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action-secondary:hover { background:#e8f1f7; border-color:#367ba4; }
:is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action:focus-visible { outline:3px solid #8dbbd8; outline-offset:3px; }
@media(max-width:420px) { .mcs-stripe-success-actions { flex-direction:column; } :is(#paymentDialog,.mcs-stripe-dialog) .mcs-stripe-success-actions .mcs-stripe-action { width:100%; } }
@media (max-width: 520px) { .mcs-stripe-panel { padding: 12px 12px 10px; } }

/* The same Payment Element, mounted directly over the current editor/library. */
.mcs-stripe-dialog { position:fixed; inset:0; margin:auto; box-sizing:border-box; width:min(620px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; padding:0; border:1px solid #bdcdd8; border-radius:8px; background:#fff; color:#243745; font:15px Arial,sans-serif; }
.mcs-stripe-dialog [hidden] { display:none !important; }
.mcs-stripe-panel form { margin:0; }
.mcs-stripe-dialog::backdrop { background:rgba(30,69,91,.55); }
.mcs-stripe-dialog>header { display:flex; align-items:center; gap:16px; padding:18px 20px; background:#397ba7; color:#fff; }
.mcs-stripe-dialog>header h2 { margin:0; flex:1; color:inherit; font-size:22px; }
.mcs-stripe-dialog>header button { border:0; padding:0 4px; background:none; color:inherit; font:30px Arial,sans-serif; cursor:pointer; }
.mcs-stripe-upgrade-price { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#ecb224; padding:14px 20px; color:#1d2529; }
.mcs-stripe-upgrade-price p { margin:0; line-height:1.5; }
.mcs-stripe-upgrade-price p:last-child { text-align:right; }
.mcs-stripe-upgrade-price strong { font-size:27px; }
.mcs-stripe-dialog-body { padding:16px; }
.mcs-stripe-dialog .payment-security { text-align:center; font-size:12px; color:#526571; }
@media(max-width:520px){ .mcs-stripe-dialog>header { padding:14px; } .mcs-stripe-dialog>header h2 { font-size:19px; } .mcs-stripe-upgrade-price { padding:12px 14px; font-size:13px; } .mcs-stripe-dialog-body { padding:12px; } }