/**
 * Celsyn 360 Liquid — single product page purchase panel + Coming Soon panel.
 */

/* Styles WooCommerce's own native .summary.entry-summary (single-product
   purchase column) directly — no template override, so core/WooCommerce
   updates to that template keep working unmodified. */
.summary.entry-summary {
	background: var( --env-surface );
	border: 1px solid var( --env-line );
	border-radius: var( --radius-lg );
	padding: var( --space-6 );
}
.summary.entry-summary .price {
	font-family: var( --font-display );
	font-size: var( --text-xl );
	font-weight: 600;
}
.summary.entry-summary form.cart {
	margin-top: var( --space-5 );
	display: flex;
	gap: var( --space-3 );
	align-items: center;
}
.summary.entry-summary .quantity input {
	height: var( --control-h-md );
	width: 64px;
	text-align: center;
	border-radius: var( --radius-sm );
	border: 1px solid var( --env-line-strong );
	background: var( --env-surface );
	color: var( --env-text );
}
.summary.entry-summary .single_add_to_cart_button {
	height: var( --control-h-md );
	flex: 1;
}

/* Custom quantity stepper (assets/js/qty-stepper.js) — the real native
   input[type=number] (Blocksy's own .quantity[data-type="type-2"] markup)
   has a confirmed WebKit rendering bug where its value text never paints
   on real mobile Safari-family browsers, even though getComputedStyle
   reports correct color/background (reproduced directly in Playwright's
   WebKit engine, not assumed). The real input is kept in the DOM — same
   name="quantity", same min/max — for the actual form submission; it's
   just moved fully off-screen and out of the tab order here, and this
   visible stepper takes over, which also satisfies "no manual typing, no
   mobile keyboard" without relying on readonly/inputmode quirks that
   behave inconsistently across mobile browsers. */
.quantity.has-celsyn-stepper .ct-increase,
.quantity.has-celsyn-stepper .ct-decrease,
.quantity.has-celsyn-stepper > input.qty {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect( 0, 0, 0, 0 ) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
.celsyn-qty-stepper {
	display: inline-flex;
	align-items: center;
	height: var( --control-h-md );
	border: 1px solid var( --env-line-strong );
	border-radius: var( --radius-sm );
	background: var( --env-surface );
	overflow: hidden;
	flex-shrink: 0;
}
.celsyn-qty-stepper__btn {
	appearance: none;
	-webkit-appearance: none;
	border: none;
	background: transparent;
	color: var( --env-text );
	width: 44px;
	height: 100%;
	font-size: var( --text-lg );
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
}
.celsyn-qty-stepper__btn:disabled { opacity: 0.35; cursor: not-allowed; }
.celsyn-qty-stepper__btn:active:not( :disabled ) { background: rgb( var( --celsyn-ink-rgb ) / 0.06 ); }
.celsyn-qty-stepper__val {
	min-width: 28px;
	text-align: center;
	font-size: var( --text-md );
	font-weight: 700;
	color: var( --env-text );
	-webkit-text-fill-color: var( --env-text ); /* belt-and-suspenders: this is the exact property the native-input bug silently ignores, forced explicitly here even though a plain span was never subject to that bug */
	-webkit-user-select: none;
	user-select: none;
}

.celsyn-coming-soon-panel {
	padding: var( --space-6 );
}
.celsyn-coming-soon-panel__note {
	margin: var( --space-3 ) 0 var( --space-5 );
	color: var( --env-text-muted );
}
.celsyn-notify-me { max-width: 440px; }