/*
 * Cart — Minimal List + Sticky Luxury Summary.
 *
 * Layout: breadcrumb → title → two-col grid (1.5fr items | 1fr sticky summary)
 *   → recommended products → mobile sticky bar.
 * Tablet: single column, summary stacks below items (position: static).
 * Mobile: summary simplified, fixed bottom checkout bar visible.
 *
 * Two-class selectors (.wpdl-cart__foo.wp-block-group / .wp-block-heading etc.)
 * give 0,2,0 specificity — beats WP flow/flex layout rules at 0,1,0 without !important.
 *
 * Ordering: base → variant/modifier → interactive state.
 * No page-level > * reset. Flex containers (summary rows, coupon, total row,
 * mobile bar) use WP layout — WP flex margins don't apply to flex children.
 * Grid direct children (.wpdl-cart__items, .wpdl-cart__summary) reset
 * their own margin-block to cancel WP flow margins.
 *
 * Tokens read:
 *   color.terracotta.500 / 600       — placeholder colours, hover accents
 *   color.green.500 / 700            — placeholder colours
 *   color.neutral.200 / 400          — placeholder colours
 *   semantic.color.text.primary      — titles, values, controls
 *   semantic.color.text.muted        — breadcrumb, meta, labels, trust line
 *   semantic.color.text.inverse      — checkout button text
 *   semantic.color.bg.base           — mobile bar background
 *   semantic.color.bg.surface        — order summary panel background
 *   semantic.color.border.base       — dividers, coupon underline, mobile bar border
 *   semantic.typography.display      — page title, summary heading, total value (Cormorant)
 *   semantic.typography.body         — all UI labels, prices, controls (Jost)
 *   space.1–11
 *   duration.base / easing.default
 */

/* ── Breadcrumb ───────────────────────────────────────────────────── */

.wpdl-cart__breadcrumb {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 400;
	letter-spacing: 0.08em;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0 var(--wp--custom--space--6);
	padding-block-start: var(--wp--custom--space--6);
}

.wpdl-cart__breadcrumb-link {
	color: var(--wp--custom--semantic--color--text--muted);
	text-decoration: none;
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart__breadcrumb span {
	color: var(--wp--custom--semantic--color--text--primary);
}

.wpdl-cart__breadcrumb-link:hover {
	color: var(--wp--custom--semantic--color--text--primary);
}

/* ── Page title ───────────────────────────────────────────────────── */

.wpdl-cart__title.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.375rem, 0.9rem + 2.08vw, 2.25rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0 var(--wp--custom--space--8);
}

/* ── Two-column grid ──────────────────────────────────────────────── */

.wpdl-cart__grid.wp-block-group {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: var(--wp--custom--space--9);
	align-items: start;
	margin-block: 0 var(--wp--custom--space--10);
}

/* Reset WP flow margins on grid direct children */
.wpdl-cart__items.wp-block-group,
.wpdl-cart__summary.wp-block-group {
	margin-block: 0;
}

/* ── Line items ───────────────────────────────────────────────────── */

.wpdl-cart__item.wp-block-group {
	gap: var(--wp--custom--space--6);
	padding-block: var(--wp--custom--space--7);
	border-block-end: 1px solid var(--wp--custom--semantic--color--border--base);
	align-items: center;
	margin-block: 0;
}

.wpdl-cart__item-img.wp-block-image {
	flex: 0 0 5.5rem;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	margin-block: 0;
}

.wpdl-cart__item-img.wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Placeholder colours (replaced by real product photos at P9) */
.wpdl-cart__item:nth-child(1) .wpdl-cart__item-img.wp-block-image { background-color: var(--wp--custom--semantic--color--accent--primary); }
.wpdl-cart__item:nth-child(2) .wpdl-cart__item-img.wp-block-image { background-color: var(--wp--custom--semantic--color--brand--primary); }

.wpdl-cart__item-details.wp-block-group {
	flex: 1;
	gap: var(--wp--custom--space--2);
	margin-block: 0;
}

.wpdl-cart__item-name {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0;
}

.wpdl-cart__item-meta {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.75rem;
	font-weight: 300;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0;
}

.wpdl-cart__item-stepper.wp-block-group {
	flex: 0 0 auto;
	gap: var(--wp--custom--space--3);
	align-items: center;
	margin-block: 0;
}

