
/* LibraMed Checkout UI v0.2.3
 * Presentation only. No WooCommerce/LearnPress/Gradebook business logic.
 */

body.woocommerce-checkout:not(.woocommerce-order-received) {
	--lmcui-navy: #172a52;
	--lmcui-text: #1f2937;
	--lmcui-muted: #667085;
	--lmcui-accent: #12b8c4;
	--lmcui-accent-dark: #0e9ea9;
	--lmcui-line: #e5e9ef;
	--lmcui-soft: #f6f9fb;
	--lmcui-white: #fff;
	background: #f8fafc;
}

body.woocommerce-checkout .site-content,
body.woocommerce-checkout #main-content {
	background: #f8fafc;
}

body.woocommerce-checkout .woocommerce {
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
}

.lmcui-intro {
	margin: 18px 0 28px;
	padding: 0 2px;
}
.lmcui-eyebrow {
	margin: 0 0 6px;
	color: var(--lmcui-accent);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .14em;
}
.lmcui-intro h1 {
	margin: 0;
	color: var(--lmcui-navy);
	font-size: clamp(30px, 4vw, 44px);
	line-height: 1.08;
	font-weight: 750;
}
.lmcui-lead {
	max-width: 720px;
	margin: 10px 0 18px;
	color: var(--lmcui-muted);
	font-size: 15px;
}
.lmcui-steps {
	display: flex;
	gap: 22px;
	flex-wrap: wrap;
	color: var(--lmcui-muted);
	font-size: 13px;
}
.lmcui-steps span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}
.lmcui-steps b,
.lmcui-section-label span {
	display: inline-grid;
	place-items: center;
	min-width: 28px;
	height: 28px;
	border-radius: 999px;
	background: #e8f8fa;
	color: var(--lmcui-accent-dark);
	font-size: 12px;
	font-weight: 800;
}

.lmcui-section-label {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	color: var(--lmcui-navy);
}
.lmcui-section-label strong {
	font-size: 18px;
	font-weight: 750;
}

body.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(330px, .85fr);
	column-gap: 30px;
	align-items: start;
}
body.woocommerce-checkout form.checkout > #customer_details {
	grid-column: 1;
	grid-row: 2 / span 4;
}
body.woocommerce-checkout form.checkout > .lmcui-section-label:not(.lmcui-order-label) {
	grid-column: 1;
	grid-row: 1;
}
body.woocommerce-checkout form.checkout > .lmcui-order-label,
body.woocommerce-checkout form.checkout > #order_review_heading,
body.woocommerce-checkout form.checkout > #order_review {
	grid-column: 2;
}
body.woocommerce-checkout form.checkout > .lmcui-order-label { grid-row: 1; }
body.woocommerce-checkout form.checkout > #order_review_heading { grid-row: 2; }
body.woocommerce-checkout form.checkout > #order_review { grid-row: 3; }

body.woocommerce-checkout #customer_details,
body.woocommerce-checkout #order_review {
	background: var(--lmcui-white);
	border: 1px solid var(--lmcui-line);
	border-radius: 16px;
	box-shadow: 0 8px 28px rgba(23, 42, 82, .06);
}
body.woocommerce-checkout #customer_details {
	padding: 24px;
}
body.woocommerce-checkout #order_review {
	padding: 22px;
	position: sticky;
	top: 24px;
}
body.woocommerce-checkout #order_review_heading {
	display: none !important;
}

/* Billing form */
body.woocommerce-checkout .woocommerce-billing-fields > h3 {
	margin: 0 0 18px;
	color: var(--lmcui-navy);
	font-size: 20px;
}
body.woocommerce-checkout .form-row {
	margin-bottom: 14px;
}
body.woocommerce-checkout .form-row label {
	color: var(--lmcui-text);
	font-size: 13px;
	font-weight: 650;
	margin-bottom: 6px;
}
body.woocommerce-checkout .form-row .required {
	color: var(--lmcui-accent-dark);
	text-decoration: none;
}
body.woocommerce-checkout input.input-text,
body.woocommerce-checkout textarea,
body.woocommerce-checkout select,
body.woocommerce-checkout .select2-container .select2-selection--single {
	width: 100%;
	min-height: 48px;
	border: 1px solid #d8dee8 !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: var(--lmcui-text) !important;
	box-shadow: none !important;
	padding: 10px 13px;
	transition: border-color .15s ease, box-shadow .15s ease;
}
body.woocommerce-checkout textarea {
	min-height: 86px;
	resize: vertical;
}
body.woocommerce-checkout input.input-text:focus,
body.woocommerce-checkout textarea:focus,
body.woocommerce-checkout select:focus {
	border-color: var(--lmcui-accent) !important;
	box-shadow: 0 0 0 3px rgba(18, 184, 196, .12) !important;
	outline: none !important;
}

