/* EONYX — cart quantity steppers.
 *
 * Two surfaces, one control:
 *   - /cart/ (classic cart table) — steppers wrap WooCommerce's own quantity input; a change
 *     triggers WooCommerce's in-place AJAX update, which re-renders the row and the totals and
 *     therefore the per-vial tier price.
 *   - Fridge (.fridge-line, dialog and page) — steppers wrap the theme's number input and fire
 *     the events the theme commits on.
 *
 * Shipped by mu-plugins/eonyx-cart-ui.php (v1.1.0). */

/* ------------------------------------------------------------------ /cart/ */
.woocommerce-cart .product-quantity .quantity { display: inline-flex; align-items: center; }

.woocommerce-cart .eo-qty,
.fridge-line .eo-qty {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	padding: 2px;
	border: 1px solid var(--line-14);
	border-radius: 999px;
	background: var(--ink-2);
}

.woocommerce-cart .eo-qty-btn,
.fridge-line .eo-qty-btn {
	display: grid;
	place-items: center;
	width: 40px;
	min-height: 44px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: none;
	color: var(--mist);
	font: 400 18px/1 var(--font-body);
	cursor: pointer;
	transition: background var(--dur-quick, .24s) var(--ease-snap, ease), color var(--dur-quick, .24s) var(--ease-snap, ease);
}

.woocommerce-cart .eo-qty-btn:hover,
.fridge-line .eo-qty-btn:hover { background: #ffffff14; color: var(--white); }

.woocommerce-cart .eo-qty-btn:disabled,
.fridge-line .eo-qty-btn:disabled { opacity: .4; cursor: not-allowed; }

.woocommerce-cart .eo-qty input.qty,
.fridge-line .eo-qty input[type="number"] {
	width: 52px;
	min-width: 0;
	min-height: 44px;
	padding: 0;
	border: 0;
	background: none;
	text-align: center;
	font: 500 16px/1 var(--font-body);
	color: var(--white);
	-moz-appearance: textfield;
	appearance: textfield;
}

.fridge-line .eo-qty input[type="number"] { font-size: 17px; }

.woocommerce-cart .eo-qty input.qty::-webkit-outer-spin-button,
.woocommerce-cart .eo-qty input.qty::-webkit-inner-spin-button,
.fridge-line .eo-qty input[type="number"]::-webkit-outer-spin-button,
.fridge-line .eo-qty input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.woocommerce-cart .eo-qty input.qty:focus-visible,
.fridge-line .eo-qty input[type="number"]:focus-visible { outline: none; }

/* ------------------------------------------------------------------ applied coupons, Fridge
 * The theme prints one joined row for every applied code with no remove control; the script above
 * rebuilds it as one row per coupon carrying this ×. Styling lives here so it ships with the same
 * mu-plugin that owns the behaviour. */
.fridge-summary .eo-coupon-row { align-items: center; }

.fridge-summary .eo-coupon-right {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 10px;
}

.fridge-summary .eo-coupon-remove {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	min-height: 34px;
	padding: 0;
	border: 1px solid var(--line-14);
	border-radius: 50%;
	background: #ffffff05;
	color: var(--mist);
	font: 400 20px/1 var(--font-body);
	cursor: pointer;
	transition: background var(--dur-quick, .24s) var(--ease-snap, ease), color var(--dur-quick, .24s) var(--ease-snap, ease), border-color var(--dur-quick, .24s) var(--ease-snap, ease);
}

.fridge-summary .eo-coupon-remove:hover,
.fridge-summary .eo-coupon-remove:focus-visible {
	border-color: transparent;
	background: var(--lime-grad);
	color: var(--jet);
}

.fridge-summary .eo-coupon-remove:disabled { opacity: .45; cursor: not-allowed; }

@media (max-width: 600px) {
	.fridge-summary .eo-coupon-remove { width: 40px; height: 40px; min-height: 40px; }
}

/* ------------------------------------------------------------------ per-vial price, /cart/ */
.woocommerce-cart .eonyx-line-savings { display: block; line-height: 1.5; }
.woocommerce-cart .eonyx-line-savings del { font-size: 13px; color: var(--steel); }
.woocommerce-cart .eonyx-line-savings strong { font-size: 17px; font-weight: 500; color: var(--white); }
.woocommerce-cart .eonyx-line-savings > span {
	display: block;
	margin-top: 2px;
	font-family: var(--font-mono);
	font-size: 11px;
	letter-spacing: .04em;
	color: var(--save);
}

/* queued update feedback while WooCommerce replaces the cart in place */
.woocommerce-cart .woocommerce-cart-form.processing .eo-qty { border-color: var(--lime); }
body.eo-cart-busy .woocommerce-cart .product-quantity { opacity: .6; }