/* Payment page (pay.musclefuelx.com): indigo header card with the order lookup, summary ticket, total card, Square badge */
body.sc-clean { background: #f9fafb; }
body.sc-clean .sc-clean-head { display: none !important; }
body.sc-clean .sc-main { padding: 0; background: #f9fafb; }
body.sc-clean .sc-main > .sc-wrap { max-width: none; padding: 0; }

.sc-pay { font-family: 'Inter', Arial, sans-serif; max-width: 1400px; margin: 0 auto; padding: 100px 24px 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 36px; align-items: start; box-sizing: border-box; }

/* left: indigo hero with the ticket card overlapping its bottom */
.sc-pay-left { position: relative; }
.sc-pay-hero { position: relative; box-sizing: border-box; height: 340px; padding: 36px; border-radius: 20px; background: #6366f1; color: #fff; overflow: hidden; }
.sc-pay-hero::after { content: ""; position: absolute; left: 24px; right: 24px; bottom: 36px; height: 24px; border-radius: 12px; background: #5558e3; }
.sc-pay-ico { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin: 0 0 24px; border-radius: 50%; background: #4f46e5; }
.sc-pay-ico svg { width: 34px; height: 34px; stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sc-pay-hero h2 { margin: 0 0 8px; font-size: 30px; line-height: 1.25; font-weight: 700; color: #fff; text-transform: none; letter-spacing: 0; }
.sc-pay-hero p { margin: 0; font-size: 21px; line-height: 1.3; font-weight: 400; color: rgba(255, 255, 255, .85); opacity: 1; }

.sc-pay-card { position: relative; z-index: 2; box-sizing: border-box; width: calc(100% - 72px); margin: -60px auto 0; padding: 12px 0 0; border: 0; border-radius: 0 0 14px 14px; background: #fff; box-shadow: 0 10px 30px rgba(15, 23, 42, .08); }
.sc-pay-fetch { display: flex; flex-wrap: nowrap; gap: 0; margin: 0 38px 40px; }
.sc-pay-fetch input { flex: 1.3 1 0; min-width: 0; height: 56px; padding: 0 18px; border: 1px solid #e5e7eb; border-radius: 0; background: #fff; font: 400 21px 'Inter', Arial, sans-serif; color: #111827; outline: 0; box-sizing: border-box; }
.sc-pay-fetch input::placeholder { color: #6b7280; }
.sc-pay-fetch input[type=email] { flex: 1 1 0; border-left: 0; font-size: 16px; }
.sc-pay-fetch input:focus { border-color: #6366f1; }
.sc-pay-fetch button { flex: none; height: 56px; padding: 0 20px; border: 0; border-radius: 0 6px 6px 0; background: #0d6efd; color: #fff; font: 500 21px 'Inter', Arial, sans-serif; cursor: pointer; transition: background .2s; }
.sc-pay-fetch button:hover { background: #0b5ed7; }
.sc-pay-fetch button svg { width: 24px; height: 24px; margin-right: 6px; vertical-align: -5px; stroke: #fff; fill: none; stroke-width: 2; }
.sc-pay-err { margin: -22px 38px 18px !important; color: #dc2626; font-size: 15px; }

.sc-pay-no { display: flex !important; align-items: center !important; gap: 12px !important; width: auto !important; margin: 0 18px 24px !important; padding: 0 !important; border: 0 !important; }
.sc-pay-no span { width: 60px !important; height: 60px !important; border-radius: 6px !important; background: #6366f1 !important; color: #fff !important; font-size: 21px !important; font-weight: 700 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.sc-pay-no small { display: block !important; font-size: 19px !important; color: #6b7280 !important; font-weight: 400 !important; }
.sc-pay-no small.ph { color: #9ca3af !important; }
.sc-pay-no b { display: block !important; font-size: 20px !important; font-weight: 700 !important; color: #111827 !important; }
.sc-pay-line { display: flex !important; justify-content: space-between !important; align-items: center !important; width: auto !important; margin: 0 18px !important; padding: 13px 0 !important; border: 0 !important; }
.sc-pay-line span { font-size: 21px !important; color: #4b5563 !important; font-weight: 400 !important; }
.sc-pay-line b { font-size: 22px !important; color: #111827 !important; font-weight: 500 !important; }
.sc-pay-line.sc-pay-total { position: relative; margin: 22px 0 0 !important; padding: 34px 18px 28px !important; border-top: 1px dashed #e5e7eb !important; }
.sc-pay-line.sc-pay-total::before, .sc-pay-line.sc-pay-total::after { content: ""; position: absolute; top: -11px; width: 22px; height: 22px; border-radius: 50%; background: #f9fafb; }
.sc-pay-line.sc-pay-total::before { left: -11px; }
.sc-pay-line.sc-pay-total::after { right: -11px; }
.sc-pay-line.sc-pay-total span { font-size: 21px !important; font-weight: 500 !important; color: #111827 !important; }
.sc-pay-line.sc-pay-total b { font-size: 26px !important; font-weight: 600 !important; color: #6366f1 !important; }

/* right: total + proceed */
.sc-pay-right { box-sizing: border-box; padding: 36px; border: 0; border-radius: 20px; background: #fff; box-shadow: 0 10px 30px rgba(15, 23, 42, .06); text-align: center; }
.sc-pay-right .sc-pay-amt { font-size: 44px !important; line-height: 62px !important; font-weight: 400 !important; color: #e53e2c !important; }
.sc-pay-right .sc-pay-amt .sc-pay-tot { font-size: inherit !important; }
.sc-pay-right .sc-pay-go { display: flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; width: 100% !important; min-height: 84px !important; margin-top: 52px !important; border-radius: 12px !important; background: #6366f1 !important; color: #fff !important; font: 600 24px 'Inter', Arial, sans-serif !important; letter-spacing: 0 !important; text-decoration: none !important; box-shadow: none !important; }
.sc-pay-right .sc-pay-go:hover { background: #4f52e0 !important; }
.sc-pay-right .sc-pay-go.off { opacity: 1 !important; pointer-events: none !important; }
.sc-pay-right .sc-pay-wallet { width: 26px !important; height: 26px !important; }

/* Square badge + statement lines */
.sc-pay-trust { max-width: 1365px !important; margin: 56px auto 0 !important; padding: 0 24px 70px !important; box-sizing: border-box; font-family: 'Inter', Arial, sans-serif; font-size: 28px !important; line-height: 1.7 !important; color: #111 !important; text-align: center; }
.sc-pay-trust img { display: block; width: 100% !important; max-width: 1365px !important; height: auto; margin: 0 auto 4px !important; }
.sc-pay-trust p { margin: 0 !important; }

@media (max-width: 1000px) {
	.sc-pay { grid-template-columns: 1fr; row-gap: 28px; padding: 40px 16px 0; }
	.sc-pay-hero { height: auto; min-height: 300px; padding: 28px; }
	.sc-pay-hero h2 { font-size: 24px; }
	.sc-pay-hero p { font-size: 17px; }
	.sc-pay-card { width: calc(100% - 32px); margin-top: -50px; }
	.sc-pay-fetch { margin: 0 16px 28px; }
	.sc-pay-fetch input, .sc-pay-fetch button { height: 48px; font-size: 16px; }
	.sc-pay-right .sc-pay-amt { font-size: 32px !important; line-height: 46px !important; }
	.sc-pay-right .sc-pay-go { min-height: 62px !important; font-size: 19px !important; margin-top: 30px !important; }
	.sc-pay-line span, .sc-pay-line b { font-size: 17px !important; }
	.sc-pay-trust { font-size: 17px !important; padding-bottom: 50px !important; }
}
.sc-pay-right .sc-pay-wallet { stroke: #fff; fill: none; stroke-width: 2; flex: none; }
.sc-pay-line b .woocommerce-Price-amount, .sc-pay-line b bdi, .sc-pay-line b .woocommerce-Price-currencySymbol { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; }