/**
 * Pro WP Farms — quantity − / + stepper.
 *
 * Theming: set any of these custom properties anywhere up the tree (e.g. :root
 * via Divi Theme Options, or on a Divi module/preset) — no need to edit this file:
 *   --pwf-qty-accent      focus / hover accent  (falls back to --pwf-brand-accent-text, AA-safe gold)
 *   --pwf-qty-text        digits + symbols      (falls back to Divi 5 --gcid-heading-color)
 *   --pwf-qty-surface     wrapper background
 *   --pwf-qty-border      wrapper border colour
 *   --pwf-qty-btn-bg      button background
 *   --pwf-qty-radius      wrapper radius
 *   --pwf-qty-btn-size    button width/height
 *   --pwf-qty-input-width / --pwf-qty-input-height / --pwf-qty-font-size
 *
 * Specificity: rules are scoped with :has(> .pwf-qty-btn) so only inputs that
 * received the stepper are styled. No !important is used, so design settings
 * applied to Divi WooCommerce modules can still override these defaults.
 */
.woocommerce .quantity:has(> .pwf-qty-btn),
.woocommerce div.product form.cart div.quantity:has(> .pwf-qty-btn) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 6px;
	margin-inline-end: 12px;
	background: var(--pwf-qty-surface, #fff);
	border: 1px solid var(--pwf-qty-border, var(--pwf-brand-input-border, #868f89));
	border-radius: var(--pwf-qty-radius, 18px);
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.08);
	transition: border-color 300ms ease, box-shadow 300ms ease;
}

.woocommerce .quantity:has(> .pwf-qty-btn) input.qty,
.woocommerce div.product form.cart div.quantity:has(> .pwf-qty-btn) input.qty {
	width: var(--pwf-qty-input-width, 64px);
	min-width: var(--pwf-qty-input-width, 64px);
	height: var(--pwf-qty-input-height, 48px);
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
	color: var(--pwf-qty-text, var(--gcid-heading-color, #111827));
	text-align: center;
	font-size: var(--pwf-qty-font-size, 20px);
	font-weight: 800;
	line-height: var(--pwf-qty-input-height, 48px);
	box-shadow: none;
	-moz-appearance: textfield;
	appearance: textfield;
}

.quantity:has(> .pwf-qty-btn) input.qty::-webkit-outer-spin-button,
.quantity:has(> .pwf-qty-btn) input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.woocommerce .quantity .pwf-qty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--pwf-qty-btn-size, 42px);
	min-width: var(--pwf-qty-btn-size, 42px);
	height: var(--pwf-qty-btn-size, 42px);
	padding: 0;
	border: 0;
	border-radius: 14px;
	background: var(--pwf-qty-btn-bg, #f1f4f8);
	color: var(--pwf-qty-text, var(--gcid-heading-color, #0f172a));
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	transition: background-color 300ms ease, box-shadow 300ms ease, transform 150ms ease;
}

.woocommerce .quantity .pwf-qty-btn:hover {
	background: color-mix(in srgb, var(--pwf-qty-accent, var(--pwf-brand-accent-text, #746e07)) 18%, #fff);
	box-shadow: 0 4px 12px rgba(16, 24, 40, 0.12);
}

.woocommerce .quantity .pwf-qty-btn:active {
	transform: scale(0.96);
}

.woocommerce .quantity .pwf-qty-btn:focus-visible {
	outline: 2px solid var(--pwf-qty-accent, var(--pwf-brand-accent-text, #746e07));
	outline-offset: 2px;
}

.woocommerce .quantity:has(> .pwf-qty-btn):focus-within {
	border-color: var(--pwf-qty-accent, var(--pwf-brand-accent-text, #746e07));
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--pwf-qty-accent, var(--pwf-brand-accent-text, #746e07)) 16%, transparent), 0 10px 24px rgba(16, 24, 40, 0.08);
}

.woocommerce .quantity .pwf-qty-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
	box-shadow: none;
}

@media (max-width: 767px) {
	.woocommerce .quantity:has(> .pwf-qty-btn),
	.woocommerce div.product form.cart div.quantity:has(> .pwf-qty-btn) {
		gap: 6px;
		padding: 5px;
		border-radius: var(--pwf-qty-radius, 16px);
	}

	.woocommerce .quantity:has(> .pwf-qty-btn) input.qty,
	.woocommerce div.product form.cart div.quantity:has(> .pwf-qty-btn) input.qty {
		width: var(--pwf-qty-input-width, 54px);
		min-width: var(--pwf-qty-input-width, 54px);
		height: var(--pwf-qty-input-height, 42px);
		font-size: var(--pwf-qty-font-size, 18px);
		line-height: var(--pwf-qty-input-height, 42px);
	}

	.woocommerce .quantity .pwf-qty-btn {
		width: var(--pwf-qty-btn-size, 38px);
		min-width: var(--pwf-qty-btn-size, 38px);
		height: var(--pwf-qty-btn-size, 38px);
		border-radius: 12px;
		font-size: 24px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce .quantity .pwf-qty-btn,
	.woocommerce .quantity:has(> .pwf-qty-btn) {
		transition: none;
	}
}