/* Existing email gate and new-account box */
body.woocommerce-checkout .checkout-email-gate,
body.woocommerce-checkout #lp-new-account-fields {
	border: 1px solid var(--lmcui-line) !important;
	border-radius: 14px !important;
	background: #f3fbfc !important;
	box-shadow: none !important;
	padding: 18px !important;
	margin: 0 0 20px !important;
}
body.woocommerce-checkout #lp-new-account-fields .lp-new-account-heading {
	color: var(--lmcui-navy);
	font-size: 17px;
	line-height: 1.35;
	margin: 0 0 12px;
}

/* Coupon/login notices */
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout .woocommerce-form-login-toggle {
	margin-bottom: 16px;
}
body.woocommerce-checkout .woocommerce-info {
	border: 1px solid #dcecf0;
	border-top: 1px solid #dcecf0;
	border-radius: 12px;
	background: #f3fbfc;
	color: var(--lmcui-text);
}
body.woocommerce-checkout .woocommerce-info::before {
	color: var(--lmcui-accent-dark);
}

/* Order card */
body.woocommerce-checkout #order_review table.shop_table {
	border: 0;
	border-collapse: collapse;
	margin: 0 0 18px;
}
body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
	border-color: var(--lmcui-line);
	padding: 13px 6px;
}
body.woocommerce-checkout #order_review .product-name {
	color: var(--lmcui-navy);
	font-weight: 650;
}
body.woocommerce-checkout #order_review .order-total th,
body.woocommerce-checkout #order_review .order-total td {
	color: var(--lmcui-navy);
	font-size: 17px;
	font-weight: 800;
}

/* Payment */
body.woocommerce-checkout #payment {
	background: transparent;
}
body.woocommerce-checkout #payment ul.payment_methods {
	border: 0;
	padding: 4px 0 14px;
}
body.woocommerce-checkout #payment ul.payment_methods li {
	margin: 0 0 8px;
	padding: 12px;
	border: 1px solid var(--lmcui-line);
	border-radius: 10px;
	background: #fff;
}
body.woocommerce-checkout #payment div.payment_box {
	background: var(--lmcui-soft);
	border-radius: 10px;
	color: var(--lmcui-text);
}
body.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: var(--lmcui-soft);
}
body.woocommerce-checkout #payment .place-order {
	padding: 14px 0 0;
}
body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
	width: 100%;
	min-height: 52px;
	border: 0 !important;
	border-radius: 11px !important;
	background: var(--lmcui-accent) !important;
	color: #fff !important;
	font-size: 16px;
	font-weight: 750;
	letter-spacing: 0;
	box-shadow: none !important;
	text-transform: none;
}
body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout #place_order:focus {
	background: var(--lmcui-accent-dark) !important;
	color: #fff !important;
}

/* Keep existing cart controls usable but visually quiet. */
body.woocommerce-checkout .checkout-qty-wrapper {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}
body.woocommerce-checkout .checkout-qty-wrapper .qty {
	max-width: 72px;
	min-height: 36px;
}
body.woocommerce-checkout .checkout-remove-item {
	color: #8a94a6;
	text-decoration: none;
	font-size: 22px;
	line-height: 1;
}
body.woocommerce-checkout .checkout-remove-item:hover {
	color: #c0392b;
}

/* Do not let the theme's generic black buttons leak into checkout actions. */
body.woocommerce-checkout .checkout-email-gate button,
body.woocommerce-checkout .woocommerce-form-coupon button,
body.woocommerce-checkout .checkout-social-login .button {
	border-radius: 10px !important;
	box-shadow: none !important;
	text-transform: none;
}

/* Validation */
body.woocommerce-checkout .woocommerce-invalid input.input-text,
body.woocommerce-checkout .woocommerce-invalid textarea,
body.woocommerce-checkout .woocommerce-invalid select {
	border-color: #c0392b !important;
}
body.woocommerce-checkout .woocommerce-error {
	border-radius: 12px;
}

