/* ============================================================================
   Product page purchase controls (inc/woocommerce/hd-product.php) — wholesale v2.2.0
   The retail theme's product-page rules (thdretail-child 1.7.6, style.css
   "The Hemp Doctor — product page purchase controls" + "Product page: space
   between quantity and Add to cart" + "Product Bundles: Add to Cart reachable
   on mobile"), scoped to body.thdw-product (added by the module on product
   pages). Only the "Choose an option" selects, the quantity box and the Add to
   Cart button are styled — nothing else on the product page is touched.

   Colours: teal #025960, ink #113D3C, orange #FC9E01, field line #D4E0DE.
   Layout: labels above the selects (two columns when there is room), 48px
   selects with the brand chevron, 52px quantity box (− / field / +) next to
   the orange DM Serif Display pill which takes the rest of the row; the
   disabled button (no option chosen yet) is the same orange at 45 % opacity.
   ============================================================================ */

/* Product page: space between quantity and Add to cart.
   Simple products: the form itself is the row. Variable products: only the
   quantity + button wrapper is the row, so the "Choose an option" selects sit
   full width above it (making the whole variable form a flex row pushed the
   button off screen on mobile). */
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart:not(.variations_form),
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart .woocommerce-variation-add-to-cart {
	display: flex !important;
	align-items: stretch;
	gap: 12px;
	flex-wrap: nowrap;
	width: 100%;
}
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart .single_variation_wrap {
	width: 100%;
}
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart .quantity {
	float: none !important;
	margin: 0 !important;
	flex: 0 0 auto;
}
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart .single_add_to_cart_button {
	float: none !important;
	margin: 0 !important;
	flex: 1 1 auto;   /* button fills the rest of the row */
	min-width: 0;
}







/* ============================================================================
   The Hemp Doctor — product page purchase controls
   Scope: ONLY the "Choose an option" selects, the quantity box and the
   Add to Cart button (white text) on the product page. Nothing else on the
   product page is touched. Safe to paste at the end of the child theme
   style.css or into Appearance → Customize → Additional CSS.
   Colours: teal #025960, ink #113D3C, orange #FC9E01, field line #D4E0DE.
   ============================================================================ */

