/* Miss Merylin — block cart + block checkout as app screens (module "pdp").
   Loaded on the cart and checkout pages only. CSS on WooCommerce Blocks' public class names;
   no markup or behaviour change (validation, shipping/payment pairing untouched).
   Selectors relied on: .wc-block-cart, .wc-block-cart-items(__row), .wc-block-cart-item__*,
   .wc-block-components-quantity-selector(__button|__input), .wc-block-components-sidebar(-layout),
   .wc-block-components-main, .wc-block-cart__submit-container(--sticky), .wc-block-cart__submit-button,
   .wc-block-checkout, .wc-block-components-checkout-step, .wc-block-components-shipping-rates-control,
   .wc-block-components-radio-control(__option|-accordion-option), .wc-block-checkout__actions,
   .wc-block-components-checkout-place-order-button, .wc-block-components-totals-*. */

body.woocommerce-cart,
body.woocommerce-checkout {
	--mm-cc-card-pad: 16px;
	--mm-cc-gap: 12px;
}
/* Shell bottom tab bar (shown on the cart page): lift the sticky pay bar above it. The shell may
   expose its height as --mm-tabbar-h; 60px otherwise. */
@media (max-width: 768px) {
	body.woocommerce-cart.mm-shell--tabbar { --mm-app-bottom-offset: var(--mm-tabbar-h, 60px); }
}

/* ── Shared: one column, no block sidebar column ─────────────────────────── */
.wp-block-woocommerce-cart .wc-block-components-sidebar-layout,
.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout {
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	max-width: 680px;
	margin: 0 auto !important;
	gap: var(--mm-cc-gap);
}
.wp-block-woocommerce-cart .wc-block-components-sidebar-layout > .wc-block-components-main,
.wp-block-woocommerce-cart .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-main,
.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	flex: 0 0 auto;
	position: static !important;
}

/* Card look shared by cart items, the bill summary and checkout steps. */
.wp-block-woocommerce-cart .wc-block-cart-items__row,
.wp-block-woocommerce-cart .wc-block-components-sidebar,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step,
.wp-block-woocommerce-checkout .wc-block-components-sidebar {
	background: var(--mm-white);
	border: .5px solid var(--mm-border);
	border-radius: 0;
}
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout { font-family: var(--mm-font-body); color: var(--mm-black); }

/* ==========================================================================
   CART
   ========================================================================== */

/* Items as cards */
.wp-block-woocommerce-cart table.wc-block-cart-items,
.wp-block-woocommerce-cart table.wc-block-cart-items tbody { display: block; width: 100%; border: 0; margin: 0; background: none; }
.wp-block-woocommerce-cart table.wc-block-cart-items thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.wp-block-woocommerce-cart .wc-block-cart-items__row {
	display: grid !important;
	grid-template-columns: 84px minmax(0, 1fr) auto;
	grid-template-areas: "img product total";
	column-gap: var(--mm-s-4);
	align-items: start;
	padding: var(--mm-cc-card-pad) !important;
	margin: 0 0 var(--mm-cc-gap);
}
.wp-block-woocommerce-cart .wc-block-cart-items__row > td { display: block; padding: 0 !important; border: 0 !important; }
.wp-block-woocommerce-cart .wc-block-cart-item__image { grid-area: img; width: 84px !important; }
.wp-block-woocommerce-cart .wc-block-cart-item__image a,
.wp-block-woocommerce-cart .wc-block-cart-item__image img { display: block; width: 84px; aspect-ratio: 3 / 4; object-fit: cover; background: var(--mm-offwhite); }
.wp-block-woocommerce-cart .wc-block-cart-item__product { grid-area: product; min-width: 0; }
.wp-block-woocommerce-cart .wc-block-cart-item__total { grid-area: total; text-align: right; font-weight: 500; font-size: 14px; }
.wp-block-woocommerce-cart .wc-block-cart-item__wrap { display: flex; flex-direction: column; gap: var(--mm-s-1); }
.wp-block-woocommerce-cart .wc-block-components-product-name { font-family: var(--mm-font-body); font-size: 14px; font-weight: 400; line-height: 1.35; color: var(--mm-black); text-decoration: none; }
.wp-block-woocommerce-cart .wc-block-cart-item__prices { font-size: 13px; color: var(--mm-gray); }
.wp-block-woocommerce-cart .wc-block-components-product-metadata { font-size: 12px; color: var(--mm-gray); margin: 2px 0 0; }
.wp-block-woocommerce-cart .wc-block-components-product-metadata__description { display: none; } /* short description: noise on a card */
/* Item details (size / colour + mm-preorder's "Imported item · Estimated delivery …" line) stay visible. */
.wp-block-woocommerce-cart .wc-block-components-product-details { display: block !important; margin: 2px 0 0; padding: 0; list-style: none; font-size: 12px; line-height: 1.45; color: var(--mm-gray); }
.wp-block-woocommerce-cart .wc-block-components-product-details li { display: block; margin: 0; }