/* Mobile */
@media (max-width: 900px) {
	body.woocommerce-checkout form.checkout {
		display: block;
	}
	body.woocommerce-checkout #customer_details,
	body.woocommerce-checkout #order_review {
		padding: 18px;
	}
	body.woocommerce-checkout #order_review {
		position: static;
	}
	body.woocommerce-checkout .lmcui-order-label {
		margin-top: 26px;
	}
}
@media (max-width: 520px) {
	.lmcui-intro h1 { font-size: 30px; }
	.lmcui-steps { gap: 12px; }
	body.woocommerce-checkout #customer_details,
	body.woocommerce-checkout #order_review {
		border-radius: 12px;
		padding: 15px;
	}
}


/* =========================================================
 * v0.1.1 — Eduma classic-checkout compatibility
 * Eduma gives #customer_details / #order_review legacy widths/floats.
 * Reset only on the checkout screen so CSS Grid owns the layout.
 * ========================================================= */

body.woocommerce-checkout:not(.woocommerce-order-received) .page-title,
body.woocommerce-checkout:not(.woocommerce-order-received) .top-heading,
body.woocommerce-checkout:not(.woocommerce-order-received) .page-title-wrapper,
body.woocommerce-checkout:not(.woocommerce-order-received) .learn-press-breadcrumb + h1 {
	/* Kept as fallback selectors; JS below hides only a matching legacy title. */
}

body.woocommerce-checkout form.checkout > #customer_details,
body.woocommerce-checkout form.checkout > #order_review {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	clear: none !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout form.checkout > #customer_details .col-1,
body.woocommerce-checkout form.checkout > #customer_details .col-2 {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout form.checkout > #order_review,
body.woocommerce-checkout form.checkout > #order_review * {
	box-sizing: border-box;
}

body.woocommerce-checkout #order_review table.shop_table {
	width: 100% !important;
	table-layout: auto !important;
}

body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
	width: auto !important;
	max-width: none !important;
	white-space: normal !important;
	overflow-wrap: anywhere;
	word-break: normal;
}

body.woocommerce-checkout #order_review table.shop_table .product-name {
	width: 68% !important;
}

body.woocommerce-checkout #order_review table.shop_table .product-total {
	width: 32% !important;
	text-align: right;
	white-space: nowrap !important;
}

body.woocommerce-checkout #payment,
body.woocommerce-checkout #payment ul.payment_methods,
body.woocommerce-checkout #payment ul.payment_methods > li,
body.woocommerce-checkout #payment .payment_box,
body.woocommerce-checkout #payment .place-order,
body.woocommerce-checkout #payment .woocommerce-privacy-policy-text {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	float: none !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout #payment ul.payment_methods > li {
	display: block !important;
}

body.woocommerce-checkout #payment ul.payment_methods > li > label {
	display: inline !important;
	width: auto !important;
}

body.woocommerce-checkout #payment div.payment_box {
	margin: 10px 0 0 !important;
	padding: 14px !important;
	line-height: 1.5;
}

body.woocommerce-checkout #payment .woocommerce-privacy-policy-text {
	line-height: 1.55;
	font-size: 13px;
	color: var(--lmcui-muted);
}

body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
	float: none !important;
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	white-space: normal !important;
}

/* Give the summary enough real room on desktop. */
@media (min-width: 901px) {
	body.woocommerce-checkout form.checkout {
		grid-template-columns: minmax(0, 1fr) minmax(390px, 430px) !important;
		column-gap: 34px !important;
	}
}

/* Theme may keep a very narrow internal payment column. */
body.woocommerce-checkout #order_review .woocommerce-checkout-payment {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
}

/* Preserve full-width layout on tablet/mobile. */
@media (max-width: 900px) {
	body.woocommerce-checkout form.checkout > #customer_details,
	body.woocommerce-checkout form.checkout > #order_review {
		width: 100% !important;
	}
}


/* =========================================================
 * v0.1.2 — hard reset of Eduma checkout geometry
 * Screenshot verification showed that Eduma still constrains the checkout
 * form/review container itself. Force the complete checkout form and both
 * classic WooCommerce columns to own their desktop widths.
 * ========================================================= */