/* "Choose an option" selects: label above, 48px, full width, brand chevron */
body.thdw-product div.product form.cart .variations {
	margin: 18px 0 16px;
}
body.thdw-product div.product form.cart .variations tbody {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); /* 2 columns when there is room, 1 in narrow columns */
	gap: 12px 16px;
}
body.thdw-product div.product form.cart .variations tr {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
body.thdw-product div.product form.cart .variations th.label,
body.thdw-product div.product form.cart .variations td.value {
	display: block;
	padding: 0 !important;
	line-height: 1.4;
	text-align: left;
}
body.thdw-product div.product form.cart .variations th.label label {
	font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #5F6F6E;
}
body.thdw-product div.product form.cart .variations select {
	width: 100% !important;
	max-width: 100%;
	min-height: 48px;
	margin: 0 !important;
	padding: 0 44px 0 14px !important;
	border: 1.5px solid #D4E0DE !important;
	border-radius: 10px !important;
	background-color: #fff !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23025960' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 16px !important;
	font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
	font-size: 15px !important;
	color: #113D3C !important;
	-webkit-appearance: none;
	appearance: none;
	box-shadow: none !important;
	transition: border-color .15s ease, box-shadow .15s ease;
}
body.thdw-product div.product form.cart .variations select:focus {
	border-color: #025960 !important;
	box-shadow: 0 0 0 3px rgba(2, 89, 96, .18) !important;
	outline: 0;
}
body.thdw-product div.product form.cart .reset_variations {
	display: inline-block;
	margin-top: 4px;
	font-size: 13px;
	color: #5F6F6E !important;
}
/* quantity + Add to Cart: one row, equal height, the button takes the space;
   everything else inside the form (subscription options, bundles, stock line)
   keeps its full width. */
body.thdw-product div.product form.cart .wcsatt-options-wrapper,
body.thdw-product div.product form.cart .wcsatt-add-cart-wrapper,
body.thdw-product div.product form.cart .wcsatt-options-product-wrapper,
body.thdw-product div.product form.cart .bundled_products,
body.thdw-product div.product form.cart .koala-bmsm-wrap,
body.thdw-product div.product form.cart .stock,
body.thdw-product div.product form.cart .woocommerce-variation {
	flex: 1 1 100%;
	width: 100%;
}
body.thdw-product .woocommerce-variation-add-to-cart,
body.thdw-product div.product form.cart:not(.variations_form) {
	display: flex !important;
	flex-wrap: wrap;
	align-items: stretch !important;
	gap: 12px;
}
body.thdw-product.kadence-cart-button-large div.product form.cart div.quantity,
body.thdw-product.kadence-cart-button-large div.product form.cart div.quantity.spinners-added,
body.thdw-product div.product form.cart div.quantity {
	height: 52px !important;
	min-width: 124px; /* 40px − / 44px field / 40px + — the field was squeezed to 6px in the tablet column */
	margin: 0 !important;
	border: 1.5px solid #D4E0DE;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	flex: 0 0 auto;
}
body.thdw-product div.product form.cart div.quantity .qty,
body.thdw-product div.product form.cart div.quantity input[type="number"] {
	flex: 1 0 44px;
	width: auto !important;
	min-width: 44px;
	height: 100% !important;
	padding: 0 !important;
	border: 0 !important;
	font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	color: #113D3C;
	box-shadow: none !important;
}
body.thdw-product div.product form.cart div.quantity .kadence-qty-button,
body.thdw-product div.product form.cart div.quantity .minus,
body.thdw-product div.product form.cart div.quantity .plus {
	width: 40px;
	min-width: 40px;
	height: 100%;
	border: 0 !important;
	background: transparent;
	color: #025960 !important;
	font-size: 18px;
	cursor: pointer;
}
html body.thdw-product .button.single_add_to_cart_button,
html body.thdw-product button.single_add_to_cart_button.button.alt {
	flex: 1 1 200px; /* stays on one row with the quantity box in the 358px phone column */
	width: auto !important;
	min-width: 0;
	height: 52px !important;
	margin: 0 !important;
	padding: 0 24px !important;
	line-height: 1 !important;
	border: 0 !important;
	border-radius: 100px !important;
	background: #FC9E01 !important;
	background-image: none !important;
	color: #fff !important;
	font-family: "DM Serif Display", Georgia, serif !important;
	font-size: 18px !important;
	font-weight: 400 !important;
	text-transform: none !important;
	box-shadow: none !important;
	transform: none !important;
	transition: none !important;
	opacity: 1;
}
/* no hover / focus / active effects: the button stays the same orange */
html body.thdw-product .button.single_add_to_cart_button:hover,
html body.thdw-product .button.single_add_to_cart_button:focus,
html body.thdw-product .button.single_add_to_cart_button:active,
html body.thdw-product button.single_add_to_cart_button.button.alt:hover,
html body.thdw-product button.single_add_to_cart_button.button.alt:focus,
html body.thdw-product button.single_add_to_cart_button.button.alt:active {
	background: #FC9E01 !important;
	background-image: none !important;
	color: #fff !important;
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	filter: none !important;
	opacity: 1 !important;
	outline: 0;
}
/* keyboard users still get a visible focus ring */
html body.thdw-product .button.single_add_to_cart_button:focus-visible {
	outline: 2px solid #113D3C !important;
	outline-offset: 2px;
}
html body.thdw-product .button.single_add_to_cart_button.disabled,
html body.thdw-product .button.single_add_to_cart_button:disabled,
html body.thdw-product .button.single_add_to_cart_button.disabled:hover,
html body.thdw-product .button.single_add_to_cart_button:disabled:hover {
	background: #FC9E01 !important;
	color: #fff !important; /* stays white while no option is selected */
	opacity: .45 !important;
	cursor: not-allowed;
	box-shadow: none !important;
	transform: none !important;
}

/* quantity box: no hover / focus effects on the box, the field or the − / + buttons */
body.thdw-product div.product form.cart div.quantity,
body.thdw-product div.product form.cart div.quantity:hover,
body.thdw-product div.product form.cart div.quantity:focus-within {
	border-color: #D4E0DE !important;
	box-shadow: none !important;
	transform: none !important;
	transition: none !important;
}
body.thdw-product div.product form.cart div.quantity .qty:hover,
body.thdw-product div.product form.cart div.quantity .qty:focus,
body.thdw-product div.product form.cart div.quantity input[type="number"]:hover,
body.thdw-product div.product form.cart div.quantity input[type="number"]:focus {
	background: #fff !important;
	color: #113D3C !important;
	border: 0 !important;
	box-shadow: none !important;
	outline: 0;
}
body.thdw-product div.product form.cart div.quantity .kadence-qty-button:hover,
body.thdw-product div.product form.cart div.quantity .kadence-qty-button:focus,
body.thdw-product div.product form.cart div.quantity .kadence-qty-button:active,
body.thdw-product div.product form.cart div.quantity .minus:hover,
body.thdw-product div.product form.cart div.quantity .minus:focus,
body.thdw-product div.product form.cart div.quantity .minus:active,
body.thdw-product div.product form.cart div.quantity .plus:hover,
body.thdw-product div.product form.cart div.quantity .plus:focus,
body.thdw-product div.product form.cart div.quantity .plus:active {
	background: transparent !important;
	color: #025960 !important;
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	outline: 0;
}





/* ============================================================================
   Product Bundles: Add to Cart reachable on mobile
   The simple-product rule ".kwt-add-to-cart-single form.cart:not(.variations_form)"
   also matched the bundle form (form.cart.bundle_form) and laid every bundled
   item + the Add to Cart box in ONE non-wrapping row, so the button ended up
   ~800px to the right, off screen. These rules only target .bundle_form;
   simple and variable products are untouched.
   ============================================================================ */
body.thdw-product.woocommerce div.product .kwt-add-to-cart-single form.cart.bundle_form:not(.variations_form),
html body.thdw-product div.product form.cart.bundle_form {
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	gap: 0 !important;
}
html body.thdw-product div.product form.cart.bundle_form > .bundled_product,
html body.thdw-product div.product form.cart.bundle_form > .bundle_data {
	flex: 0 0 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
}
/* quantity + Add to Cart on one row, button fills the rest (same as single products) */
html body.thdw-product div.product form.cart.bundle_form .bundle_button {
	display: flex !important;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 12px;
	width: 100%;
}
html body.thdw-product div.product form.cart.bundle_form .bundle_button .quantity {
	flex: 0 0 auto;
	margin: 0 !important;
}
html body.thdw-product div.product form.cart.bundle_form .bundle_button .single_add_to_cart_button {
	flex: 1 1 auto !important;
	min-width: 0;
	width: auto !important;
	margin: 0 !important;
}
