/** Standalone customer subscription experience. */
.xrpay-subscription-shell,
.xrpay-subscription-state {
	--xp-blue: #0052ff;
	--xp-blue-dark: #003fc4;
	--xp-ink: #172033;
	--xp-muted: #657188;
	--xp-line: #dce4f1;
	box-sizing: border-box;
	max-width: 1120px;
	margin: clamp(36px, 7vw, 88px) auto;
	color: var(--xp-ink);
	font-family: inherit;
}
.xrpay-subscription-shell *, .xrpay-subscription-shell *::before, .xrpay-subscription-shell *::after,
.xrpay-subscription-state *, .xrpay-subscription-state *::before, .xrpay-subscription-state *::after { box-sizing: border-box; }
.xrpay-subscription-checkout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(330px, .8fr); border: 1px solid var(--xp-line); background: #fdfefe; }
.xrpay-subscription-checkout__summary { min-width: 0; padding: clamp(30px, 5vw, 62px); }
.xrpay-subscription-checkout__confirm { min-width: 0; padding: clamp(30px, 4vw, 48px); border-inline-start: 1px solid var(--xp-line); background: #f5f8fd; }
.xrpay-subscription-kicker { margin: 0 0 8px !important; color: var(--xp-blue-dark); font-size: 12px; font-weight: 780; letter-spacing: .11em; text-transform: uppercase; }
.xrpay-subscription-checkout h2, .xrpay-member-account h2 { margin: 0 0 22px; color: #111a2d; font-size: clamp(32px, 5vw, 52px); font-weight: 740; letter-spacing: -.04em; line-height: 1.02; overflow-wrap: anywhere; }
.xrpay-subscription-checkout h3 { margin: 0 0 20px; color: #172033; font-size: 23px; letter-spacing: -.02em; }
.xrpay-subscription-price { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; margin-bottom: 28px; }
.xrpay-subscription-price strong { color: #10192c; font-size: clamp(28px, 4vw, 40px); letter-spacing: -.035em; }
.xrpay-subscription-price span { color: var(--xp-muted); }
.xrpay-subscription-description { max-width: 680px; color: #4f5d74; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
.xrpay-subscription-checkout__summary ul { margin: 28px 0 0; padding: 22px 0 0; border-top: 1px solid var(--xp-line); list-style: none; }
.xrpay-subscription-checkout__summary li { position: relative; margin: 0 0 11px; padding-inline-start: 24px; color: #415069; }
.xrpay-subscription-checkout__summary li::before { position: absolute; inset-inline-start: 0; color: #08765d; content: "✓"; font-weight: 800; }
.xrpay-subscription-checkout dl { margin: 0 0 22px; }
.xrpay-subscription-checkout dl > div { display: flex; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid #dce4f1; }
.xrpay-subscription-checkout dt { color: #667188; }
.xrpay-subscription-checkout dd { margin: 0; color: #172033; font-weight: 720; text-align: end; }
.xrpay-subscription-explainer { margin: 0 0 20px; padding: 16px; border: 1px solid #c9d8f1; background: #eef4fe; color: #33496d; font-size: 13px; line-height: 1.55; }
.xrpay-subscription-button { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: 11px 18px; border: 1px solid var(--xp-blue); border-radius: 0; background: var(--xp-blue); color: #fdfefe !important; font: inherit; font-size: 14px; font-weight: 730; line-height: 1.35; text-align: center; text-decoration: none !important; overflow-wrap: anywhere; cursor: pointer; }
.xrpay-subscription-button:hover, .xrpay-subscription-button:focus-visible { border-color: var(--xp-blue-dark); background: var(--xp-blue-dark); }
.xrpay-subscription-button:focus-visible, .xrpay-subscription-link:focus-visible { outline: 3px solid rgba(0,82,255,.25); outline-offset: 3px; }
.xrpay-subscription-button[disabled] { opacity: .65; cursor: wait; }
.xrpay-subscription-checkout form .xrpay-subscription-button { width: 100%; }
.xrpay-subscription-method-note { margin: 13px 0 0; color: #748096; font-size: 12px; line-height: 1.5; }
.xrpay-subscription-state { max-width: 700px; padding: clamp(34px, 6vw, 64px); border: 1px solid #dce4f1; background: #f8faff; text-align: center; }
.xrpay-subscription-state__mark { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 20px; border-radius: 50%; background: var(--xp-blue); color: #fdfefe; font-size: 12px; font-weight: 800; }
.xrpay-subscription-state h2 { margin: 0 0 10px; color: #172033; font-size: clamp(25px, 4vw, 38px); letter-spacing: -.03em; }
.xrpay-subscription-state p { max-width: 540px; margin: 0 auto 24px; color: #5d6980; line-height: 1.65; }
.xrpay-member-account > header { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(320px,1.2fr); gap: 12px 48px; align-items: end; margin-bottom: 30px; }
.xrpay-member-account > header .xrpay-subscription-kicker { grid-column: 1; }
.xrpay-member-account > header h2 { grid-column: 1; margin: 0; }
.xrpay-member-account > header > p:last-child { grid-column: 2; grid-row: 1 / span 2; margin: 0; color: var(--xp-muted); line-height: 1.6; }
.xrpay-subscription-notice { margin-bottom: 22px; padding: 15px 18px; border: 1px solid #a9d8ca; background: #eaf7f2; color: #086950; }
.xrpay-subscription-notice--owner { border-color: #efc98d; background: #fff8ec; color: #784316; }
.xrpay-subscription-notice--owner strong, .xrpay-subscription-notice--owner p { display: block; margin: 0; }
.xrpay-subscription-notice--owner p { margin-top: 6px; }
.xrpay-subscription-notice--owner a { display: inline-block; margin-top: 10px; color: #713b0c; font-weight: 700; text-underline-offset: .18em; }
.xrpay-membership-list { border-top: 1px solid var(--xp-line); }
.xrpay-membership-row { display: grid; grid-template-columns: minmax(220px,1fr) minmax(150px,.45fr) minmax(180px,.55fr); gap: 24px; align-items: center; padding: 26px 2px; border-bottom: 1px solid var(--xp-line); }
.xrpay-membership-row h3 { margin: 7px 0 4px; color: #172033; font-size: 20px; overflow-wrap: anywhere; }
.xrpay-membership-row p { margin: 0; color: var(--xp-muted); }
.xrpay-membership-status { display: inline-flex; padding: 3px 8px; border: 1px solid #d5dde9; background: #f4f6f9; color: #5b687e; font-size: 12px; font-weight: 760; letter-spacing: .03em; text-transform: uppercase; }
.xrpay-membership-status--active, .xrpay-membership-status--trialing { border-color: #a8d8c9; background: #eaf7f2; color: #08705a; }
.xrpay-membership-status--past_due, .xrpay-membership-status--pending { border-color: #ebcca2; background: #fff4e3; color: #92500e; }
.xrpay-membership-status--pending_cancel { border-color: #b9c8e4; background: #eef3fc; color: #254a8c; }
.xrpay-membership-status--cancelled, .xrpay-membership-status--expired { border-color: #e2c2c2; background: #fff1f1; color: #8e3535; }
.xrpay-membership-date span, .xrpay-membership-date strong { display: block; }
.xrpay-membership-date span { margin-bottom: 4px; color: #758095; font-size: 12px; }
.xrpay-membership-date strong { color: #26334b; }
.xrpay-membership-actions { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
.xrpay-membership-actions form { margin: 0; }
.xrpay-subscription-link { display: inline-flex; align-items: center; min-height: 44px; padding: 7px 0; border: 0; background: none; color: #8f3333; font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
.xrpay-invoice-history { margin-top: clamp(38px,7vw,70px); }
.xrpay-invoice-history h3 { margin: 0 0 15px; font-size: 22px; }
.xrpay-account-table-wrap { overflow-x: auto; scrollbar-gutter: stable; }
.xrpay-account-table-wrap:focus-visible { outline: 3px solid rgba(0,82,255,.25); outline-offset: 3px; }
.xrpay-invoice-history table { width: 100%; border-collapse: collapse; }
.xrpay-invoice-history th, .xrpay-invoice-history td { padding: 13px 12px; border-bottom: 1px solid var(--xp-line); text-align: start; white-space: nowrap; }
.xrpay-invoice-history th { color: #6d788c; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; }
.xrpay-subscription-empty { padding: 44px; border: 1px solid var(--xp-line); background: #f8faff; text-align: center; }
.xrpay-subscription-empty h3 { margin: 0 0 8px; font-size: 24px; }
.xrpay-subscription-empty p { margin: 0 0 22px; color: var(--xp-muted); }
@media (max-width:800px) {
	.xrpay-subscription-checkout { grid-template-columns: 1fr; }
	.xrpay-subscription-checkout__confirm { border-top: 1px solid var(--xp-line); border-inline-start: 0; }
	.xrpay-member-account > header { grid-template-columns: 1fr; }
	.xrpay-member-account > header .xrpay-subscription-kicker, .xrpay-member-account > header h2, .xrpay-member-account > header > p:last-child { grid-column: 1; grid-row: auto; }
	.xrpay-membership-row { grid-template-columns: 1fr 1fr; }
	.xrpay-membership-actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; }
}
@media (max-width:520px) {
	.xrpay-subscription-shell, .xrpay-subscription-state { margin-block: 24px; }
	.xrpay-membership-row { grid-template-columns: 1fr; }
	.xrpay-membership-actions { grid-column: 1; align-items: stretch; flex-direction: column; }
	.xrpay-membership-actions form, .xrpay-membership-actions .xrpay-subscription-button { width: 100%; }
	.xrpay-subscription-empty { padding: 30px 20px; }
}
@media (prefers-reduced-motion:reduce) { .xrpay-subscription-shell *, .xrpay-subscription-state * { transition:none !important; } }
@media (forced-colors:active) { .xrpay-subscription-button, .xrpay-membership-status { border:1px solid ButtonText; } }