/**
 * Checkout page — OBLBOOT.COM design system
 * Shell max-width aligned with cart page (1500px).
 */

html[data-my-obl-checkout="1"],
html:has(body.my-obl-checkout-page),
html:has(body.woocommerce-checkout:not(.woocommerce-order-received)),
body.woocommerce-checkout:not(.woocommerce-order-received),
body.woocommerce-checkout.my-obl-checkout-page {
	background-color: #ffffff !important;
}

body.woocommerce-checkout:not(.woocommerce-order-received),
body.woocommerce-checkout.my-obl-checkout-page {
	--my-obl-checkout-max-width: 1500px;
	--my-obl-checkout-shell-pad: 30px;
	--my-obl-checkout-col-gap: 30px;
	--my-obl-checkout-billing-width-percent: 58.333333%;
	--my-obl-checkout-summary-width-percent: 41.666667%;
}

/* ── 1500px 内容壳：与购物车 #main 一致 ── */
body.woocommerce-checkout:not(.woocommerce-order-received) #main,
body.woocommerce-checkout.my-obl-checkout-page #main {
	width: 100% !important;
	max-width: var(--my-obl-checkout-max-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: var(--my-obl-checkout-shell-pad) !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout.my-obl-checkout-page #main .cart-container.container,
body.woocommerce-checkout.my-obl-checkout-page #main .checkout-page-title.page-title {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.woocommerce-checkout.my-obl-checkout-page #main .checkout-page-title .page-title-inner.container {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* 主题 custom-css：.container/.row 1770–1800px，在 #main 内强制 100%（与购物车页一致） */
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .container,
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .row,
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .row.row-large,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .container,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .row,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .row.row-large,
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .cart-container .container,
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .cart-container .row,
body.full-width.woocommerce-checkout.my-obl-checkout-page #main .cart-container .row.row-large,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .cart-container .container,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .cart-container .row,
body.woocommerce-checkout:not(.woocommerce-order-received) #main .cart-container .row.row-large,
body.woocommerce-checkout.my-obl-checkout-page #main .cart-container .container,
body.woocommerce-checkout.my-obl-checkout-page #main .cart-container .row,
body.woocommerce-checkout.my-obl-checkout-page #main .cart-container .row.row-large {
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
}

body.woocommerce-checkout.my-obl-checkout-page .cart-container.page-wrapper.page-checkout {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0;
	margin-bottom: 0;
}

