/* =============================================================
   Buttons — LED style guide (primary / secondary / tertiary / link)
   ============================================================= */

/* --- Shared base ------------------------------------------------ */

.led-btn,
a.led-btn,
button.led-btn,
input.led-btn,
.green-btn,
.blue-btn,
.custom-shop-btn,
.contact-for-pricing-btn,
a.blurb-cta,
html body .product-info-button,
html body .shop-all-button,
html body .woocommerce a.button,
html body .woocommerce button.button,
html body .woocommerce input.button,
html body .woocommerce #respond input#submit,
html body .woocommerce .cart .button,
html body .woocommerce .checkout-button,
html body .woocommerce .single_add_to_cart_button,
html body .woocommerce .add_to_cart_button,
html body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
html body .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: var(--btn-height);
	padding: 0 var(--btn-padding-x);
	border: none;
	border-radius: var(--btn-radius);
	box-sizing: border-box;
	font-family: var(--font-family-button);
	font-size: var(--font-size-btn);
	font-weight: var(--font-weight-button);
	text-transform: var(--text-transform-button, none);
	letter-spacing: var(--letter-spacing-button);
	line-height: var(--line-height-button);
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	opacity: 1;
	transition:
		background-color var(--transition-base),
		color var(--transition-base);
}

.led-btn:focus-visible,
.green-btn:focus-visible,
.blue-btn:focus-visible,
html body .woocommerce a.button:focus-visible,
html body .woocommerce button.button:focus-visible {
	outline: 2px solid var(--color-secondary);
	outline-offset: 2px;
}

@media (min-width: 981px) {
	.led-btn,
	a.led-btn,
	button.led-btn,
	input.led-btn,
	.green-btn,
	.blue-btn,
	.custom-shop-btn,
	.contact-for-pricing-btn,
	a.blurb-cta,
	html body .product-info-button,
	html body .shop-all-button,
	html body .woocommerce a.button,
	html body .woocommerce button.button,
	html body .woocommerce input.button,
	html body .woocommerce #respond input#submit,
	html body .woocommerce .cart .button,
	html body .woocommerce .checkout-button,
	html body .woocommerce .single_add_to_cart_button,
	html body .woocommerce .add_to_cart_button,
	html body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
	html body .wp-block-button__link {
		font-size: var(--font-size-btn-desktop, var(--font-size-btn));
	}
}

/* --- Primary (solid green) -------------------------------------- */

.led-btn--primary,
.green-btn,
html body .woocommerce a.button,
html body .woocommerce button.button,
html body .woocommerce input.button,
html body .woocommerce #respond input#submit,
html body .woocommerce .cart .button,
html body .woocommerce .single_add_to_cart_button,
html body .woocommerce .add_to_cart_button,
html body .product-info-button,
.custom-shop-btn {
	background-color: var(--btn-primary-bg);
	color: var(--btn-primary-color);
}

.led-btn--primary:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]),
.green-btn:hover,
html body .woocommerce a.button:hover,
html body .woocommerce button.button:hover,
html body .woocommerce input.button:hover,
html body .woocommerce #respond input#submit:hover,
html body .woocommerce .cart .button:hover,
html body .woocommerce .single_add_to_cart_button:hover,
html body .woocommerce .add_to_cart_button:hover,
html body .product-info-button:hover,
.custom-shop-btn:hover {
	background-color: var(--btn-primary-bg-hover);
	color: var(--btn-primary-color);
}

.led-btn--primary:disabled,
.led-btn--primary[disabled],
.led-btn--primary.is-disabled,
.led-btn--primary[aria-disabled="true"],
.green-btn:disabled,
.green-btn[disabled],
.green-btn.is-disabled {
	background-color: var(--btn-primary-bg-disabled);
	color: var(--btn-primary-color-disabled);
	cursor: not-allowed;
	opacity: 1;
}

/* --- Secondary — green outline ---------------------------------- */

.led-btn--secondary,
.led-btn--secondary-green {
	min-height: var(--btn-height-bordered);
	border: var(--btn-border-width) solid var(--btn-secondary-green-border);
	background-color: var(--btn-secondary-green-bg);
	color: var(--btn-secondary-green-color);
	transition:
		background-color var(--transition-base),
		border-color var(--transition-base),
		color var(--transition-base);
}

.led-btn--secondary:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]),
.led-btn--secondary-green:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]) {
	background-color: var(--btn-secondary-green-bg-hover);
	border-color: var(--btn-secondary-green-bg-hover);
	color: var(--btn-secondary-green-color-hover);
}

