/* Cart + checkout re-skin (Mallow rework, owner-approved mock 4).
   Pure skin over the Woo block structure — no layout/flow changes.
   Tokens: docs/design/mallow-rework/DESIGN.md. */

/* ── The scallop seam as a data-URI (CSS can't insert SVG elements) ── */
:root {
	--mwcc-seam: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1180 26' preserveAspectRatio='none'%3E%3Cpath d='M0,0 H1180 V8 Q1150,26 1120,8 Q1090,26 1060,8 Q1030,26 1000,8 Q970,26 940,8 Q910,26 880,8 Q850,26 820,8 Q790,26 760,8 Q730,26 700,8 Q670,26 640,8 Q610,26 580,8 Q550,26 520,8 Q490,26 460,8 Q430,26 400,8 Q370,26 340,8 Q310,26 280,8 Q250,26 220,8 Q190,26 160,8 Q130,26 100,8 Q70,26 40,8 Q10,26 0,8 Z' fill='%230E0B09'/%3E%3C/svg%3E");
}

body.woocommerce-cart,
body.woocommerce-checkout {
	overflow-x: clip; /* the full-bleed paints below */
}

/* ── Cart: Baloo title in a dark zone + seam ── */
.woocommerce-cart h1.wp-block-post-title {
	position: relative;
	z-index: 0;
	font-family: 'Baloo 2', 'Inter', sans-serif;
	font-size: 30px;
	font-weight: 800;
	color: #FEE7B1;
	padding: 4px 0 42px;
	margin-bottom: 8px;
}

.woocommerce-cart h1.wp-block-post-title::before {
	content: '';
	position: absolute;
	inset: -120px calc(50% - 50vw - 10px) 26px;
	background: #0E0B09;
	z-index: -1;
}

.woocommerce-cart h1.wp-block-post-title::after {
	content: '';
	position: absolute;
	left: calc(50% - 50vw - 10px);
	right: calc(50% - 50vw - 10px);
	bottom: 0;
	height: 26px;
	background: var(--mwcc-seam);
	background-size: 100% 26px;
}

/* ── Checkout: the minimal header part goes graham; the seam renders as
   the main group's ::before (the theme collapses the group 13px INTO the
   band — the dark-on-transparent seam rides that overlap invisibly). ── */
.woocommerce-checkout .wp-site-blocks > .wp-block-template-part:first-child {
	background: #0E0B09;
	padding-bottom: 6px;
}

.woocommerce-checkout .wp-site-blocks > .wp-block-template-part:first-child a {
	color: #FEE7B1;
}

.woocommerce-checkout .wp-site-blocks > main.wp-block-group::before {
	content: '';
	display: block;
	height: 26px;
	/* negative top tucks the seam's solid 8px top under the band whatever
	   the theme's collapse quirks do — dark over dark is invisible. */
	margin: -14px calc(50% - 50vw - 10px) 16px;
	background: var(--mwcc-seam);
	background-size: 100% 26px;
}

/* ── The free-shipping progress strip (classes from sell-promo-db.php) ── */
.mw-cart-progress {
	background: #DFF4F8;
	border: 1.5px solid #2BC3D8;
	border-radius: 14px 17px 13px 18px;
	color: #0B7C8D;
	font-weight: 600;
	font-size: 13.5px;
	padding: 11px 16px;
	margin: 0 0 14px;
}

.mw-cart-progress-bar {
	height: 7px;
	background: #FFFDF6;
	border-radius: 5px;
	margin-top: 8px;
	overflow: hidden;
}

.mw-cart-progress-fill {
	display: block;
	height: 100%;
	background: #2BC3D8;
}

/* ── Woo block cards: totals sidebar, order summary, shipping packages ── */
.wp-block-woocommerce-cart-totals-block,
.wc-block-checkout__sidebar .wc-block-components-order-summary,
.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC !important;
	border-radius: 19px 23px 20px 24px;
	padding: 16px 18px;
}

/* Cart line rows read as marshmallow cards. */
.wc-block-cart-items .wc-block-cart-items__row {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC;
	border-radius: 17px 21px 16px 22px;
	padding: 12px 14px !important;
}

.wc-block-cart-items .wc-block-cart-items__row + .wc-block-cart-items__row {
	margin-top: 10px;
}

.wc-block-cart-items th {
	font-size: 11px;
	letter-spacing: 1.1px;
	text-transform: uppercase;
	color: #8a6a52;
	border: 0 !important;
}

.wc-block-cart-items td {
	border: 0 !important;
}

.wc-block-cart-item__image img {
	background: #FFF7E3;
	border-radius: 10px 13px 9px 12px;
}

/* Prices in Baloo choc-deep. */
.wc-block-components-product-price,
.wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-cart-item__total .wc-block-components-product-price {
	font-family: 'Baloo 2', 'Inter', sans-serif;
	font-weight: 800;
	color: #2B1714;
}