.wpdl-cart__stepper-btn {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 1rem;
	font-weight: 300;
	color: var(--wp--custom--semantic--color--text--primary);
	cursor: pointer;
	margin-block: 0;
	min-block-size: 2.75rem;
	min-inline-size: 2.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wpdl-cart__item-qty {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	font-weight: 300;
	color: var(--wp--custom--semantic--color--text--primary);
	min-inline-size: 1.5rem;
	text-align: center;
	margin-block: 0;
}

.wpdl-cart__item-total {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	font-weight: 400;
	color: var(--wp--custom--semantic--color--text--primary);
	flex: 0 0 auto;
	text-align: end;
	margin-block: 0;
}

.wpdl-cart__item-remove {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	flex: 0 0 auto;
	margin-block: 0;
}

.wpdl-cart__remove-link {
	color: var(--wp--custom--semantic--color--text--muted);
	text-decoration: none;
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart__remove-link:hover {
	color: var(--wp--custom--semantic--color--accent--primary);
}

/* ── Continue shopping ────────────────────────────────────────────── */

.wpdl-cart__continue {
	margin-block: var(--wp--custom--space--7) 0;
}

.wpdl-cart__continue-link {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--custom--semantic--color--text--primary);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--space--1);
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart__continue-link:hover {
	color: var(--wp--custom--semantic--color--accent--primary);
}

/* ── Order summary panel ──────────────────────────────────────────── */

.wpdl-cart__summary.wp-block-group {
	position: sticky;
	top: var(--wp--custom--space--6);
	background-color: var(--wp--custom--semantic--color--surface--primary);
	padding: var(--wp--custom--space--8);
}

.wpdl-cart__summary-heading.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.1875rem, 0.98rem + 0.89vw, 1.375rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0 var(--wp--custom--space--7);
}

.wpdl-cart__summary-row.wp-block-group {
	align-items: baseline;
	margin-block: 0 var(--wp--custom--space--5);
}

.wpdl-cart__summary-label {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	font-weight: 300;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0;
}

.wpdl-cart__summary-value {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0;
}

.wpdl-cart__summary-value--muted {
	color: var(--wp--custom--semantic--color--text--muted);
	font-weight: 300;
}

/* ── Coupon row ───────────────────────────────────────────────────── */

.wpdl-cart__coupon.wp-block-group {
	align-items: center;
	border-block-end: 1px solid var(--wp--custom--semantic--color--border--base);
	padding-block-end: var(--wp--custom--space--6);
	margin-block: 0 var(--wp--custom--space--6);
}

.wpdl-cart__coupon-input {
	flex: 1;
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	font-weight: 300;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0;
}

.wpdl-cart__coupon-apply {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--custom--semantic--color--text--primary);
	cursor: pointer;
	margin-block: 0;
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart__coupon-apply:hover {
	color: var(--wp--custom--semantic--color--accent--primary);
}

/* ── Total row ────────────────────────────────────────────────────── */

.wpdl-cart__total-divider.wp-block-separator {
	border: none;
	border-block-start: 1px solid var(--wp--custom--semantic--color--border--base);
	margin-block: var(--wp--custom--space--5);
	opacity: 1;
}

.wpdl-cart__total-row.wp-block-group {
	align-items: baseline;
	margin-block: 0 var(--wp--custom--space--7);
}

.wpdl-cart__total-label {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0;
}

.wpdl-cart__total-value {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.1875rem, 0.98rem + 0.89vw, 1.375rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0;
}

/* ── Checkout button ──────────────────────────────────────────────── */

.is-style-wpdl-checkout-btn .wp-block-button__link {
	background-color: var(--wp--custom--semantic--color--text--primary);
	color: var(--wp--custom--semantic--color--text--inverse);
	border-radius: 0;
	min-block-size: 3.125rem;
	width: 100%;
	text-align: center;
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transition: background-color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.is-style-wpdl-checkout-btn .wp-block-button__link:hover {
	background-color: var(--wp--custom--semantic--color--accent--primary);
}

/* ── Trust line ───────────────────────────────────────────────────── */

.wpdl-cart__trust-line {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 400;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: var(--wp--custom--space--5) 0;
}

/* ── Recommended products ─────────────────────────────────────────── */

.wpdl-cart__recommended.wp-block-group {
	margin-block: 0 var(--wp--custom--space--10);
}

.wpdl-cart__recommended-heading.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.375rem, 1.1rem + 1.19vw, 1.625rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0 var(--wp--custom--space--7);
}

.wpdl-cart__recommended-grid.wp-block-group {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--wp--custom--space--6);
	margin-block: 0;
}

.wpdl-cart__recommended-grid > .wpdl-product-card {
	margin-block: 0;
}

/* ── Mobile sticky checkout bar (hidden above 40em) ───────────────── */

.wpdl-cart__mobile-bar.wp-block-group {
	display: none;
}

/* ── Tablet (< 64em / 1024px) ────────────────────────────────────── */

