/* ==========================================================================
   MediMix — checkout.css (cart, checkout, order received, order pay)
   WooCommerce's templates are unmodified; this file lays them out.
   ========================================================================== */

.mx-journey-page { padding-top: var(--mx-s5); }
.mx-journey-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--mx-s4); margin-bottom: var(--mx-s6); }
.mx-journey-head__title { margin: 0; }

/* Steps */
.mx-steps { display: flex; align-items: center; gap: var(--mx-s2); margin: 0; padding: 0; list-style: none; font-size: var(--mx-fs-sm); }
.mx-steps__item { display: flex; align-items: center; gap: var(--mx-s2); color: var(--mx-muted); }
.mx-steps__item + .mx-steps__item::before { content: ""; width: 24px; height: 1px; background: var(--mx-line); }
.mx-steps__num { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--mx-line); font-weight: 700; font-size: var(--mx-fs-xs); background: #fff; }
.mx-steps__item.is-current { color: var(--mx-ink); font-weight: 700; }
.mx-steps__item.is-current .mx-steps__num { background: var(--mx-ink); border-color: var(--mx-ink); color: #fff; }
.mx-steps__item.is-done { color: var(--mx-success); }
.mx-steps__item.is-done .mx-steps__num { background: var(--mx-success-soft); border-color: var(--mx-success-soft); color: var(--mx-success); }
.mx-steps a { color: inherit; }
@media (max-width: 599px) { .mx-steps__item:not(.is-current) > span:not(.mx-steps__num), .mx-steps__item:not(.is-current) > a { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); } }

.mx-continue { margin: 0 0 var(--mx-s4); }
.mx-continue a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; text-decoration: none; color: var(--mx-ink-2); }
.mx-continue a:hover { color: var(--mx-ink); }