/* Quantity stepper (block's own selector, restyled) */
.wp-block-woocommerce-cart .wc-block-cart-item__quantity { display: flex; align-items: center; justify-content: space-between; gap: var(--mm-s-3); margin-top: var(--mm-s-3); }
.wc-block-components-quantity-selector {
	display: inline-flex !important;
	align-items: stretch;
	width: auto !important;
	min-width: 0;
	height: 36px;
	border: 1px solid var(--mm-border) !important;
	border-radius: 0 !important;
	background: var(--mm-white);
	margin: 0 !important;
}
.wc-block-components-quantity-selector::after { display: none !important; border: 0 !important; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 36px !important;
	width: 36px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--mm-black) !important;
	font-size: 18px;
	line-height: 1;
	opacity: 1;
	box-shadow: none !important;
}
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover { background: var(--mm-blush) !important; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:disabled { opacity: .35; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:focus-visible,
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__input:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: -2px; }
.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	width: 36px !important;
	min-width: 36px;
	height: auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-left: 1px solid var(--mm-border) !important;
	border-right: 1px solid var(--mm-border) !important;
	border-radius: 0 !important;
	background: transparent !important;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	box-shadow: none !important;
	-moz-appearance: textfield;
}
.wp-block-woocommerce-cart .wc-block-cart-item__remove-link {
	font-size: 11px !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--mm-gray) !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
	min-height: 36px;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}
.wp-block-woocommerce-cart .wc-block-cart-item__remove-link:hover { color: var(--mm-black) !important; }

/* Bill summary card */
.wp-block-woocommerce-cart .wc-block-components-sidebar { padding: var(--mm-cc-card-pad) !important; }
.wp-block-woocommerce-cart .wc-block-cart__totals-title {
	display: block !important;
	margin: 0 0 var(--mm-s-2) !important;
	padding: 0 !important;
	font-family: var(--mm-font-body);
	font-size: 11px !important;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-align: left !important;
	color: var(--mm-black);
}
.wp-block-woocommerce-cart .wc-block-components-totals-wrapper,
.wp-block-woocommerce-checkout .wc-block-components-totals-wrapper { padding: var(--mm-s-3) 0 !important; border-top: .5px solid var(--mm-border) !important; }
.wc-block-components-totals-item { font-size: 13px; }
.wc-block-components-totals-item__label { color: var(--mm-gray); }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { color: var(--mm-black); font-size: 16px !important; font-weight: 600 !important; }