body.woocommerce-checkout:not(.woocommerce-order-received) .woocommerce,
body.woocommerce-checkout:not(.woocommerce-order-received) .woocommerce form.checkout {
	width: 100% !important;
	max-width: 1180px !important;
	min-width: 0 !important;
	float: none !important;
	clear: both !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout:not(.woocommerce-order-received) .woocommerce form.checkout {
	margin-left: auto !important;
	margin-right: auto !important;
}

@media (min-width: 901px) {
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 410px !important;
		column-gap: 34px !important;
		align-items: start !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > #customer_details {
		grid-column: 1 !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		float: none !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > #order_review,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .woocommerce-checkout-review-order {
		grid-column: 2 !important;
		width: 410px !important;
		min-width: 410px !important;
		max-width: 410px !important;
		justify-self: stretch !important;
		float: none !important;
		clear: none !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .lmcui-order-label {
		grid-column: 2 !important;
		width: 410px !important;
		min-width: 410px !important;
		max-width: 410px !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .lmcui-section-label:not(.lmcui-order-label) {
		grid-column: 1 !important;
	}
}

/* Kill legacy widths inside the review card too. */
body.woocommerce-checkout #order_review > *,
body.woocommerce-checkout #order_review .shop_table,
body.woocommerce-checkout #order_review .woocommerce-checkout-payment,
body.woocommerce-checkout #order_review #payment,
body.woocommerce-checkout #order_review #payment > *,
body.woocommerce-checkout #order_review .payment_methods,
body.woocommerce-checkout #order_review .payment_methods li,
body.woocommerce-checkout #order_review .payment_box,
body.woocommerce-checkout #order_review .form-row.place-order {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	float: none !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout #order_review .shop_table {
	display: table !important;
	table-layout: fixed !important;
}

body.woocommerce-checkout #order_review .shop_table thead,
body.woocommerce-checkout #order_review .shop_table tbody,
body.woocommerce-checkout #order_review .shop_table tfoot {
	width: 100% !important;
}

body.woocommerce-checkout #order_review .shop_table .product-name {
	width: 65% !important;
	overflow-wrap: break-word !important;
	word-break: normal !important;
}

body.woocommerce-checkout #order_review .shop_table .product-total {
	width: 35% !important;
	text-align: right !important;
}

body.woocommerce-checkout #order_review #payment .payment_methods li {
	display: block !important;
	padding: 14px !important;
}

body.woocommerce-checkout #order_review #payment .payment_methods li label {
	display: inline !important;
	width: auto !important;
	max-width: none !important;
	white-space: normal !important;
}

body.woocommerce-checkout #order_review #payment .payment_box {
	display: block !important;
	margin: 12px 0 0 !important;
	padding: 14px 16px !important;
	overflow-wrap: normal !important;
	word-break: normal !important;
}

body.woocommerce-checkout #order_review #payment .payment_box p,
body.woocommerce-checkout #order_review .woocommerce-privacy-policy-text,
body.woocommerce-checkout #order_review .woocommerce-privacy-policy-text p {
	width: 100% !important;
	max-width: none !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: normal !important;
}

@media (max-width: 900px) {
	body.woocommerce-checkout:not(.woocommerce-order-received) .woocommerce form.checkout {
		display: block !important;
		max-width: 100% !important;
	}
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > #order_review,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .woocommerce-checkout-review-order,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .lmcui-order-label {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
	}
}


/* =========================================================
 * v0.1.3 — Eduma #order_review internal layout reset
 * The outer 410px column is now correct, but Eduma still lays out the
 * order table/payment children horizontally. Stack them vertically.
 * ========================================================= */

body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout #order_review,
body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout .woocommerce-checkout-review-order {
	display: block !important;
	flex-direction: initial !important;
	align-items: initial !important;
	justify-content: initial !important;
}

body.woocommerce-checkout #order_review > .lmcui-payment-label,
body.woocommerce-checkout #order_review > table.shop_table,
body.woocommerce-checkout #order_review > .woocommerce-checkout-payment,
body.woocommerce-checkout #order_review > #payment {
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	float: none !important;
	clear: both !important;
	position: static !important;
}

body.woocommerce-checkout #order_review > table.shop_table {
	display: table !important;
}

body.woocommerce-checkout #order_review .lmcui-payment-label {
	margin-top: 18px !important;
	margin-bottom: 12px !important;
}

body.woocommerce-checkout #order_review #payment,
body.woocommerce-checkout #order_review .woocommerce-checkout-payment {
	padding: 0 !important;
}

body.woocommerce-checkout #order_review #payment ul.payment_methods {
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 0 12px !important;
}

body.woocommerce-checkout #order_review #payment ul.payment_methods > li {
	display: block !important;
	width: 100% !important;
	margin: 0 0 10px !important;
	padding: 14px 16px !important;
}

body.woocommerce-checkout #order_review #payment .payment_box {
	width: 100% !important;
	margin: 12px 0 0 !important;
	padding: 14px 16px !important;
}