body.woocommerce-checkout.my-obl-checkout-page form.checkout.woocommerce-checkout,
body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout.woocommerce-checkout,
body.woocommerce-checkout.my-obl-checkout-page .cart-container .woocommerce,
body.woocommerce-checkout:not(.woocommerce-order-received) .cart-container .woocommerce {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row::before,
body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row::after,
body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row::before,
body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row::after {
	display: none;
}

body.woocommerce-checkout:not(.woocommerce-order-received) > .my-obl-mega-panel:not(.my-obl-mega-panel--active),
body.woocommerce-checkout.my-obl-checkout-page > .my-obl-mega-panel:not(.my-obl-mega-panel--active) {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
	height: 0 !important;
	min-height: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout .is-sticky-column,
body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout .is-sticky-column__inner,
body.woocommerce-checkout.my-obl-checkout-page form.checkout .is-sticky-column,
body.woocommerce-checkout.my-obl-checkout-page form.checkout .is-sticky-column__inner {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	width: 100% !important;
	max-width: 100% !important;
	transform: none !important;
}

@media screen and (min-width: 850px) {
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row.pt-0,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row.pt-0 {
		display: flex !important;
		flex-flow: row nowrap !important;
		align-items: flex-start !important;
		gap: var(--my-obl-checkout-col-gap, 30px) !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .col.large-7,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .large-7.col,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .col.large-7,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .large-7.col {
		flex: 0 0 calc(var(--my-obl-checkout-billing-width-percent, 58.333333%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		max-width: calc(var(--my-obl-checkout-billing-width-percent, 58.333333%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		width: calc(var(--my-obl-checkout-billing-width-percent, 58.333333%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		min-width: 0;
		float: none !important;
		padding: 0 !important;
		border: none !important;
		box-sizing: border-box;
	}

	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .col.large-5,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .large-5.col,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .col.large-5,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .large-5.col {
		flex: 0 0 calc(var(--my-obl-checkout-summary-width-percent, 41.666667%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		max-width: calc(var(--my-obl-checkout-summary-width-percent, 41.666667%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		width: calc(var(--my-obl-checkout-summary-width-percent, 41.666667%) - var(--my-obl-checkout-col-gap, 30px) / 2) !important;
		min-width: 280px;
		float: none !important;
		padding: 0 !important;
		border: none !important;
		box-sizing: border-box;
	}

	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .col + .col {
		border-left: none !important;
	}
}

/* ── 订单摘要区：限制宽度，防止图标/表格撑破右栏 ── */
body.woocommerce-checkout:not(.woocommerce-order-received) #order_review,
body.woocommerce-checkout.my-obl-checkout-page #order_review {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout .large-5.col .col-inner,
body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout .col.large-5 .col-inner,
body.woocommerce-checkout.my-obl-checkout-page form.checkout .large-5.col .col-inner,
body.woocommerce-checkout.my-obl-checkout-page form.checkout .col.large-5 .col-inner {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

body.woocommerce-checkout:not(.woocommerce-order-received) #order_review .woocommerce-checkout-review-order-table,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table {
	width: 100%;
	max-width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

body.woocommerce-checkout:not(.woocommerce-order-received) #order_review .woocommerce-checkout-review-order-table th,
body.woocommerce-checkout:not(.woocommerce-order-received) #order_review .woocommerce-checkout-review-order-table td,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table th,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table td {
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

body.woocommerce-checkout:not(.woocommerce-order-received) #order_review .woocommerce-checkout-review-order-table .product-name,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table .product-name {
	width: 72%;
}

body.woocommerce-checkout:not(.woocommerce-order-received) #order_review .woocommerce-checkout-review-order-table .product-total,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table .product-total {
	width: 28%;
	text-align: right;
}

@media screen and (max-width: 849px) {
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .col.large-7,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .large-7.col,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .col.large-5,
	body.woocommerce-checkout:not(.woocommerce-order-received) form.checkout > .row > .large-5.col,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .col.large-7,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .large-7.col,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .col.large-5,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout > .row > .large-5.col {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		width: 100% !important;
		min-width: 0;
		float: none !important;
	}
}

body.woocommerce-checkout.my-obl-checkout-page .checkout-page-title.page-title {
	margin-bottom: 30px;
}

body.woocommerce-checkout.my-obl-checkout-page .shop-container {
	padding-top: 0;
	padding-bottom: 0;
}

body.woocommerce-checkout.my-obl-checkout-page .woocommerce-form-login-toggle,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-form-coupon-toggle,
body.woocommerce-checkout.my-obl-checkout-page form.woocommerce-form-login,
body.woocommerce-checkout.my-obl-checkout-page form.checkout_coupon,
body.woocommerce-checkout.my-obl-checkout-page form.woocommerce-form-coupon {
	display: none !important;
}

body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields {
	border-top: none !important;
	padding-top: 0 !important;
}

body.woocommerce-checkout.my-obl-checkout-page .my-obl-checkout-address-heading {
	margin: 0 0 16px;
	padding: 0;
	border: none;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: #111111;
	letter-spacing: 0;
	text-transform: none;
}

/* 桌面：多列表单行（字段顺序由 checkout-page-ui.php priority 控制） */
@media screen and (min-width: 850px) {
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout .woocommerce-billing-fields__field-wrapper {
		display: flex !important;
		flex-wrap: wrap;
		column-gap: 16px;
		width: 100%;
	}

	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper > .form-row,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout .woocommerce-billing-fields__field-wrapper > .form-row,
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper > p.form-row,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout .woocommerce-billing-fields__field-wrapper > p.form-row {
		float: none !important;
		clear: none !important;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}

	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_email_field,
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_first_name_field,
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_last_name_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_email_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_first_name_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_last_name_field {
		flex: 1 1 calc((100% - 32px) / 3);
		width: calc((100% - 32px) / 3) !important;
		max-width: calc((100% - 32px) / 3);
	}

	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_city_field,
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_state_field,
	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_postcode_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_city_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_state_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_postcode_field {
		flex: 1 1 calc((100% - 32px) / 3);
		width: calc((100% - 32px) / 3) !important;
		max-width: calc((100% - 32px) / 3);
	}

	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_country_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_country_field {
		flex: 1 1 calc((100% - 16px) / 4);
		width: calc((100% - 16px) / 4) !important;
		max-width: calc((100% - 16px) / 4);
	}

	body.woocommerce-checkout.my-obl-checkout-page .woocommerce-billing-fields__field-wrapper #billing_address_1_field,
	body.woocommerce-checkout.my-obl-checkout-page form.checkout #billing_address_1_field {
		flex: 1 1 calc(((100% - 16px) * 3) / 4);
		width: calc(((100% - 16px) * 3) / 4) !important;
		max-width: calc(((100% - 16px) * 3) / 4);
	}
}

@media screen and (max-width: 849px) {
	body.woocommerce-checkout.my-obl-checkout-page {
		--my-obl-checkout-shell-pad: 5px;
	}
}

/* ── 订单摘要：产品名称加黑加粗 ── */
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tbody td.product-name,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tbody td.product-name {
	color: #111111;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.4;
}

body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tbody td.product-name .product-quantity,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tbody td.product-name .product-quantity {
	color: #111111;
	font-weight: 700;
}

body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tbody td.product-name .my-obl-checkout-epo-options,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tbody td.product-name .my-obl-checkout-epo-options {
	font-weight: 400;
	color: #666666;
}

/* ── 订单摘要：合计金额与购物车合计行字体一致 ── */
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tr.order-total th,
body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tr.order-total td,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tr.order-total th,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tr.order-total td {
	font-family: var(--my-obl-cart-totals-amount-font, inherit);
	font-size: var(--my-obl-cart-totals-amount-size, 16px);
	font-weight: var(--my-obl-cart-totals-amount-weight, 700);
	color: var(--my-obl-cart-totals-amount-color, #111111);
}

body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-amount,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-amount {
	display: inline-flex;
	align-items: flex-start;
	line-height: 1.2;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}

body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-amount bdi,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-amount bdi {
	display: inline-flex;
	align-items: flex-start;
}

body.woocommerce-checkout.my-obl-checkout-page #order_review .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-currencySymbol,
body.woocommerce-checkout.my-obl-checkout-page .woocommerce-checkout-review-order-table tr.order-total .woocommerce-Price-currencySymbol {
	font-family: inherit;
	font-size: var(--my-obl-cart-price-currency-scale, 0.62em);
	font-weight: 600;
	line-height: 1;
	align-self: flex-start;
	margin-right: 0.06em;
	position: relative;
	top: 0.12em;
	color: inherit;
}