/* TestRoute Checkout v3.1 — 18 UX fixes applied */

body.tr-checkout {
	--trco-navy: #0d1b2a;
	--trco-green: #03c988;
	--trco-green-dk: #02a873;
	--trco-green-ink: #026644;
	--trco-ink: #0d1b2a;
	--trco-sub: #415a77;
	--trco-muted: #778da9;
	--trco-card: #f4f5f7;
	--trco-white: #ffffff;
	--trco-bg: #f8f9fa;
	--trco-bdr: #e0e3e7;
	--trco-r: 14px;
	--trco-rs: 8px;
	--trco-ri: 6px;
	--trco-font: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}


/* PAGE */
body.tr-checkout { background:var(--trco-navy)!important; padding:0!important; margin:0!important }
body.tr-checkout #content,body.tr-checkout .x-container,body.tr-checkout .e-content,body.tr-checkout .x-main,body.tr-checkout main,body.tr-checkout article,body.tr-checkout .entry-content { background:transparent!important }

/* PRELOADER KILL [fix for continue button] */
body.tr-checkout .ppress-checkout__form__preloader { display:none!important; pointer-events:none!important }


/* CONTAINER */
.tr-checkout .ppress-checkout__form { max-width:940px!important; margin:0 auto 40px!important; padding:20px 24px 0!important; font-family:var(--trco-font)!important; -webkit-font-smoothing:antialiased!important; display:block!important }
.tr-checkout .ppress-checkout__form * { font-family:var(--trco-font)!important }


/* GO BACK */
.trco-goback { display:inline-flex!important; align-items:center!important; gap:4px!important; font-size:12px!important; color:rgba(255,255,255,.35)!important; text-decoration:none!important; margin-bottom:12px!important; font-family:var(--trco-font)!important; -webkit-font-smoothing:antialiased!important; transition:color .15s!important }
.trco-goback:hover { color:rgba(255,255,255,.65)!important }
.trco-goback svg { flex-shrink:0!important }


/* PROGRESS */
.trco-prog { display:flex!important; gap:4px!important; margin-bottom:12px!important }
.trco-prog__dot { flex:1!important; height:3px!important; border-radius:2px!important; background:rgba(255,255,255,.08)!important; transition:background .3s!important }
.trco-prog__dot--dn { background:var(--trco-green)!important }
.trco-prog__dot--ac { background:rgba(255,255,255,.22)!important }


/* GRID — two columns [#6: merged into single media block] */
.trco-grid { display:grid!important; grid-template-columns:minmax(0,1fr) 280px!important; gap:20px!important; align-items:start!important }
.trco-grid .ppress-checkout-section.ppress-checkout_main { width:100%!important; order:1!important; padding:0!important }
.trco-grid .ppress-checkout-section.ppress-checkout_side_section { width:100%!important; order:2!important; margin:0!important; position:sticky!important; top:20px!important }

@media(max-width:720px) {
	.trco-grid { grid-template-columns:1fr!important }
	.trco-grid .ppress-checkout-section.ppress-checkout_side_section { position:static!important; margin-top:12px!important }
}

.tr-checkout .ppress-checkout__form[class*="ppressui"] .ppress-checkout-section { width:100%!important; padding:0!important }


/* ACCORDION CARD [#15: softer contrast transition with subtle glow] */
.tr-checkout .trco-accordion { background:var(--trco-card)!important; border-radius:var(--trco-r)!important; padding:14px!important; border:1px solid rgba(255,255,255,.06)!important }


/* STEPS */
.trco-s { margin-bottom:5px!important }
.trco-s:last-child { margin-bottom:0!important }

.trco-s__h { display:flex!important; align-items:center!important; gap:10px!important; padding:10px 14px!important; border-radius:var(--trco-rs)!important; cursor:pointer!important; transition:background .15s!important }

.trco-s__n { width:22px!important; height:22px!important; border-radius:50%!important; display:flex!important; align-items:center!important; justify-content:center!important; font-size:9px!important; font-weight:600!important; flex-shrink:0!important }

.trco-s__inf { flex:1!important; min-width:0!important }
.trco-s__t { font-size:13px!important; font-weight:600!important; color:var(--trco-ink)!important }
.trco-s__sum { font-size:11px!important; color:var(--trco-sub)!important; margin-top:1px!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; display:none }
.trco-s__edit { font-size:10px!important; color:var(--trco-green-ink)!important; font-weight:500!important; flex-shrink:0!important; display:none }