/* Proceed button ("Proceed to pay ₹X", see cart.js) */
.wp-block-woocommerce-cart .wc-block-cart__submit { margin: var(--mm-s-3) 0 0; }
.wp-block-woocommerce-cart .wc-block-cart__submit-button,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button {
	width: 100%;
	min-height: 52px;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--mm-black) !important;
	color: var(--mm-white) !important;
	font-family: var(--mm-font-body);
	font-size: 13px !important;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: none !important;
	box-shadow: none !important;
}
.wp-block-woocommerce-cart .wc-block-cart__submit-button:hover,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:hover:not(:disabled) { background: var(--mm-accent) !important; }
.wp-block-woocommerce-cart .wc-block-cart__submit-button:focus-visible,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.wp-block-woocommerce-cart .wc-block-cart__submit-button[data-mm-label] .wc-block-components-button__text { font-size: 0 !important; letter-spacing: 0; }
/* The label lives on the button (attr() reads the element that carries the pseudo-element). */
.wp-block-woocommerce-cart .wc-block-cart__submit-button[data-mm-label]::after {
	content: attr(data-mm-label);
	font-size: 13px;
	letter-spacing: .14em;
	color: inherit;
}

/* Mobile: sticky proceed bar. WooCommerce already pins .wc-block-cart__submit-container--sticky
   on small screens; this only restyles it (and the non-sticky container as a fallback). */
@media (max-width: 768px) {
	.wp-block-woocommerce-cart .wc-block-cart__submit-container--sticky,
	.wp-block-woocommerce-cart .wc-block-cart__submit-container:not(.wc-block-cart__submit-container--sticky) {
		position: fixed !important;
		left: 0;
		right: 0;
		bottom: var(--mm-app-bottom-offset, 0px) !important;
		z-index: 9990;
		margin: 0 !important;
		padding: var(--mm-s-3) var(--mm-s-4) calc(var(--mm-s-3) + env(safe-area-inset-bottom, 0px)) !important;
		background: var(--mm-white) !important;
		border-top: .5px solid var(--mm-border);
		box-shadow: 0 -2px 12px rgba(26, 26, 26, .06);
	}
	.wp-block-woocommerce-cart .wc-block-cart__submit-container--sticky::before { display: none !important; }
	body.woocommerce-cart { padding-bottom: calc(76px + var(--mm-app-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px)); }
}

/* Empty cart block: keep it calm */
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title { font-family: var(--mm-font-heading); font-weight: 400; }

/* ==========================================================================
   CHECKOUT
   ========================================================================== */

/* Order summary card first, then address → shipping → payment → place order. */
.wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-sidebar { order: -1; padding: var(--mm-cc-card-pad) !important; }
.wp-block-woocommerce-checkout .wc-block-components-checkout-step {
	padding: var(--mm-cc-card-pad) !important;
	margin: 0 0 var(--mm-cc-gap) !important;
}
.wp-block-woocommerce-checkout .wc-block-components-checkout-step::after { display: none !important; } /* numbered timeline line */
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__container { padding: 0 !important; margin: 0 !important; }
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__heading { margin: 0 0 var(--mm-s-3) !important; }
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__title {
	font-family: var(--mm-font-body) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mm-black);
}
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__description { font-size: 12px; color: var(--mm-gray); }
.wp-block-woocommerce-checkout .wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__title::before { display: none; }

/* Address card (saved address view) */
.wp-block-woocommerce-checkout .wc-block-components-address-card {
	border: 1px solid var(--mm-border) !important;
	border-radius: 0 !important;
	background: var(--mm-offwhite);
	padding: var(--mm-s-3) var(--mm-s-4) !important;
	font-size: 13px;
}
.wp-block-woocommerce-checkout .wc-block-components-address-card__edit { color: var(--mm-accent) !important; text-decoration: underline; text-underline-offset: 3px; }

/* Inputs: square brand fields (block keeps its floating labels + validation) */
.wp-block-woocommerce-checkout .wc-block-components-text-input input,
.wp-block-woocommerce-checkout .wc-block-components-combobox .components-combobox-control input,
.wp-block-woocommerce-checkout .wc-block-components-select-input select,
.wp-block-woocommerce-checkout .wc-blocks-components-select__select,
.wp-block-woocommerce-checkout .wc-block-components-textarea { border-radius: 0 !important; border-color: var(--mm-border) !important; }
.wp-block-woocommerce-checkout .wc-block-components-text-input input:focus,
.wp-block-woocommerce-checkout .wc-blocks-components-select__select:focus { border-color: var(--mm-black) !important; box-shadow: 0 0 0 1px var(--mm-black) !important; }

