/**
 * WooCommerce buttons — Nahl Foods
 * Overrides default purple/grey WooCommerce buttons everywhere.
 */

:root {
	--woocommerce: var(--color-primary, #183a2a);
	--wc-primary: var(--color-primary, #183a2a);
	--wc-primary-text: var(--color-white, #ffffff);
	--wc-secondary: var(--color-primary, #183a2a);
	--wc-secondary-text: var(--color-white, #ffffff);
	--wc-highlight: var(--color-honey, #c49a52);
}

.woocommerce a.button,
.woocommerce a.button.alt,
.woocommerce a.button.disabled,
.woocommerce button.button,
.woocommerce button.button.alt,
.woocommerce button.button.disabled,
.woocommerce input.button,
.woocommerce input.button.alt,
.woocommerce #respond input#submit,
.woocommerce #respond input#submit.alt,
.woocommerce #place_order,
.woocommerce .checkout-button,
.woocommerce a.added_to_cart,
.woocommerce-page a.button,
.woocommerce-page a.button.alt,
.woocommerce-page button.button,
.woocommerce-page button.button.alt,
.woocommerce-page input.button,
.woocommerce-page input.button.alt,
.woocommerce-page #place_order,
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button,
.woocommerce-cart .button,
.woocommerce-checkout .button,
.woocommerce-account .button,
.return-to-shop .button,
.product-card a.button,
.product-card a.add_to_cart_button,
.product-card a.added_to_cart,
.nahl-product__cart .single_add_to_cart_button,
.nahl-cart .button,
.nahl-cart .checkout-button,
.nahl-cart-empty .button,
.wc-block-components-button,
.wp-block-button__link.wc-block-components-button,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce #respond input#submit,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce #respond input#submit.alt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--btn-min-height, 46px);
	padding: var(--btn-padding-y, 14px) var(--btn-padding-x, 28px);
	border: 0 !important;
	border-radius: var(--radius-btn, 7px) !important;
	background: var(--color-primary, #183a2a) !important;
	color: var(--color-white, #ffffff) !important;
	font-family: var(--font-body, inherit);
	font-size: var(--btn-font-size, 13px) !important;
	font-weight: var(--btn-font-weight, 500) !important;
	letter-spacing: var(--btn-letter-spacing, 0.05em);
	text-transform: capitalize;
	text-decoration: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	background-image: none !important;
	line-height: 1;
	cursor: pointer;
	/* Fallbacks match this file's defensive style — it is enqueued after
	   WooCommerce CSS and must stand on its own. */
	transition: background var(--dur-hover, 200ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
		opacity var(--dur-hover, 200ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
		transform var(--dur-press, 140ms) var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}

.woocommerce a.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.woocommerce #place_order:hover,
.woocommerce .checkout-button:hover,
.woocommerce a.added_to_cart:hover,
.woocommerce-page a.button:hover,
.woocommerce-page a.button.alt:hover,
.woocommerce-page button.button:hover,
.woocommerce-page button.button.alt:hover,
.woocommerce-page input.button:hover,
.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.return-to-shop .button:hover,
.product-card a.button:hover,
.product-card a.add_to_cart_button:hover,
.nahl-product__cart .single_add_to_cart_button:hover,
.nahl-cart .button:hover,
.nahl-cart .checkout-button:hover,
.wc-block-components-button:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button.alt:hover {
	background: var(--color-primary-hover, #10281d) !important;
	color: var(--color-white, #ffffff) !important;
}

.woocommerce a.button.disabled,
.woocommerce a.button:disabled,
.woocommerce button.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt:disabled,
.woocommerce input.button.disabled,
.woocommerce input.button:disabled,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button.alt.disabled,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt.disabled,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt:disabled {
	background: var(--color-primary, #183a2a) !important;
	color: var(--color-white, #ffffff) !important;
	opacity: 0.55;
	cursor: not-allowed;
}

.woocommerce a.button.loading,
.woocommerce button.button.loading,
.product-card a.add_to_cart_button.loading,
.nahl-product__cart .single_add_to_cart_button.loading {
	opacity: 0.65;
	pointer-events: none;
}

/* Card actions shrink to their label — see the matching rule in theme.css. This
   sheet loads after theme.css, so the width has to be released here too. */
.product-card .button,
.product-card a.add_to_cart_button,
.product-card a.added_to_cart {
	width: unset;
}

.nahl-product__cart .single_add_to_cart_button,
.nahl-product__cart button.button {
	width: auto;
	min-width: 180px;
}

.nahl-cart .checkout-button,
.woocommerce .checkout-button,
#place_order {
	width: 100%;
}

.product-card a.added_to_cart {
	margin-top: 8px;
	width: 100%;
}

a.added_to_cart,
.woocommerce a.added_to_cart,
.woocommerce-page a.added_to_cart,
.product-card a.added_to_cart {
	display: none !important;
}

/* -------------------------------------------------------------------------- */
/* Press feedback                                                             */
/* -------------------------------------------------------------------------- */

/* These are the buttons that matter most — add to cart, update cart, proceed
   to checkout, place order — and none of them confirmed a press. A 0.97 scale
   is the cheapest possible signal that the interface heard you, and on the
   checkout path that reassurance is worth more than anywhere else on the site. */
.woocommerce a.button:active,
.woocommerce a.button.alt:active,
.woocommerce button.button:active,
.woocommerce button.button.alt:active,
.woocommerce input.button:active,
.woocommerce input.button.alt:active,
.woocommerce #respond input#submit:active,
.woocommerce #place_order:active,
.woocommerce .checkout-button:active,
.woocommerce-page a.button:active,
.woocommerce-page button.button:active,
.woocommerce-page input.button:active,
.product-card a.button:active,
.product-card a.add_to_cart_button:active,
.nahl-product__cart .single_add_to_cart_button:active,
.nahl-cart .button:active,
.nahl-cart .checkout-button:active,
.wc-block-components-button:active {
	transform: scale(0.97);
}

/* A disabled or in-flight button must not appear to respond. */
.woocommerce button.button:disabled:active,
.woocommerce button.button.loading:active,
.nahl-product__cart .single_add_to_cart_button:disabled:active,
.nahl-product__cart .single_add_to_cart_button.loading:active {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce a.button:active,
	.woocommerce button.button:active,
	.woocommerce input.button:active,
	.woocommerce #place_order:active,
	.woocommerce .checkout-button:active,
	.nahl-product__cart .single_add_to_cart_button:active,
	.nahl-cart .checkout-button:active {
		transform: none;
	}
}