body.woocommerce-checkout #order_review #payment .place-order {
	display: block !important;
	width: 100% !important;
	padding: 14px 0 0 !important;
	margin: 0 !important;
}

body.woocommerce-checkout #order_review #payment .woocommerce-privacy-policy-text {
	display: block !important;
	width: 100% !important;
	margin: 0 0 14px !important;
}

body.woocommerce-checkout #order_review #payment #place_order {
	display: block !important;
	width: 100% !important;
	min-width: 100% !important;
	margin: 0 !important;
}


/* =========================================================
 * v0.1.4 — exact Eduma wrapper fix confirmed in DevTools
 * DOM on production:
 *   form#lp-checkout-form
 *     .col2-set#customer_details
 *     .lmcui-order-label
 *     .col2-set
 *       .inner-col-set   <-- Eduma constrains this to ~175px + 30px padding
 *
 * Reset ONLY the order-side Eduma wrapper. Business logic untouched.
 * ========================================================= */

@media (min-width: 901px) {
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set {
		grid-column: 2 !important;
		width: 410px !important;
		min-width: 410px !important;
		max-width: 410px !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
		padding: 0 !important;
		box-sizing: border-box !important;
	}

	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		display: block !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		float: none !important;
		clear: both !important;
		margin: 0 !important;
		padding: 22px !important;
		box-sizing: border-box !important;
	}

	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set > * {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		float: none !important;
		box-sizing: border-box !important;
	}
}

/* The exact payment DOM shown in DevTools. */
body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment,
body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment > ul.wc_payment_methods,
body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment > ul.wc_payment_methods > li.wc_payment_method,
body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment .payment_box,
body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment .form-row.place-order {
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	float: none !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment > ul.wc_payment_methods {
	margin: 0 !important;
	padding: 0 0 12px !important;
}

body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment > ul.wc_payment_methods > li.wc_payment_method {
	margin: 0 0 10px !important;
	padding: 14px 16px !important;
}

body.woocommerce-checkout form#lp-checkout-form .inner-col-set #payment .payment_box {
	margin: 12px 0 0 !important;
	padding: 14px 16px !important;
}

@media (max-width: 900px) {
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set,
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		float: none !important;
		box-sizing: border-box !important;
	}
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		padding: 18px !important;
	}
}


/* =========================================================
 * v0.2.0 — UX refinement
 * IMPORTANT: no fields are removed and no required validation is bypassed.
 * Logged-in users get a denser editable form; guests keep the guided flow.
 * ========================================================= */

.lmcui-profile-note {
	margin: 0 0 18px;
	padding: 14px 16px;
	border: 1px solid #d8edf0;
	border-radius: 12px;
	background: #f3fbfc;
	color: var(--lmcui-text);
	font-size: 13px;
	line-height: 1.5;
}
.lmcui-profile-note strong {
	display: block;
	margin-bottom: 2px;
	color: var(--lmcui-navy);
	font-size: 14px;
}

/* Logged-in: make the already-known participant data easier to scan/edit. */
@media (min-width: 760px) {
	body.lmcui-user-logged-in #customer_details .woocommerce-billing-fields__field-wrapper {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px 18px;
	}
	body.lmcui-user-logged-in #customer_details .woocommerce-billing-fields__field-wrapper > .form-row {
		width: 100% !important;
		max-width: none !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
	}
	/* Long professional fields remain comfortable to edit. */
	body.lmcui-user-logged-in #customer_details .woocommerce-billing-fields__field-wrapper > .form-row.lmcui-wide-field {
		grid-column: 1 / -1;
	}
}

/* Guest checkout remains a guided single-column form. */
body.lmcui-user-guest #customer_details .woocommerce-billing-fields__field-wrapper {
	display: block;
}
body.lmcui-user-guest #customer_details .woocommerce-billing-fields__field-wrapper > .form-row {
	width: 100% !important;
	float: none !important;
}

/* Cleaner order summary: quantity/removal stay functional but less visually noisy. */
body.woocommerce-checkout #order_review .product-name .product-quantity {
	font-weight: 600;
	color: var(--lmcui-muted);
}
body.woocommerce-checkout #order_review .checkout-remove-item {
	display: inline-grid;
	place-items: center;
	width: 22px;
	height: 22px;
	margin-left: 5px;
	border-radius: 999px;
	background: #fff4f3;
	color: #b42318 !important;
	font-size: 17px;
	font-weight: 700;
	text-decoration: none !important;
	vertical-align: middle;
}

