/* ===========================================================================
 * DCME cart processing overlay + cart totals row — 1.1.0 (2026-09-26, round 3)
 * ---------------------------------------------------------------------------
 * DESTINATION : /www/distancecme_897/public/wp-content/themes/Avada-Child-Theme/css/dcme-cart-processing.css
 *               (cart page only, via functions.php, filemtime() version)
 * VEHICLE     : FileZilla / SFTP upload (full replacement of this file only;
 *               functions.php and js/dcme-cart-processing.js are unchanged)
 * RUN         : purge WP Rocket, Kinsta and Cloudflare. Then /cart/: no
 *               "Update cart" in Cart totals; on a desktop-width window the
 *               Pay Later offer sits LEFT of "Proceed to checkout" on one row;
 *               on a phone in portrait it sits above the button; on a phone
 *               in landscape the coupon box and Cart totals are stacked.
 * AUTH        : Kinsta SFTP
 * WRITES      : nothing server-side
 * CLEANUP     : restore the previous copy of this file (the second 26 Sep
 *               set's), or delete it (functions.php skips a missing file)
 * ======================================================================== */

/* Decision K: Avada's "Update cart" copy in Cart totals. Avada's live cart
 * update (avadaWooCommerceVars.ajax_update_cart_values = "1") saves each
 * quantity as it changes, so this link either did nothing (no pending change)
 * or reloaded the page (after one) — both observed on Prem_Staging, 26 Sep.
 * WooCommerce's own button stays in the cart form's hidden actions row:
 * WooCommerce's scripts use it. */
.woocommerce-cart .cart_totals a.fusion-update-cart {
	display: none !important;
}

/* The overlay. Same stacking as the checkout's payment panel (plugin
 * dcme-ack.css): above Avada's sticky header (10010-10011), the admin bar
 * (99999) and the lightbox (100000-100010). */
.dcme-cart-processing {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2147483000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5em;
	background: rgba(255, 255, 255, 0.72);
	cursor: progress;
}

.dcme-cart-processing[hidden] {
	display: none;
}

.dcme-cart-processing__panel {
	max-width: 28em;
	padding: 1.25em 1.5em;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
	text-align: center;
	line-height: 1.5;
	outline: none;
}

.dcme-cart-processing__spinner {
	display: inline-block;
	width: 1.6em;
	height: 1.6em;
	margin: 0 0 0.6em;
	border: 2px solid rgba(0, 0, 0, 0.18);
	border-top-color: currentColor;
	border-radius: 50%;
	animation: dcme-cart-spin 0.7s linear infinite;
}

@media ( prefers-reduced-motion: reduce ) {

	.dcme-cart-processing__spinner {
		animation-duration: 2.4s;
	}
}

@keyframes dcme-cart-spin {

	to {
		transform: rotate(360deg);
	}
}

.dcme-cart-processing__line {
	margin: 0;
	font-weight: 600;
}

.dcme-cart-processing__line--slow {
	margin-top: 0.5em;
	font-weight: normal;
}

.dcme-cart-processing__line[hidden],
.dcme-cart-processing__reload[hidden] {
	display: none;
}

.dcme-cart-processing__reload {
	margin-top: 0.75em;
	padding: 0.7em 1.4em;
	border: 0;
	border-radius: 2px;
	background: #20619d;
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.dcme-cart-processing__reload:hover,
.dcme-cart-processing__reload:focus {
	background: #184a78;
}

/* The 60-second ceiling: the page is released and the panel waits at the
 * foot of the screen with its Reload button. */
.dcme-cart-processing.is-stuck {
	align-items: flex-end;
	background: transparent;
	pointer-events: none;
	cursor: auto;
}

.dcme-cart-processing.is-stuck .dcme-cart-processing__panel {
	pointer-events: auto;
}

.dcme-cart-processing.is-stuck .dcme-cart-processing__spinner {
	display: none;
}

/* 2026-09-26 (round 3, decision B1): PayPal's Pay Later offer and "Proceed
 * to checkout" share one row wherever the offer gets about 180px, and the
 * offer sits above the button where it doesn't. functions.php
 * (dcme_cart_paylater_message_first) still prints the offer first; in a
 * wrapping flex row, first means left when both fit and above when they
 * don't. Replaces the earlier 26 Sep rule (margin 0 0 12px; its comment
 * carried the wrong date).
 *
 * The offer is PayPal's own component; only its container is sized here.
 * The container is empty until PayPal fills it (empty in the server HTML,
 * Prem_Staging 26 Sep), and an empty one takes no room, so a total with no
 * offer leaves the button exactly where it was. Anything else that lands in
 * this container (for example PayPal's own cart buttons, if a site turns them
 * on) gets a full-width line of its own, in page order. */
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 12px 16px;
	margin-top: 10px;
}

.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout > .ppcp-messages {
	flex: 1 1 180px;
	min-width: 0;
	margin: 0;
}

.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout > .ppcp-messages:empty {
	display: none;
}

/* Avada 7.16.1: .cart-collaterals .cart_totals .checkout-button { float: right;
 * margin-top: 10px !important; }. The row above provides that 10px now. */
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout > .checkout-button {
	flex: 0 0 auto;
	float: none;
	margin-top: 0 !important;
}

.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout > :not(.ppcp-messages):not(.checkout-button) {
	flex: 1 1 100%;
}

/* Landscape phones wider than 800px (Galaxy S26+ 832, iPhone Pro 852,
 * Pro Max 932): Avada keeps the coupon box and Cart totals side by side above
 * 800px, which leaves Cart totals 371-419px wide. Stack the two boxes exactly
 * as Avada 7.16.1 does at 800px and below: these are the five coupon-box and
 * Cart-totals declarations from its max-sh-cbp-woo.min.css, with the same
 * selectors plus body.woocommerce-cart. Avada's other 800px rules (the cart
 * table's card layout) are deliberately not copied. Viewport-based, so iOS and
 * Android behave alike; a desktop window this short gets the same layout. */
@media only screen and (min-width: 801px) and (max-width: 1024px) and (max-height: 500px) {

	body.woocommerce-cart .cart-collaterals {
		flex-direction: column;
	}

	body.woocommerce-cart #wrapper .shipping-coupon,
	body.woocommerce-cart.fusion-body .cart-collaterals .cart_totals {
		float: none;
		margin-left: auto;
		margin-right: auto;
		width: 100% !important;
	}

	body.woocommerce-cart .cart-collaterals .shipping-coupon .coupon {
		margin-bottom: 30px;
	}

	body.woocommerce-cart .cart-collaterals .shipping-coupon .avada-coupon-fields {
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	body.woocommerce-cart .cart-collaterals .shipping-coupon .coupon #avada_coupon_code {
		margin: 0 0 20px;
		width: 100%;
	}
}