/* Shared: WooCommerce tables */
.shop_table { width: 100%; border: 1px solid var(--mx-line); border-radius: var(--mx-r-lg); border-collapse: separate; border-spacing: 0; overflow: hidden; background: #fff; }
.shop_table th, .shop_table td { padding: 14px 16px; text-align: start; vertical-align: middle; border-bottom: 1px solid var(--mx-line-2); }
.shop_table tr:last-child > * { border-bottom: 0; }
.shop_table thead th { background: var(--mx-surface); font-size: var(--mx-fs-sm); color: var(--mx-ink-2); font-weight: 700; }
.shop_table tfoot th { font-weight: 500; color: var(--mx-ink-2); }
.shop_table .order-total th, .shop_table .order-total td { font-size: var(--mx-fs-lg); font-weight: 700; color: var(--mx-ink); }
.shop_table .product-name a { text-decoration: none; font-weight: 500; }
.shop_table .product-name a:hover { text-decoration: underline; }
.shop_table dl.variation { margin: 4px 0 0; font-size: var(--mx-fs-sm); color: var(--mx-ink-2); }
.shop_table dl.variation dt, .shop_table dl.variation dd { display: inline; margin: 0; }
.shop_table dl.variation dd p { display: inline; }

/* ---------- Cart ---------- */
.woocommerce-cart .mx-journey-body > .woocommerce, .mx-cart { display: grid; gap: var(--mx-s6); }
.woocommerce-cart .mx-journey-body > .woocommerce > *, .mx-cart > *, form.woocommerce-checkout > * { min-width: 0; }
@media (min-width: 1024px) {
	/* Two columns only inside .mx-cart (table + totals); cross-sells sit below it. */
	.mx-cart { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }
	.mx-cart > :not(.woocommerce-cart-form):not(.cart-collaterals) { grid-column: 1 / -1; }
	.woocommerce-cart .cart-collaterals { position: sticky; top: calc(var(--mx-head-offset, 134px) + 16px); transition: top .3s var(--mx-ease); }
}
.woocommerce-cart-form__contents .product-thumbnail img { width: 80px; height: 80px; object-fit: contain; border: 1px solid var(--mx-line-2); border-radius: var(--mx-r-md); background: #fff; }
.woocommerce-cart-form__contents .product-remove a.remove {
	display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
	font-size: 22px; line-height: 1; text-decoration: none; color: var(--mx-muted);
}
.woocommerce-cart-form__contents .product-remove a.remove:hover { background: var(--mx-error-soft); color: var(--mx-error); }
.woocommerce-cart-form__contents .product-subtotal { font-weight: 700; }
.woocommerce-cart-form__contents td.actions { background: var(--mx-surface); }
.woocommerce-cart-form__contents td.actions .coupon { display: flex; flex-wrap: wrap; gap: var(--mx-s2); float: inline-start; }
.woocommerce-cart-form__contents td.actions .coupon .input-text { width: 200px; min-height: 44px; }
.woocommerce-cart-form__contents td.actions > .button { float: inline-end; }
.woocommerce-cart-form__contents td.actions .button { min-height: 44px; }
.woocommerce-cart-form__contents td.actions button[name="update_cart"] { --_bg: #fff; --_fg: var(--mx-ink); --_bd: var(--mx-line); }
@media (min-width: 768px) {
	.woocommerce-cart-form__contents .product-remove { width: 56px; padding-inline-end: 4px; }
	.woocommerce-cart-form__contents .product-thumbnail { width: 108px; }
	.woocommerce-cart-form__contents .product-price, .woocommerce-cart-form__contents .product-subtotal { white-space: nowrap; }
	.woocommerce-cart-form__contents .product-name { min-width: 180px; line-height: 1.6; }
}

/* Responsive cart table: each row becomes a card (WooCommerce adds data-title). */
@media (max-width: 767px) {
	.shop_table_responsive thead { display: none; }
	.shop_table_responsive, .shop_table_responsive tbody { display: block; width: 100%; }
	.shop_table_responsive tbody tr, .shop_table_responsive tbody th, .shop_table_responsive tbody td { display: block; }
	.woocommerce-cart-form__contents .cart_item {
		display: grid; grid-template-columns: 84px 1fr auto; column-gap: var(--mx-s3); padding: var(--mx-s3);
		border-bottom: 1px solid var(--mx-line-2); position: relative;
	}
	.woocommerce-cart-form__contents .cart_item td { padding: 2px 0; border: 0; }
	.woocommerce-cart-form__contents .product-thumbnail { grid-row: 1 / span 4; }
	.woocommerce-cart-form__contents .product-thumbnail img { width: 84px; height: 84px; }
	.woocommerce-cart-form__contents .product-remove { grid-column: 3; grid-row: 1; }
	.woocommerce-cart-form__contents .product-name { grid-column: 2; grid-row: 1; }
	.woocommerce-cart-form__contents .product-price, .woocommerce-cart-form__contents .product-quantity, .woocommerce-cart-form__contents .product-subtotal { grid-column: 2 / -1; display: flex; align-items: center; justify-content: space-between; gap: var(--mx-s2); }
	.shop_table_responsive tbody td[data-title]::before { content: attr(data-title); font-size: var(--mx-fs-sm); color: var(--mx-muted); font-weight: 500; }
	.woocommerce-cart-form__contents .product-name::before, .woocommerce-cart-form__contents .product-remove::before, .woocommerce-cart-form__contents .product-thumbnail::before { content: none !important; } /* WooCommerce labels these too */
	.woocommerce-cart-form__contents td.actions { padding: var(--mx-s3); }
	.woocommerce-cart-form__contents td.actions .coupon { float: none; margin-bottom: var(--mx-s2); }
	.woocommerce-cart-form__contents td.actions .coupon .input-text { flex: 1; width: auto; }
	.woocommerce-cart-form__contents td.actions > .button { float: none; width: 100%; }
	.cart_totals .shop_table_responsive tr { display: flex; justify-content: space-between; gap: var(--mx-s3); padding: 12px 0; border-bottom: 1px solid var(--mx-line); }
	.cart_totals .shop_table_responsive tr:last-child { border-bottom: 0; }
	.cart_totals .shop_table th { width: auto; }
	.cart_totals .shop_table_responsive tr th, .cart_totals .shop_table_responsive tr td { display: block; padding: 0; border: 0; }
	.cart_totals .shop_table_responsive tbody td[data-title]::before { content: none; }
	.cart_totals .shop_table_responsive tr.shipping:not(.mx-weight-row) { flex-direction: column; }
}

.cart_totals { padding: var(--mx-s5); border: 1px solid var(--mx-line); border-radius: var(--mx-r-lg); background: var(--mx-surface); }
.cart_totals > h2 { margin: 0 0 var(--mx-s2); font-size: var(--mx-fs-lg); }
.cart_totals .shop_table { border: 0; border-radius: 0; background: transparent; }
.cart_totals .shop_table th, .cart_totals .shop_table td { padding: 12px 0; border-bottom-color: var(--mx-line); }
.cart_totals .shop_table th { width: 38%; font-weight: 500; color: var(--mx-ink-2); white-space: nowrap; }
.cart_totals .shop_table td { text-align: end; }
.cart_totals #shipping_method li { justify-content: flex-end; }
.cart_totals .woocommerce-shipping-destination { text-align: end; }
/* Order weight (inc/legacy.php): informational, so quieter than the money lines. */
.mx-weight-row th, .mx-weight-row td { font-size: var(--mx-fs-sm); color: var(--mx-muted) !important; font-weight: 400 !important; }
.wc-proceed-to-checkout { margin-top: var(--mx-s4); padding: 0; }
.wc-proceed-to-checkout .checkout-button { width: 100%; min-height: 52px; font-size: var(--mx-fs-lg); }
#shipping_method { margin: 0; padding: 0; list-style: none; }
#shipping_method li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--mx-s2); margin-bottom: 4px; }
#shipping_method li:last-child { margin-bottom: 0; }
#shipping_method li label { font-weight: 500; }
.woocommerce-shipping-destination { font-size: var(--mx-fs-xs); color: var(--mx-muted); margin: 4px 0 0; }
.shipping-calculator-button { font-size: var(--mx-fs-sm); font-weight: 700; }
.shipping-calculator-form { margin-top: var(--mx-s3); text-align: start; }
/* Cross-sells: full width under the cart (moved there in inc/cart-checkout.php). */
.cross-sells { margin: var(--mx-s4) 0 0; padding-top: var(--mx-s6); border-top: 1px solid var(--mx-line-2); }
.cross-sells > h2 { margin-bottom: var(--mx-s4); font-size: var(--mx-fs-h3); }

/* ---------- Checkout ----------
   inc/cart-checkout.php wraps the form's two columns: .mx-checkout__main
   (details) and .mx-checkout__side (order summary + payment). */
.woocommerce-form-coupon-toggle .woocommerce-info, .woocommerce-form-login-toggle .woocommerce-info { margin-bottom: var(--mx-s3); }
form.checkout_coupon, form.woocommerce-form-login { margin: 0 0 var(--mx-s5); padding: var(--mx-s5); border: 1px dashed var(--mx-line); border-radius: var(--mx-r-lg); }
form.checkout_coupon { display: flex; flex-wrap: wrap; gap: var(--mx-s2); align-items: flex-end; }
form.checkout_coupon p { margin: 0; }
form.checkout_coupon .form-row-first { flex: 1 1 220px; width: auto; float: none; }
form.checkout_coupon .form-row-last { width: auto; float: none; }
form.checkout_coupon .clear { display: none; }

/* A notice that is only a picture (Checkout Manager's banner): no notice box. */
.woocommerce-info:has(> img:only-child) { display: block; padding: 0; border: 0; background: none; }
.woocommerce-info > img:only-child { width: 100%; height: auto; border-radius: var(--mx-r-lg); }

form.woocommerce-checkout { display: grid; gap: var(--mx-s6); }
.mx-checkout__main, .mx-checkout__side { min-width: 0; }
@media (min-width: 1024px) {
	form.woocommerce-checkout { grid-template-columns: minmax(0, 1fr) 420px; align-items: start; column-gap: var(--mx-s8); }
	form.woocommerce-checkout > :not(.mx-checkout__main):not(.mx-checkout__side) { grid-column: 1 / -1; }
	.mx-checkout__side { position: sticky; top: calc(var(--mx-head-offset, 134px) + 16px); transition: top .3s var(--mx-ease); }
}
.mx-checkout__main { display: grid; gap: var(--mx-s5); }
#customer_details.col2-set { display: grid; gap: var(--mx-s5); }
#customer_details .col-1, #customer_details .col-2 { width: 100%; float: none; }
#customer_details .col-2:not(:has(input, textarea, select)) { display: none; }
.woocommerce-billing-fields > h3, .woocommerce-shipping-fields > h3, .woocommerce-additional-fields > h3 {
	margin: 0 0 var(--mx-s4); padding-bottom: var(--mx-s3); border-bottom: 1px solid var(--mx-line-2); font-size: var(--mx-fs-lg);
}
.woocommerce-billing-fields, .woocommerce-shipping-fields, .woocommerce-additional-fields {
	padding: var(--mx-s5); border: 1px solid var(--mx-line); border-radius: var(--mx-r-lg); background: #fff;
}
.woocommerce-billing-fields__field-wrapper::after, .woocommerce-shipping-fields__field-wrapper::after { content: ""; display: table; clear: both; }
.woocommerce-additional-fields .form-row:last-child { margin-bottom: 0; }
#ship-to-different-address { font-size: var(--mx-fs-md); }
#ship-to-different-address label { display: inline-flex; align-items: center; gap: var(--mx-s2); cursor: pointer; }
.woocommerce-account-fields { margin-top: var(--mx-s3); }

/* Stripe's express-checkout strip: only when a wallet button actually rendered. */
.wc-stripe-banner-checkout:not(:has(.wc-stripe-checkout-banner-gateway > *)) { display: none; }
.wc-stripe-banner-checkout fieldset { margin: 0; padding: var(--mx-s4); border: 1px solid var(--mx-line); border-radius: var(--mx-r-lg); }
.wc-stripe-banner-checkout .banner-title { padding: 0 6px; font-size: var(--mx-fs-sm); font-weight: 700; }
.wc-stripe-banner-checkout .wc_stripe_checkout_banner_gateways { margin: 0; padding: 0; }
.wc-stripe-banner-checkout .banner-divider { display: block; margin-top: var(--mx-s3); text-align: center; font-size: var(--mx-fs-sm); color: var(--mx-muted); }

/* Side: summary + payment in one panel. */
.mx-checkout__side { padding: var(--mx-s5); border: 1px solid var(--mx-line); border-radius: var(--mx-r-lg); background: var(--mx-surface); }
#order_review_heading { margin: 0 0 var(--mx-s3); font-size: var(--mx-fs-lg); }
#order_review { padding: 0; border: 0; background: none; }
.woocommerce-checkout-review-order-table { border: 0; border-radius: 0; background: transparent; }
.woocommerce-checkout-review-order-table thead { display: none; }
.woocommerce-checkout-review-order-table th, .woocommerce-checkout-review-order-table td { padding: 10px 0; border-bottom-color: var(--mx-line); }
.woocommerce-checkout-review-order-table .cart_item td { font-size: var(--mx-fs-sm); line-height: 1.6; }
.woocommerce-checkout-review-order-table .product-total { padding-inline-start: var(--mx-s3); text-align: end; white-space: nowrap; font-weight: 700; }
.woocommerce-checkout-review-order-table tfoot td { text-align: end; }
.woocommerce-checkout-review-order-table tfoot tr:last-child > * { border-bottom: 0; }
.woocommerce-checkout-review-order-table .product-quantity { color: var(--mx-muted); font-weight: 500; white-space: nowrap; }
.woocommerce-checkout-review-order-table #shipping_method li { justify-content: flex-end; }

.mx-checkout__payment-title { margin: var(--mx-s5) 0 var(--mx-s3); padding-top: var(--mx-s4); border-top: 1px solid var(--mx-line); font-size: var(--mx-fs-lg); }
#payment { background: transparent; }
#payment .wc_payment_methods { display: grid; gap: var(--mx-s2); margin: 0 0 var(--mx-s4); padding: 0; list-style: none; }
#payment .wc_payment_method {
	display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center;
	border: 1px solid var(--mx-line); border-radius: var(--mx-r-md); background: #fff; transition: border-color .15s, box-shadow .15s;
}
#payment .wc_payment_method:hover { border-color: var(--mx-ink-2); }
#payment .wc_payment_method > input[type="radio"] { margin: 0; margin-inline-start: var(--mx-s4); }
#payment .wc_payment_method > label {
	display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; min-height: 52px; margin: 0;
	padding: 10px var(--mx-s3); font-size: var(--mx-fs-sm); font-weight: 700; line-height: 1.4; cursor: pointer;
}
#payment .wc_payment_method > label img,
.woocommerce-checkout #payment ul.payment_methods li img.kashier-icon { /* Kashier's own sizing rule */
	display: block; width: auto; max-width: 52px; height: 22px; margin: 0; padding: 0; object-fit: contain;
}
#payment .wc_payment_method > label img:first-of-type { margin-inline-start: auto; }
/* Aman's mark is white: give it a dark chip. */
#payment .wc_payment_method > label img[src*="aman"] { box-sizing: content-box; padding: 2px 6px; border-radius: 4px; background: #26262c; }
#payment .wc_payment_method:has(> input:checked) { border-color: var(--mx-ink); box-shadow: 0 0 0 1px var(--mx-ink); }
#payment .payment_box { grid-column: 1 / -1; margin: 0; padding: 0 var(--mx-s4) var(--mx-s4); font-size: var(--mx-fs-sm); color: var(--mx-ink-2); }
#payment .payment_box p { margin: 0 0 var(--mx-s2); }
#payment .payment_box p:last-child { margin-bottom: 0; }
#payment .payment_box img { max-width: 100%; height: auto; border-radius: var(--mx-r-md); }
#payment .payment_box fieldset { border: 0; padding: 0; margin: 0; }
#payment #secured-by-kashier-container { padding-top: var(--mx-s2); text-align: start; overflow: visible; }
#payment .payment_methods li #secured-by-kashier-container img { max-width: 110px; border-radius: 0; opacity: .85; }
#payment .place-order { margin: 0; padding: 0; }
.woocommerce-terms-and-conditions-wrapper { margin-bottom: var(--mx-s4); font-size: var(--mx-fs-sm); }
.woocommerce-terms-and-conditions-wrapper:not(:has(:not(:empty))) { display: none; }
.woocommerce-privacy-policy-text { font-size: var(--mx-fs-sm); color: var(--mx-ink-2); }
.woocommerce-privacy-policy-text:empty { display: none; }
#place_order { width: 100%; min-height: 54px; font-size: var(--mx-fs-lg); }
.woocommerce-checkout .blockUI.blockOverlay { background: rgb(255 255 255 / 70%) !important; } /* overrides blockUI inline style */