/* Visually separate payment from totals without changing gateway markup. */
body.woocommerce-checkout #order_review .lmcui-payment-label {
	padding-top: 4px;
	border-top: 1px solid var(--lmcui-line);
}
body.woocommerce-checkout #order_review #payment ul.payment_methods > li {
	transition: border-color .15s ease, background-color .15s ease;
}
body.woocommerce-checkout #order_review #payment ul.payment_methods > li:has(input[type="radio"]:checked) {
	border-color: #9bdde2 !important;
	background: #f8feff !important;
}

/* Reduce empty visual weight on desktop while keeping readable cards. */
@media (min-width: 901px) {
	body.woocommerce-checkout #customer_details {
		padding: 24px 26px;
	}
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		padding: 20px !important;
	}
}

/* Mobile stays one-column and touch-friendly. */
@media (max-width: 759px) {
	.lmcui-profile-note {
		padding: 12px 14px;
	}
}


/* =========================================================
 * v0.2.1 — guest account block placement
 * Moves the existing password block after participant data.
 * No input names/IDs/validation/account logic are changed.
 * ========================================================= */

body.lmcui-user-guest #customer_details .lmcui-account-step {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 24px 0 10px;
	padding-top: 20px;
	border-top: 1px solid var(--lmcui-line);
}

body.lmcui-user-guest #customer_details .lmcui-account-step > span {
	display: inline-grid;
	place-items: center;
	flex: 0 0 28px;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	background: #e8f8fa;
	color: var(--lmcui-accent-dark);
	font-size: 12px;
	font-weight: 800;
}

body.lmcui-user-guest #customer_details .lmcui-account-step strong {
	display: block;
	color: var(--lmcui-navy);
	font-size: 16px;
	line-height: 1.3;
}

body.lmcui-user-guest #customer_details .lmcui-account-step small {
	display: block;
	margin-top: 3px;
	color: var(--lmcui-muted);
	font-size: 13px;
	line-height: 1.45;
}

body.lmcui-user-guest #customer_details #lp-new-account-fields {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 18px !important;
	box-sizing: border-box !important;
}

/* Avoid showing two competing headings inside the same account card. */
body.lmcui-user-guest #customer_details #lp-new-account-fields .lp-new-account-heading {
	margin-bottom: 8px;
}

@media (max-width: 759px) {
	body.lmcui-user-guest #customer_details .lmcui-account-step {
		margin-top: 20px;
	}
}


/* =========================================================
 * v0.2.2 — wider order/payment column on desktop
 * UX only. No checkout/payment/account logic changed.
 * ========================================================= */

@media (min-width: 1100px) {
	body.woocommerce-checkout form#lp-checkout-form {
		grid-template-columns: minmax(0, 1fr) 470px !important;
		column-gap: 34px !important;
	}

	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set {
		width: 470px !important;
		min-width: 470px !important;
		max-width: 470px !important;
	}

	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		padding: 20px !important;
	}

	body.woocommerce-checkout #order_review table.shop_table th.product-name,
	body.woocommerce-checkout #order_review table.shop_table td.product-name {
		width: 58% !important;
	}

	body.woocommerce-checkout #order_review table.shop_table th.product-total,
	body.woocommerce-checkout #order_review table.shop_table td.product-total {
		width: 42% !important;
		white-space: nowrap;
	}
}

@media (min-width: 901px) and (max-width: 1099px) {
	body.woocommerce-checkout form#lp-checkout-form > .lmcui-order-label + .col2-set {
		width: 430px !important;
		min-width: 430px !important;
		max-width: 430px !important;
	}
}


/* =========================================================
 * v0.2.3 — sticky order/payment card on desktop
 * Keeps the existing order/payment summary visible while the
 * participant form is longer. Presentation only.
 * ========================================================= */

@media (min-width: 1100px) {
	body.woocommerce-checkout:not(.woocommerce-order-received)
	form#lp-checkout-form > .lmcui-order-label + .col2-set {
		align-self: start !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received)
	form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		position: sticky !important;
		top: 24px !important;
		z-index: 5 !important;
	}
}

/* Never use sticky on tablet/mobile. */
@media (max-width: 1099px) {
	body.woocommerce-checkout
	form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		position: static !important;
		top: auto !important;
	}
}

/* Logged-in WordPress admin bar: keep the sticky card below it. */
@media (min-width: 1100px) {
	body.admin-bar.woocommerce-checkout:not(.woocommerce-order-received)
	form#lp-checkout-form > .lmcui-order-label + .col2-set > .inner-col-set {
		top: 56px !important;
	}
}