/* Headings (Cart totals / Order summary / checkout step titles). */
.wc-block-cart__totals-title,
.wc-block-components-title,
.wc-block-components-checkout-step__title {
	font-family: 'Baloo 2', 'Inter', sans-serif !important;
	font-weight: 800 !important;
	color: #2B1714 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}

/* Quantity steppers + remove link. */
.wc-block-components-quantity-selector {
	border: 1.5px solid #E9D6AC !important;
	border-radius: 11px 14px 10px 13px;
	overflow: hidden;
	background: #FFF7E3;
}

.wc-block-cart-item__remove-link {
	color: #B22765 !important;
}

/* Inputs: warm fields, teal focus. */
.wc-block-components-text-input input,
.wc-block-components-combobox .components-combobox-control__suggestions-container input,
.wc-block-components-form .wc-block-components-select select,
.wc-block-components-select .components-custom-select-control__button {
	background: #FFFDF6 !important;
	border: 1.5px solid #E9D6AC !important;
	border-radius: 12px 15px 11px 14px !important;
	color: #422623 !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-form .wc-block-components-select select:focus {
	border-color: #2BC3D8 !important;
	box-shadow: 0 0 0 2px rgba(43, 195, 216, .28) !important;
}

/* Shipping packages (split shipments) as cards; selected option teal. */
.wc-block-components-shipping-rates-control__package {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC;
	border-radius: 14px 17px 13px 18px;
	padding: 12px 16px;
	margin-bottom: 10px;
}

.wc-block-components-radio-control__option {
	border-radius: 12px 15px 11px 14px;
}

.wc-block-components-radio-control__input:checked {
	border-color: #0E93A6 !important;
	background: #0E93A6 !important;
}

/* Payment options: marshmallow rows, teal ring when selected. */
.wc-block-components-radio-control-accordion-option,
.wc-block-checkout__payment-method .wc-block-components-radio-control__option {
	background: #FFFDF6;
	border-radius: 13px 16px 12px 15px;
}

/* Buttons: chocolate primary w/ the toast hover. */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button:not(.is-link) {
	background: #422623 !important;
	color: #FEE7B1 !important;
	border: none !important;
	border-radius: 13px 16px 12px 15px !important;
	font-weight: 700 !important;
	transition: transform .12s ease, box-shadow .12s ease;
}

.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-button:not(.is-link):hover {
	transform: scale(1.02, .98);
	box-shadow: 0 4px 0 #E9B45C;
	background: #422623 !important;
	color: #FEE7B1 !important;
}

/* Links inside the blocks = teal. */
.wc-block-components-totals-coupon-link,
.wc-block-components-checkout-return-to-cart-button,
.wc-block-cart-item__wrap a,
.wc-block-components-order-summary a {
	color: #0E93A6 !important;
}

@media (prefers-reduced-motion: reduce) {
	.wc-block-cart__submit-button,
	.wc-block-components-checkout-place-order-button,
	.wc-block-components-button:not(.is-link) {
		transition: none;
	}

	.wc-block-cart__submit-button:hover,
	.wc-block-components-checkout-place-order-button:hover,
	.wc-block-components-button:not(.is-link):hover {
		transform: none;
	}
}



/* ── Order confirmation (owner-approved mock 5) ── */
/* The thank-you status as a celebratory card (caramel toast edge). */
.wc-block-order-confirmation-status {
	background: #FFFDF6;
	border: 1.5px solid #E9B45C;
	border-radius: 17px 21px 16px 22px;
	padding: 16px 22px;
	box-shadow: 0 6px 0 rgba(233, 180, 92, .18);
	margin-bottom: 16px;
}

.wc-block-order-confirmation-status h1,
.wc-block-order-confirmation-status p {
	font-family: 'Baloo 2', 'Inter', sans-serif;
	font-weight: 800;
	color: #2B1714;
	margin: 0;
}

/* The order meta (number/date/email/total/payment) as a card strip. */
.wc-block-order-confirmation-summary {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC;
	border-radius: 17px 21px 16px 22px;
	padding: 14px 20px;
	margin-bottom: 16px;
}

.wc-block-order-confirmation-summary-list-item__key {
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #8a6a52;
}

.wc-block-order-confirmation-summary-list-item__value {
	font-weight: 700;
	color: #422623;
}

/* Order details + downloads + address sections as cards. */
.wc-block-order-confirmation-totals-wrapper,
.wc-block-order-confirmation-downloads-wrapper,
.wc-block-order-confirmation-address-wrapper .wc-block-components-address-card,
.wc-block-order-confirmation-billing-wrapper,
.wc-block-order-confirmation-shipping-wrapper {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC;
	border-radius: 19px 23px 20px 24px;
	padding: 16px 20px;
	margin-bottom: 16px;
}

.wc-block-order-confirmation-totals-wrapper h2,
.wc-block-order-confirmation-billing-wrapper h2,
.wc-block-order-confirmation-shipping-wrapper h2 {
	font-family: 'Baloo 2', 'Inter', sans-serif;
	font-weight: 800;
	color: #2B1714;
}

.wc-block-order-confirmation-totals table td,
.wc-block-order-confirmation-totals table th {
	border-color: #F2E4C2 !important;
}

.wc-block-order-confirmation-totals tfoot th,
.wc-block-order-confirmation-totals tfoot td {
	font-family: 'Baloo 2', 'Inter', sans-serif;
	font-weight: 800;
	color: #2B1714;
}

/* The confirmation's classic-style elements (the guest email-verification
   gate + any .woocommerce-button) match the skin too. */
body.woocommerce-checkout .woocommerce-button,
body.woocommerce-checkout button.button {
	background: #422623 !important;
	color: #FEE7B1 !important;
	border: none !important;
	border-radius: 13px 16px 12px 15px !important;
	font-weight: 700 !important;
}

body.woocommerce-checkout .woocommerce-verify-email input[type='email'],
body.woocommerce-checkout form input[type='email'] {
	background: #FFFDF6;
	border: 1.5px solid #E9D6AC;
	border-radius: 12px 15px 11px 14px;
	color: #422623;
	padding: 10px 13px;
}