.led-btn--secondary:disabled,
.led-btn--secondary[disabled],
.led-btn--secondary.is-disabled,
.led-btn--secondary[aria-disabled="true"],
.led-btn--secondary-green:disabled,
.led-btn--secondary-green[disabled],
.led-btn--secondary-green.is-disabled,
.led-btn--secondary-green[aria-disabled="true"] {
	background-color: var(--btn-secondary-green-bg);
	border-color: var(--btn-secondary-green-border-disabled);
	color: var(--btn-secondary-green-color-disabled);
	cursor: not-allowed;
}

/* --- Secondary — dark outline ----------------------------------- */

.led-btn--secondary-dark {
	min-height: var(--btn-height-bordered);
	border: var(--btn-border-width) solid var(--btn-secondary-dark-border);
	background-color: var(--btn-secondary-dark-bg);
	color: var(--btn-secondary-dark-color);
	transition:
		background-color var(--transition-base),
		border-color var(--transition-base),
		color var(--transition-base);
}

.led-btn--secondary-dark:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]) {
	background-color: var(--btn-secondary-dark-bg-hover);
	border-color: var(--btn-secondary-dark-bg-hover);
	color: var(--btn-secondary-dark-color-hover);
}

.led-btn--secondary-dark:disabled,
.led-btn--secondary-dark[disabled],
.led-btn--secondary-dark.is-disabled,
.led-btn--secondary-dark[aria-disabled="true"] {
	background-color: var(--btn-secondary-dark-bg);
	border-color: var(--btn-secondary-dark-border-disabled);
	color: var(--btn-secondary-dark-color-disabled);
	cursor: not-allowed;
}

/* --- Tertiary — white / black text -------------------------------- */

.led-btn--tertiary {
	background-color: var(--btn-tertiary-bg);
	color: var(--btn-tertiary-color);
}

.led-btn--tertiary:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]) {
	background-color: var(--btn-tertiary-bg-hover);
	color: var(--btn-tertiary-color-hover);
}

.led-btn--tertiary:disabled,
.led-btn--tertiary[disabled],
.led-btn--tertiary.is-disabled,
.led-btn--tertiary[aria-disabled="true"] {
	background-color: var(--btn-tertiary-bg-disabled);
	color: var(--btn-tertiary-color-disabled);
	cursor: not-allowed;
}

/* --- Tertiary — orange ------------------------------------------ */

.led-btn--tertiary-orange {
	background-color: var(--btn-orange-bg);
	color: var(--btn-orange-color);
}

.led-btn--tertiary-orange:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]) {
	background-color: var(--btn-orange-bg-hover);
	color: var(--btn-orange-color);
}

.led-btn--tertiary-orange:disabled,
.led-btn--tertiary-orange[disabled],
.led-btn--tertiary-orange.is-disabled,
.led-btn--tertiary-orange[aria-disabled="true"] {
	background-color: var(--btn-orange-bg-disabled);
	color: var(--btn-orange-color);
	cursor: not-allowed;
}

/* --- Tertiary — blue -------------------------------------------- */

.led-btn--tertiary-blue,
.blue-btn,
html body .shop-all-button,
html body .woocommerce .checkout-button,
html body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	background-color: var(--btn-blue-bg);
	color: var(--btn-blue-color);
}

.led-btn--tertiary-blue:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]),
.blue-btn:hover,
html body .shop-all-button:hover,
html body .woocommerce .checkout-button:hover,
html body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
	background-color: var(--btn-blue-bg-hover);
	color: var(--btn-blue-color);
}

.led-btn--tertiary-blue:disabled,
.led-btn--tertiary-blue[disabled],
.led-btn--tertiary-blue.is-disabled,
.led-btn--tertiary-blue[aria-disabled="true"],
.blue-btn:disabled,
.blue-btn[disabled],
.blue-btn.is-disabled,
html body .shop-all-button:disabled,
html body .shop-all-button[disabled],
html body .shop-all-button.is-disabled,
html body .shop-all-button[aria-disabled="true"] {
	background-color: var(--btn-blue-bg-disabled);
	color: var(--btn-blue-color);
	cursor: not-allowed;
}

/* --- Link-style ------------------------------------------------- */

.led-btn--link,
a.blurb-cta,
.contact-for-pricing-btn {
	min-height: auto;
	padding: 0;
	border: none;
	border-radius: 0;
	background: transparent;
	color: var(--btn-link-color);
}

.led-btn--link:hover:not(:disabled):not([disabled]):not(.is-disabled):not([aria-disabled="true"]),
a.blurb-cta:hover,
.contact-for-pricing-btn:hover {
	background: transparent;
	color: var(--btn-link-color-hover);
}

.led-btn--link:disabled,
.led-btn--link[disabled],
.led-btn--link.is-disabled,
.led-btn--link[aria-disabled="true"],
a.blurb-cta.is-disabled,
.contact-for-pricing-btn.is-disabled {
	background: transparent;
	color: var(--btn-link-color-disabled);
	opacity: var(--btn-link-opacity-disabled);
	cursor: not-allowed;
}