@media (width < 64em) {
	.wpdl-cart__grid.wp-block-group {
		grid-template-columns: 1fr;
		gap: var(--wp--custom--space--8);
	}

	.wpdl-cart__summary.wp-block-group {
		position: static;
	}

	.wpdl-cart__item-img.wp-block-image {
		flex: 0 0 4.5rem;
	}

	.wpdl-cart__recommended-grid.wp-block-group {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ── Mobile (< 40em / 640px) ─────────────────────────────────────── */

@media (width < 40em) {
	.wpdl-cart__item-img.wp-block-image {
		flex: 0 0 3.5rem;
	}

	/* Simplify line items on mobile — hide total and remove link */
	.wpdl-cart__item-total,
	.wpdl-cart__item-remove {
		display: none;
	}

	/* Show fixed bottom checkout bar */
	.wpdl-cart__mobile-bar.wp-block-group {
		display: flex;
		position: fixed;
		inset-inline: 0;
		inset-block-end: 0;
		z-index: 20;
		background-color: var(--wp--custom--semantic--color--background--canvas);
		border-block-start: 1px solid var(--wp--custom--semantic--color--border--base);
		padding: var(--wp--custom--space--5) var(--wp--custom--space--6);
		gap: var(--wp--custom--space--6);
		align-items: center;
	}

	.wpdl-cart__mobile-price {
		font-family: var(--wp--custom--semantic--typography--body--font-family);
		font-size: 0.9375rem;
		font-weight: 500;
		color: var(--wp--custom--semantic--color--text--primary);
		margin-block: 0;
	}

	/* Reserve space so mobile bar doesn't overlap the recommended section */
	.wpdl-cart.wp-block-group {
		padding-block-end: var(--wp--custom--space--11);
	}
}

/* ── Reduced motion ───────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.wpdl-cart__breadcrumb-link,
	.wpdl-cart__remove-link,
	.wpdl-cart__continue-link,
	.wpdl-cart__coupon-apply,
	.is-style-wpdl-checkout-btn .wp-block-button__link {
		transition: none;
	}
}

/* =============================================================================
   WC P8 — page-cart.html block theming (wc/cart native block)
   Scoped to .wpdl-cart-page (tagName=main in template).
   WC places the wc/cart block as post-content; we theme its output classes.
   WC handles all cart data (items, quantities, totals) dynamically.
   ============================================================================= */

/* stylelint-disable no-descending-specificity -- WC block classes follow
   static pattern selectors; distinct properties, no cascade conflict. */

/* Page title */
.wpdl-cart-page .wp-block-post-title {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.375rem, 0.9rem + 2.08vw, 2.25rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: var(--wp--custom--space--8) var(--wp--custom--space--7);
}

/* wc/cart block body font */
.wpdl-cart-page .wc-block-cart {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
}

/* Cart item product name link */
.wpdl-cart-page .wc-block-cart-item__product-name,
.wpdl-cart-page .wc-block-cart-item__product-name a {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	text-decoration: none;
}

/* Cart item variant / metadata */
.wpdl-cart-page .wc-block-cart-item__product-metadata,
.wpdl-cart-page .wc-block-components-product-metadata {
	font-size: 0.75rem;
	color: var(--wp--custom--semantic--color--text--muted);
}

/* Cart item line price */
.wpdl-cart-page .wc-block-cart-item__prices .wc-block-components-product-price__value,
.wpdl-cart-page .wc-block-cart-item__prices .price {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	color: var(--wp--custom--semantic--color--text--primary);
}

.wpdl-cart-page .wc-block-components-product-price ins {
	text-decoration: none;
	color: var(--wp--custom--semantic--color--accent--primary);
}

/* Remove button */
.wpdl-cart-page .wc-block-cart-item__remove-link {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.625rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--custom--semantic--color--text--muted);
	text-decoration: none;
	transition: color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart-page .wc-block-cart-item__remove-link:hover {
	color: var(--wp--custom--semantic--color--accent--primary);
}

/* Quantity stepper */
.wpdl-cart-page .wc-block-components-quantity-selector input {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	border-color: var(--wp--custom--semantic--color--border--base);
}

/* Order summary heading */
.wpdl-cart-page .wc-block-cart__totals-title {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
}

/* Totals rows */
.wpdl-cart-page .wc-block-cart-order-summary-subtotal-block__value,
.wpdl-cart-page .wc-block-components-totals-item__label,
.wpdl-cart-page .wc-block-components-totals-item__value {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.8125rem;
	color: var(--wp--custom--semantic--color--text--primary);
}

/* Grand total — Cormorant */
.wpdl-cart-page .wc-block-components-totals-grand-total__label,
.wpdl-cart-page .wc-block-components-totals-grand-total__value {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: 1.125rem;
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
}

/* Coupon input */
.wpdl-cart-page .wc-block-components-coupon .wc-block-components-text-input input {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	border-color: var(--wp--custom--semantic--color--border--base);
}

/* Proceed to checkout button */
.wpdl-cart-page .wc-block-cart__submit-button,
.wpdl-cart-page .wc-block-proceed-to-checkout-block__button {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background-color: var(--wp--custom--semantic--color--text--primary);
	color: var(--wp--custom--semantic--color--text--inverse);
	border: none;
	border-radius: 0;
	transition: background-color var(--wp--custom--duration--base) var(--wp--custom--easing--default);
}

.wpdl-cart-page .wc-block-cart__submit-button:hover,
.wpdl-cart-page .wc-block-proceed-to-checkout-block__button:hover {
	background-color: var(--wp--custom--semantic--color--accent--primary);
}

/* Payment icons / trust copy */
.wpdl-cart-page .wc-block-cart__payment-method-description {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.75rem;
	color: var(--wp--custom--semantic--color--text--muted);
}

@media (prefers-reduced-motion: reduce) {
	.wpdl-cart-page .wc-block-cart-item__remove-link,
	.wpdl-cart-page .wc-block-cart__submit-button,
	.wpdl-cart-page .wc-block-proceed-to-checkout-block__button {
		transition: none;
	}
}

/* stylelint-enable no-descending-specificity */
