/* ==========================================================================
   Continental Game — Payment Studio 1.13.0
   Professional, titled payment section for the official WooCommerce Stripe
   gateway. Every rule is scoped to the checkout payment area.
   ========================================================================== */

.cgpay-payhead{
	--cgpay-ink:#101a2c;
	--cgpay-muted:#5b6b83;
	--cgpay-line:#dfe4ec;
	--cgpay-surface:#fff;
	--cgpay-stripe:#635bff;
	box-sizing:border-box;
	display:block;
	margin:0 0 18px;
	padding:0;
	font-family:inherit;
	color:var(--cgpay-ink);
	text-align:left;
}
.cgpay-payhead *{box-sizing:border-box}

/* ---- Title ------------------------------------------------------------- */
.cgpay-payhead__title{display:block;margin:0 0 12px}
.cgpay-payhead__h{
	margin:0;
	font-size:1.15rem;
	line-height:1.25;
	font-weight:700;
	letter-spacing:-.015em;
	color:var(--cgpay-ink)!important;
}
.cgpay-payhead__intro{
	margin:6px 0 0;
	font-size:.875rem;
	line-height:1.55;
	color:var(--cgpay-muted)!important;
}

/* ---- Stripe badge ------------------------------------------------------ */
.cgpay-stripe-badge{
	display:flex;
	align-items:flex-start;
	gap:14px;
	padding:14px 16px;
	border:1px solid var(--cgpay-line);
	border-radius:12px;
	background:linear-gradient(180deg,#fbfbff,#f6f7fd);
	box-shadow:0 1px 2px rgba(16,26,44,.04);
}
.cgpay-stripe-badge__mark{
	flex:none;
	display:flex;
	align-items:center;
	justify-content:center;
	width:64px;
	height:34px;
	padding:6px 8px;
	border-radius:8px;
	background:var(--cgpay-stripe);
	color:#fff;
	box-shadow:0 2px 6px rgba(99,91,255,.32);
}
.cgpay-stripe-badge__mark .cgpay-wordmark{width:100%;height:100%;display:block}
.cgpay-stripe-badge__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.cgpay-stripe-badge__lead{
	display:inline-flex;
	align-items:center;
	gap:7px;
	font-size:.95rem;
	font-weight:700;
	line-height:1.35;
	color:var(--cgpay-ink)!important;
}
.cgpay-stripe-badge__lead .cgpay-lock{width:15px;height:15px;flex:none;color:#1a7f43}
.cgpay-stripe-badge__sub{
	font-size:.8rem;
	line-height:1.5;
	color:var(--cgpay-muted)!important;
	overflow-wrap:anywhere;
}

/* ---- Card brands ------------------------------------------------------- */
.cgpay-brands{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.cgpay-brands__label{
	font-size:.66rem;
	font-weight:700;
	letter-spacing:.13em;
	text-transform:uppercase;
	color:var(--cgpay-muted)!important;
}
.cgpay-brands__row{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.cgpay-brand{
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:3px;
	min-width:42px;
	height:26px;
	padding:0 7px;
	border:1px solid transparent;
	border-radius:5px;
	font:700 9.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
	letter-spacing:.04em;
}
.cgpay-brand-text{display:inline-block}
.cgpay-brand-dots{display:inline-flex;margin-right:1px}
.cgpay-brand-dots i{display:block;width:9px;height:9px;border-radius:50%}
.cgpay-brand-dots i+i{margin-left:-4px}

/* ---- "via Stripe" chip on each method label ---------------------------- */
.cgpay-via{
	display:inline-flex;
	align-items:center;
	height:19px;
	margin-left:8px;
	padding:0 7px;
	border-radius:999px;
	background:rgba(99,91,255,.1);
	color:#4b45c6!important;
	font:600 10.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
	letter-spacing:.02em;
	text-transform:none;
	vertical-align:middle;
	white-space:nowrap;
}

/* ==========================================================================
   The method list itself
   The reported problem: the payment box was a short scrolling window, so
   Alipay / WeChat Pay / Cash App Pay / US bank account were cut off. Any
   fixed height, scrollbar or clipping on the payment container is released
   here, and the list is rebuilt as selectable cards.
   ========================================================================== */

.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-payment,
#payment,
.cgx-order #payment{
	max-height:none!important;
	height:auto!important;
	overflow:visible!important;
	background:transparent!important;
	border-radius:12px;
}

#payment ul.wc_payment_methods,
.woocommerce-checkout ul.wc_payment_methods,
ul.wc_payment_methods{
	display:block!important;
	max-height:none!important;
	height:auto!important;
	overflow:visible!important;
	margin:0 0 18px!important;
	padding:0!important;
	list-style:none!important;
	border:0!important;
	background:transparent!important;
}

ul.wc_payment_methods li.wc_payment_method,
ul.wc_payment_methods > li{
	display:block!important;
	position:relative;
	margin:0 0 10px!important;
	padding:0!important;
	border:1px solid var(--cgpay-line,#dfe4ec)!important;
	border-radius:12px!important;
	background:#fff!important;
	overflow:visible!important;
	max-height:none!important;
	list-style:none!important;
	transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
ul.wc_payment_methods li.wc_payment_method:hover{
	border-color:#bfc7d6!important;
	box-shadow:0 2px 10px rgba(16,26,44,.06);
}
ul.wc_payment_methods li.wc_payment_method.cgpay-selected,
ul.wc_payment_methods li.wc_payment_method:has(input.input-radio:checked){
	border-color:#635bff!important;
	box-shadow:0 0 0 3px rgba(99,91,255,.14);
	background:#fdfdff!important;
}

/* Row: radio + label + gateway icon */
ul.wc_payment_methods li.wc_payment_method > input.input-radio{
	position:absolute;
	left:16px;
	top:19px;
	width:18px;
	height:18px;
	margin:0!important;
	accent-color:#635bff;
	cursor:pointer;
	z-index:2;
}
ul.wc_payment_methods li.wc_payment_method > label{
	display:flex!important;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	min-height:56px;
	margin:0!important;
	padding:14px 16px 14px 46px!important;
	font-size:.95rem!important;
	font-weight:600!important;
	line-height:1.4!important;
	color:#101a2c!important;
	cursor:pointer;
	overflow-wrap:anywhere;
}
ul.wc_payment_methods li.wc_payment_method > label img{
	display:inline-block;
	width:auto!important;
	max-width:150px!important;
	max-height:26px!important;
	height:auto!important;
	margin:0 0 0 auto!important;
	padding:0!important;
	float:none!important;
	border:0!important;
	box-shadow:none!important;
	vertical-align:middle;
	object-fit:contain;
}
ul.wc_payment_methods li.wc_payment_method > label a.about_paypal{
	margin-left:8px;
	font-size:.75rem;
	font-weight:500;
}

/* Expanded method body (the Stripe Payment Element mounts in here) */
ul.wc_payment_methods li.wc_payment_method .payment_box{
	position:static!important;
	display:block;
	width:auto!important;
	margin:0!important;
	padding:4px 16px 18px!important;
	border:0!important;
	border-top:1px solid #eef1f6!important;
	border-radius:0 0 12px 12px!important;
	background:#fff!important;
	color:#3d4b60!important;
	font-size:.875rem!important;
	line-height:1.6!important;
	max-height:none!important;
	overflow:visible!important;
	box-shadow:none!important;
}
ul.wc_payment_methods li.wc_payment_method .payment_box::before,
ul.wc_payment_methods li.wc_payment_method .payment_box::after{display:none!important;content:none!important}
ul.wc_payment_methods li.wc_payment_method .payment_box p{margin:10px 0 0;color:#3d4b60!important}
ul.wc_payment_methods li.wc_payment_method .payment_box p:first-child{margin-top:6px}

/* Stripe's own field wrappers must never be clipped or shrunk. */
.payment_box .wc-stripe-elements-field,
.payment_box .wc-stripe-iban-element-field,
.payment_box #wc-stripe-payment-element,
.payment_box #wc-stripe-upe-element,
.payment_box [id^="wc-stripe"],
.payment_box [class^="wc-stripe"],
.payment_box .StripeElement{
	min-height:44px;
	max-height:none!important;
	overflow:visible!important;
	box-sizing:border-box;
}
.payment_box .StripeElement,
.payment_box .wc-stripe-elements-field{
	padding:11px 12px;
	border:1px solid #d7dce5;
	border-radius:9px;
	background:#fff;
}

/* Saved-card radio rows and the "use a new card" block */
.payment_box .woocommerce-SavedPaymentMethods{margin:8px 0 0;padding:0;list-style:none}
.payment_box .woocommerce-SavedPaymentMethods-token,
.payment_box .woocommerce-SavedPaymentMethods-new{
	display:flex;
	align-items:center;
	gap:9px;
	margin:0 0 6px;
	padding:9px 11px;
	border:1px solid #e6eaf1;
	border-radius:9px;
	background:#fbfcfe;
}

/* Express checkout (Apple Pay / Google Pay / Link) block above the list */
#wc-stripe-express-checkout-element,
.wc-stripe-express-checkout-element,
#wc-stripe-payment-request-wrapper,
.wc-block-checkout__express-payment{
	max-height:none!important;
	overflow:visible!important;
	margin-bottom:14px;
}

/* Place-order row */
#payment .place-order,
.woocommerce-checkout #payment div.form-row.place-order{
	padding:16px 0 0!important;
	margin:0!important;
	border-top:1px solid #e8ecf2;
	background:transparent!important;
}
#payment .place-order .button,
#payment #place_order{
	width:100%;
	min-height:52px;
	border-radius:10px;
	font-size:1rem;
	font-weight:700;
	letter-spacing:.01em;
}
#payment .woocommerce-terms-and-conditions-wrapper{margin:0 0 12px}

/* Payment-method fee/description badges stay readable on dark themes too. */
ul.wc_payment_methods li.wc_payment_method > label,
ul.wc_payment_methods li.wc_payment_method .payment_box,
.cgpay-payhead__h,
.cgpay-payhead__intro{-webkit-text-fill-color:currentColor}

/* ---- Block checkout ---------------------------------------------------- */
.wc-block-checkout__payment-method .cgpay-payhead{margin-bottom:14px}
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option{max-height:none!important;overflow:visible!important}
.wp-block-woocommerce-checkout-payment-block{max-height:none!important;overflow:visible!important}

/* ---- Responsive -------------------------------------------------------- */
@media(max-width:600px){
	.cgpay-stripe-badge{flex-direction:column;gap:10px;padding:13px 14px}
	.cgpay-stripe-badge__mark{width:58px;height:31px}
	ul.wc_payment_methods li.wc_payment_method > label{
		padding:13px 14px 13px 42px!important;
		font-size:.92rem!important;
	}
	ul.wc_payment_methods li.wc_payment_method > input.input-radio{left:14px;top:18px}
	ul.wc_payment_methods li.wc_payment_method > label img{max-width:112px!important;max-height:22px!important}
	.cgpay-payhead__h{font-size:1.06rem}
}

@media(prefers-reduced-motion:reduce){
	ul.wc_payment_methods li.wc_payment_method{transition:none}
}

/* Print / high contrast safety */
@media(forced-colors:active){
	.cgpay-stripe-badge,
	ul.wc_payment_methods li.wc_payment_method{border:1px solid CanvasText!important}
	.cgpay-via{border:1px solid CanvasText}
}