/* Shipping rates (Prepaid / Cash On Delivery) and payment methods as selectable cards */
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: var(--mm-s-3);
	border: 0 !important;
	box-shadow: none !important;
}
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control__option,
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option {
	margin: 0 !important;
	border: 1px solid var(--mm-border) !important;
	border-radius: 0 !important;
	background: var(--mm-white);
	box-shadow: none !important;
	transition: border-color var(--dur-quick, 200ms) ease, background-color var(--dur-quick, 200ms) ease;
}
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control__option { min-height: 64px; padding-top: var(--mm-s-4) !important; padding-bottom: var(--mm-s-4) !important; }
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control__option::after,
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option::after { display: none !important; }
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option + .wc-block-components-radio-control-accordion-option { margin-top: var(--mm-s-3) !important; }
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control__option-checked,
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control .wc-block-components-radio-control__option:has(input:checked),
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option:has(> .wc-block-components-radio-control__option-checked),
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option:has(input:checked) {
	border-color: var(--mm-black) !important;
	background: var(--mm-blush);
	box-shadow: inset 0 0 0 1px var(--mm-black) !important;
}
.wp-block-woocommerce-checkout .wc-block-components-radio-control__option:focus-within { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.wp-block-woocommerce-checkout .wc-block-components-radio-control__label { font-size: 14px; font-weight: 500; color: var(--mm-black); }
.wp-block-woocommerce-checkout .wc-block-components-radio-control__secondary-label { font-size: 14px; font-weight: 600; color: var(--mm-black); }
.wp-block-woocommerce-checkout .wc-block-components-radio-control__description,
.wp-block-woocommerce-checkout .wc-block-components-radio-control__secondary-description { font-size: 12px; color: var(--mm-gray); }
.wp-block-woocommerce-checkout .wc-block-components-radio-control__input:checked { border-color: var(--mm-black) !important; }
.wp-block-woocommerce-checkout .wc-block-components-radio-control__input:checked::before { background: var(--mm-black) !important; }
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-content { padding-top: 0 !important; font-size: 13px; color: var(--mm-gray); }

/* Order summary items: keep the item details (mm-preorder line) readable */
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-details { display: block !important; font-size: 12px; color: var(--mm-gray); }
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image img { border-radius: 0; }
.wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title-text,
.wp-block-woocommerce-checkout .wc-block-components-order-summary .wc-block-components-panel__button { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }

/* Place order: sticky bar on mobile (sticky, not fixed — stays inside the form flow so the
   block's validation scroll / notices keep working). */
.wp-block-woocommerce-checkout .wc-block-checkout__actions { margin: var(--mm-s-1) 0 0; padding: 0; }
.wp-block-woocommerce-checkout .wc-block-checkout__actions_row { display: flex; align-items: center; gap: var(--mm-s-3); }
@media (max-width: 768px) {
	/* The actions block also holds the mobile order summary, so only the button row is pinned. */
	.wp-block-woocommerce-checkout .wc-block-checkout__actions { position: static; margin: 0 !important; }
	.wp-block-woocommerce-checkout .wc-block-checkout__actions_row {
		position: fixed;
		left: 0;
		right: 0;
		bottom: var(--mm-app-bottom-offset, 0px);
		z-index: 50;
		padding: var(--mm-s-3) var(--mm-s-4) calc(var(--mm-s-3) + env(safe-area-inset-bottom, 0px));
		background: var(--mm-white);
		border-top: .5px solid var(--mm-border);
		box-shadow: 0 -2px 12px rgba(26, 26, 26, .06);
	}
	.wp-block-woocommerce-checkout { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
	.wp-block-woocommerce-checkout .wc-block-checkout__actions_row { flex-direction: column-reverse; align-items: stretch; gap: var(--mm-s-2); }
	.wp-block-woocommerce-checkout .wc-block-components-checkout-return-to-cart-button { align-self: center; font-size: 12px; padding: 0; }
	.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button { width: 100%; }
	.wp-block-woocommerce-checkout .wc-block-checkout__terms { font-size: 12px; }
}

/* Phones: the line total duplicated the unit price beside the name and overlapped it; the bill card shows totals. */
@media (max-width: 768px) {
	.wp-block-woocommerce-cart .wc-block-cart-items__row > td.wc-block-cart-item__total { display: none !important; }
}

/* ── Cart: "Add-ons under ₹499" (inc/35-upsell.php; mini cards styled in the shell CSS) ── */
.mm-addons { max-width: 1320px; margin: var(--mm-s-2) auto var(--mm-s-6); padding: 0 var(--mm-s-4); }
.mm-addons[hidden] { display: none; }
.mm-addons__h { margin: 0 0 var(--mm-s-3); font-family: var(--mm-font-heading); font-weight: 400; font-size: clamp(20px, 3vw, 26px); color: var(--mm-black); }
.mm-addons__list { display: flex !important; gap: var(--mm-s-3); margin: 0 !important; padding: 0 0 var(--mm-s-1) !important; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.mm-addons__list > .mm-mini { flex: 0 0 38%; max-width: 38%; padding: 0 !important; }
.mm-addons__list > .mm-mini::before, .mm-addons__list > .mm-mini::marker { content: none !important; }
.mm-addons__list::-webkit-scrollbar { display: none; }
.mm-addons__list > .mm-mini { scroll-snap-align: start; }
.mm-addons .mm-mini__add { display: inline-flex; align-items: center; justify-content: center; gap: 3px; text-decoration: none; }
@media (min-width: 900px) { .mm-addons__list > .mm-mini { flex-basis: calc((100% - 60px) / 6); max-width: calc((100% - 60px) / 6); } }
/* WooCommerce's own cart cross-sells block: replaced by the add-ons rail below the cart. */
.wp-block-woocommerce-cart-cross-sells-block { display: none !important; }
.mm-mini.is-leaving { opacity: 0; transform: scale(.95); transition: opacity .24s, transform .24s; }

/* ── Checkout: "Frequently added" row above the pay button (cart.js) ── */
.mm-freq { margin: var(--mm-s-2) 0 var(--mm-s-4); padding: var(--mm-s-3); border: .5px solid var(--mm-border); border-radius: var(--mm-r-m); background: var(--mm-white); }
.mm-freq__h { margin: 0 0 var(--mm-s-2); font-family: var(--mm-font-body); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mm-black); }
.mm-freq__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--mm-s-2); }
.mm-freq__item { display: flex; align-items: center; gap: var(--mm-s-3); margin: 0; }
.mm-freq__item img { flex: 0 0 40px; width: 40px; height: 50px; object-fit: cover; border-radius: var(--mm-r-s); background: var(--mm-offwhite); }
.mm-freq__meta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mm-freq__name { font-family: var(--mm-font-body); font-size: 12.5px; line-height: 1.3; color: var(--mm-black); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mm-freq__price { font-family: var(--mm-font-body); font-size: 12.5px; font-weight: 600; color: var(--mm-black); }
.mm-freq__add { flex: 0 0 auto; min-width: 64px; min-height: 36px; padding: 0 var(--mm-s-3); border: 1px solid var(--mm-black); border-radius: 999px; background: #fff; color: var(--mm-black); font-family: var(--mm-font-body); font-size: 11px; font-weight: 600; letter-spacing: .06em; cursor: pointer; touch-action: manipulation; }
.mm-freq__add:disabled { background: var(--mm-black); color: #fff; cursor: default; }