/* select2 / selectWoo (country & state) in the design-system look */
.select2-container .select2-selection--single { height: 46px; border: 1px solid var(--mx-line); border-radius: var(--mx-r-md); }
.select2-container .select2-selection--single .select2-selection__rendered { line-height: 44px; padding-inline: 14px 36px; color: var(--mx-ink); }
.select2-container .select2-selection--single .select2-selection__arrow { height: 44px; }
.select2-container--open .select2-dropdown { border-color: var(--mx-line); border-radius: var(--mx-r-md); overflow: hidden; }
.select2-results__option--highlighted[aria-selected], .select2-results__option--highlighted[data-selected] { background: var(--mx-ink) !important; color: #fff !important; } /* select2's own !important */

/* ---------- Order received / order pay ---------- */
.woocommerce-order { max-width: 900px; }
.woocommerce-thankyou-order-received {
	display: flex; align-items: center; gap: var(--mx-s3); padding: var(--mx-s5); margin-bottom: var(--mx-s5);
	border-radius: var(--mx-r-lg); background: var(--mx-success-soft); color: var(--mx-success); font-size: var(--mx-fs-lg); font-weight: 700;
}
ul.woocommerce-order-overview { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: var(--mx-s3); margin: 0 0 var(--mx-s6); padding: 0; list-style: none; }
ul.woocommerce-order-overview li { padding: var(--mx-s4); border: 1px solid var(--mx-line); border-radius: var(--mx-r-md); font-size: var(--mx-fs-sm); color: var(--mx-muted); }
ul.woocommerce-order-overview li strong { display: block; margin-top: 4px; font-size: var(--mx-fs-md); color: var(--mx-ink); }
.mx-thankyou-note { display: flex; gap: var(--mx-s3); align-items: flex-start; margin-bottom: var(--mx-s5); padding: var(--mx-s4); border-radius: var(--mx-r-md); background: var(--mx-gold-soft); color: var(--mx-ink); }
.mx-thankyou-note h2 { font-size: var(--mx-fs-md); margin: 0 0 2px; }
.mx-thankyou-note p { margin: 0; }
.woocommerce-thankyou-order-failed-actions { display: flex; gap: var(--mx-s2); }
/* Sections WooCommerce prints empty (e.g. no separate shipping address) get no card. */
.woocommerce-billing-fields:not(:has(*)), .woocommerce-shipping-fields:not(:has(*)), .woocommerce-additional-fields:not(:has(*)) { padding: 0; border: 0; }