/* [#10: smooth body transition] */
.trco-s__b { background:var(--trco-white)!important; border:1.5px solid var(--trco-ink)!important; border-top:none!important; border-radius:0 0 var(--trco-rs) var(--trco-rs)!important; padding:12px 14px!important; overflow:hidden!important; transition:padding .2s ease!important }

/* Active */
.trco-s--ac>.trco-s__h { background:var(--trco-white)!important; border:1.5px solid var(--trco-ink)!important; border-bottom:none!important; border-radius:var(--trco-rs) var(--trco-rs) 0 0!important }
.trco-s--ac .trco-s__n { background:var(--trco-ink)!important; color:#fff!important }

/* Done */
.trco-s--dn>.trco-s__h { background:var(--trco-white)!important; border:1px solid var(--trco-bdr)!important; border-radius:var(--trco-rs)!important }
.trco-s--dn>.trco-s__h:hover { background:#fafafa!important }
.trco-s--dn .trco-s__n { background:var(--trco-green)!important; color:#fff!important }
.trco-s--dn .trco-s__t { font-size:11px!important }
.trco-s--dn .trco-s__b { display:none!important }

/* Locked */
.trco-s--lk>.trco-s__h { background:rgba(0,0,0,.015)!important; border:1px solid #eaebee!important; border-radius:var(--trco-rs)!important; opacity:.35!important; cursor:default!important }
.trco-s--lk .trco-s__n { background:#e4e5e8!important; color:#999!important }
.trco-s--lk .trco-s__b { display:none!important }


/* PILLS [#7: bigger tap targets] [#8: stronger selected state] [#14: clear hover] */
.trco-pills-w { margin:0!important; padding:0!important; border:none!important }
.trco-pills { display:flex!important; gap:5px!important; margin-bottom:8px!important }

.trco-pill { flex:1!important; padding:8px 6px!important; border:1.5px solid var(--trco-bdr)!important; border-radius:var(--trco-ri)!important; background:var(--trco-white)!important; text-align:center!important; cursor:pointer!important; transition:border-color .15s,background .15s,box-shadow .15s!important; display:block!important; min-height:44px!important }
.trco-pill:hover { border-color:var(--trco-green)!important; background:rgba(3,201,136,.02)!important }
.trco-pill--sel { border-color:var(--trco-green)!important; background:rgba(3,201,136,.07)!important; box-shadow:0 0 0 1px var(--trco-green)!important }

.trco-pill__radio { position:absolute!important; opacity:0!important; width:0!important; height:0!important }
.trco-pill__c { display:block!important }
.trco-pill__name { display:block!important; font-size:11px!important; font-weight:600!important; color:var(--trco-ink)!important; margin-bottom:2px!important }
.trco-pill__pr { display:block!important; font-size:10px!important; color:var(--trco-sub)!important }

/* [#4: discounted price visible — block layout, better contrast] */
.trco-pill__og { text-decoration:line-through!important; color:#999!important; font-size:9px!important; display:block!important; margin-bottom:1px!important }
.trco-pill--sel .trco-pill__og { color:#888!important }
.trco-pill__dc { color:var(--trco-green-ink)!important; font-weight:600!important; font-size:10px!important; display:block!important }
.trco-pill__dur { display:block!important; font-size:8px!important; color:var(--trco-muted)!important; margin-top:2px!important }

/* [#13: focus ring on pills] */
.trco-pill:focus-within { outline:2px solid var(--trco-green)!important; outline-offset:1px!important }

.trco-single-plan { display:flex!important; justify-content:space-between!important; align-items:center!important; padding:10px 14px!important; background:var(--trco-white)!important; border:1.5px solid var(--trco-green)!important; border-radius:var(--trco-ri)!important; margin-bottom:8px!important }
.trco-single-plan__name { font-size:13px!important; font-weight:600!important; color:var(--trco-ink)!important }
.trco-single-plan__price { font-size:14px!important; font-weight:700!important; color:var(--trco-ink)!important }


/* BENEFITS [#3: checkmark rows instead of tags] */
.trco-bens { display:flex!important; flex-direction:column!important; gap:4px!important; font-size:12px!important; color:var(--trco-ink)!important; padding:6px 2px!important; background:transparent!important; margin-bottom:8px!important; line-height:1.4!important }
.trco-ben { display:flex!important; align-items:flex-start!important; gap:6px!important; white-space:normal!important; font-size:12px!important; color:var(--trco-ink)!important }
.trco-ben svg { flex-shrink:0!important; margin-top:2px!important; color:var(--trco-green)!important }

@media(min-width:500px) {
	.trco-bens { display:grid!important; grid-template-columns:1fr 1fr!important; gap:4px 14px!important }
}


/* CTA [#9: larger text, letter-spacing, min-height] [#13: focus ring] [#17: loading state] */
.trco-cta { display:block!important; width:100%!important; padding:12px!important; background:var(--trco-green)!important; color:var(--trco-ink)!important; border:none!important; border-radius:var(--trco-ri)!important; font-family:var(--trco-font)!important; font-size:13px!important; font-weight:700!important; letter-spacing:0.02em!important; text-align:center!important; cursor:pointer!important; -webkit-font-smoothing:antialiased!important; -webkit-tap-highlight-color:transparent!important; user-select:none!important; box-sizing:border-box!important; position:relative!important; z-index:100!important; pointer-events:auto!important; min-height:44px!important; transition:background .15s,opacity .15s!important }
.trco-cta:hover { background:var(--trco-green-dk)!important }
.trco-cta:active { opacity:.85!important }
.trco-cta:focus { outline:2px solid var(--trco-green-dk)!important; outline-offset:2px!important }
.trco-cta.trco-cta--loading { opacity:.6!important; pointer-events:none!important; cursor:wait!important }


/* ACCOUNT HEADER [#5: properly styled link with hover] */
.trco-acct-h { display:flex!important; justify-content:space-between!important; align-items:center!important; margin-bottom:8px!important }
.trco-acct-h__l { font-size:12px!important; font-weight:600!important; color:var(--trco-ink)!important }
.trco-acct-h__r { font-size:11px!important; color:var(--trco-green-ink)!important; font-weight:500!important; text-decoration:none!important; font-family:var(--trco-font)!important }
.trco-acct-h__r:hover { text-decoration:underline!important; color:var(--trco-green-dk)!important }


/* FORM FIELDS */
.tr-checkout .ppress-main-checkout-form__block legend { display:none!important }
.tr-checkout .ppress-main-checkout-form__block label { color:var(--trco-sub)!important; font-size:11px!important; font-weight:500!important; margin-bottom:3px!important; display:block!important }

.tr-checkout .ppress-main-checkout-form__block input[type="text"],
.tr-checkout .ppress-main-checkout-form__block input[type="email"],
.tr-checkout .ppress-main-checkout-form__block input[type="password"],
.tr-checkout .ppress-main-checkout-form__block input[type="tel"],
.tr-checkout .ppress-main-checkout-form__block select {
	background:var(--trco-bg)!important; border:1px solid var(--trco-bdr)!important; border-radius:var(--trco-ri)!important;
	padding:0 10px!important; font-size:14px!important; color:var(--trco-ink)!important; width:100%!important;
	height:40px!important; min-height:40px!important; -webkit-appearance:none!important; appearance:none!important;
	transition:border-color .15s,box-shadow .15s!important
}

.tr-checkout .ppress-main-checkout-form__block input:focus,
.tr-checkout .ppress-main-checkout-form__block select:focus { border-color:var(--trco-green)!important; box-shadow:0 0 0 2px rgba(3,201,136,.12)!important; outline:none!important; background:var(--trco-white)!important }

.tr-checkout .ppress-main-checkout-form__block__item { margin-bottom:8px!important; padding:0!important }
.tr-checkout .ppress-required { color:#e24b4a!important }
.tr-checkout .ppress-main-checkout-form__block__item.ppress-co-half { width:calc(50% - 4px)!important }


/* PAYMENT */
.tr-checkout .ppress-checkout-form__payment_method { border:1.5px solid var(--trco-bdr)!important; border-radius:var(--trco-ri)!important; overflow:hidden!important; background:var(--trco-white)!important; margin-bottom:8px!important }
.tr-checkout .ppress-checkout-form__payment_method.ppress-active { border-color:var(--trco-green)!important }
.tr-checkout .ppress-checkout-form__payment_method__title_wrap { padding:10px 12px!important }
.tr-checkout .ppress-checkout-form__payment_method__label { font-weight:500!important; font-size:11px!important; color:var(--trco-ink)!important }
.tr-checkout .ppress-checkout-form__payment_method__content_wrap { padding:0 12px 12px!important; border-top:1px solid var(--trco-bdr)!important }
.tr-checkout .ppress-checkout-form__payment_method__content_wrap p { color:var(--trco-sub)!important; font-size:10px!important }
.tr-checkout .ppress-checkout-form__payment_method__heading { display:none!important }
.tr-checkout fieldset#ppress_checkout_payment_methods legend { display:none!important }


/* SUBMIT */
.tr-checkout .ppress-checkout-form__place_order_wrap { margin-top:8px!important }
.tr-checkout #ppress-checkout-button { all:unset!important; display:block!important; width:100%!important; background:var(--trco-green)!important; color:var(--trco-ink)!important; font-family:var(--trco-font)!important; font-size:14px!important; font-weight:700!important; text-align:center!important; padding:14px!important; border-radius:var(--trco-ri)!important; cursor:pointer!important; -webkit-font-smoothing:antialiased!important; box-sizing:border-box!important; min-height:48px!important; letter-spacing:0.02em!important; transition:background .15s!important }
.tr-checkout #ppress-checkout-button:hover { background:var(--trco-green-dk)!important }
.tr-checkout #ppress-checkout-button:focus { outline:2px solid var(--trco-green-dk)!important; outline-offset:2px!important }


/* PRICE ANCHORING [#2: fixed px size instead of relative em] */
.trco-cur { font-size:11px!important; font-weight:400!important; color:#a0a5ad!important; vertical-align:baseline!important; margin-right:1px!important }
.trco-tot-amt .trco-cur { color:rgba(255,255,255,.35)!important }
.trco-pill__og .trco-cur { color:#bbb!important }
.tr-checkout #ppress-checkout-button .trco-cur { color:rgba(13,27,42,.4)!important }
.tr-checkout .checkout_order_summary__fee_structure__item dd .trco-cur { color:rgba(255,255,255,.35)!important }


/* TRUST [#11: larger badges, WCAG compliant] */
.trco-trust { display:flex!important; justify-content:center!important; gap:10px!important; margin-top:8px!important; flex-wrap:wrap!important }
.trco-trust__badge { display:inline-flex!important; align-items:center!important; gap:4px!important; font-size:11px!important; font-weight:500!important; color:var(--trco-sub)!important; white-space:nowrap!important }
.trco-trust__badge svg { color:var(--trco-sub)!important; flex-shrink:0!important }
.trco-onetime { text-align:center!important; font-size:11px!important; color:var(--trco-sub)!important; margin-top:4px!important }


/* SIDEBAR */
.tr-checkout .ppress-checkout_order_summary { background:rgba(27,38,59,.55)!important; border:1px solid rgba(255,255,255,.08)!important; border-radius:10px!important; color:#fff!important; overflow:hidden!important }
.tr-checkout .ppress-checkout_order_summary__plan_name,.tr-checkout .ppress-checkout_order_summary__plan_description { display:none!important }
.tr-checkout .ppress-checkout_order_summary__bottom_details { padding:14px 16px!important }

/* [#12: show plan name in sidebar] */
.trco-sidebar-plan { font-size:14px!important; font-weight:600!important; color:rgba(255,255,255,.9)!important; margin-bottom:2px!important }
.trco-sidebar-plan-sub { font-size:11px!important; color:rgba(255,255,255,.4)!important; margin-bottom:10px!important }

.tr-checkout .checkout_order_summary__fee_structure__item { color:rgba(255,255,255,.5)!important; font-size:11px!important; padding:3px 0!important }
.tr-checkout .checkout_order_summary__fee_structure__item dt,.tr-checkout .checkout_order_summary__fee_structure__item dd { color:rgba(255,255,255,.5)!important }

/* [#18: coupon chip readable] */
.tr-checkout .checkout_order_summary__fee_structure__item dt span { background:rgba(255,255,255,.12)!important; color:rgba(255,255,255,.7)!important; font-size:10px!important; padding:1px 6px!important; border-radius:3px!important }

.tr-checkout .trco-tot-row { border-top:1px solid rgba(255,255,255,.08)!important; padding-top:6px!important; margin-top:4px!important }
.tr-checkout .trco-tot-row dt,.tr-checkout .trco-tot-row dd { color:#fff!important; font-weight:600!important }
.trco-tot-amt { font-size:16px!important; font-weight:700!important }

/* [#16: WCAG compliant one-time payment label] */
.trco-tot-once { display:block!important; font-size:10px!important; color:#03c988!important; font-weight:500!important; margin-top:2px!important }

/* Coupon [#18: readable sizes] */
.tr-checkout .ppress-checkout_order_summary__discount p,.tr-checkout .ppress-checkout_order_summary__discount a { color:rgba(255,255,255,.45)!important; font-size:10px!important }
.tr-checkout .checkout_order_summary__discount__input { background:rgba(255,255,255,.06)!important; border:1px solid rgba(255,255,255,.15)!important; color:#fff!important; border-radius:var(--trco-ri)!important; font-size:11px!important; height:32px!important }
.tr-checkout .ppress-apply-discount-btn { background:var(--trco-green)!important; color:var(--trco-navy)!important; border:none!important; border-radius:var(--trco-ri)!important; font-weight:600!important; font-size:11px!important; height:32px!important; cursor:pointer!important }


/* SOCIAL / STRIPE */
.trco-social { display:flex!important; align-items:center!important; justify-content:center!important; gap:5px!important; font-size:10px!important; font-weight:500!important; color:rgba(255,255,255,.35)!important; margin-bottom:8px!important }
.trco-social svg { color:rgba(255,255,255,.25)!important; flex-shrink:0!important }
.trco-stripe-note { text-align:center!important; font-size:9px!important; color:rgba(255,255,255,.2)!important; margin-top:8px!important }


/* TERMS / ALERTS */
.tr-checkout .ppress-checkout-form__terms_condition__checkbox__label { font-size:10px!important; color:var(--trco-sub)!important }
.tr-checkout .ppress-checkout-form__terms_condition__checkbox__label a { color:var(--trco-green-ink)!important }
.tr-checkout .ppress-checkout-form__terms_condition__content { max-height:60px!important; overflow-y:auto!important; font-size:9px!important; color:var(--trco-sub)!important }

.tr-checkout .ppress-checkout-alert.ppress-error,.tr-checkout .ppress-alert.ppress-error { background:rgba(226,75,74,.06)!important; color:#c0392b!important; border-radius:var(--trco-rs)!important; border:1px solid rgba(226,75,74,.15)!important; font-size:12px!important; padding:10px 14px!important }

.tr-checkout .ppress-checkout__form__spinner:after { border-color:var(--trco-green) transparent var(--trco-green) transparent!important }


/* ═══ DESKTOP SCALING [#1] ═══ */
@media(min-width:720px) {
	.trco-s__t { font-size:14px!important }
	.trco-pill__name { font-size:13px!important }
	.trco-pill__pr { font-size:12px!important }
	.trco-pill__og { font-size:11px!important }
	.trco-pill__dc { font-size:12px!important }
	.trco-pill__dur { font-size:10px!important }
	.trco-pill { padding:10px 8px!important }
	.trco-bens { font-size:13px!important }
	.trco-ben { font-size:13px!important }
	.trco-cta { font-size:14px!important; padding:14px!important }
	.trco-acct-h__l { font-size:13px!important }
	.trco-acct-h__r { font-size:11px!important }
}


/* ═══ MOBILE ═══ */
@media(max-width:480px) {
	.tr-checkout .ppress-checkout__form { padding:12px 12px 0!important }
	.tr-checkout .trco-accordion { padding:10px!important; border-radius:12px!important }
	.trco-s__b { padding:10px 12px!important }
	.trco-s__h { padding:9px 12px!important }
	.trco-s__n { width:18px!important; height:18px!important; font-size:8px!important }
	.trco-s__t { font-size:12px!important }
	.trco-pill { padding:7px 4px!important }
	.trco-pill__name { font-size:10px!important }
	.trco-pill__dc { font-size:9px!important }
	.trco-pill__dur { font-size:7px!important }
	.trco-bens { font-size:10px!important; gap:3px!important }
	.trco-ben { font-size:10px!important }
	.trco-ben svg { width:8px!important; height:8px!important }
	.trco-cta { padding:12px!important; font-size:13px!important; min-height:46px!important }
	.trco-goback { font-size:11px!important; margin-bottom:8px!important }
}


/* MOTION */
@media(prefers-reduced-motion:reduce) {
	.trco-prog__dot,.trco-s__h,.trco-s__b,.trco-pill,.trco-cta,.tr-checkout #ppress-checkout-button { transition:none!important }
}
