/* Canonical Agape action presentation. Behavior remains block/plugin owned. */

/* Core and WooCommerce text actions use the same restrained material. */
.wp-block-button:where(:not(.is-style-outline):not(.is-style-agape-gold):not(.is-style-agape-teal):not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next)) > .wp-block-button__link,
body.woocommerce-page a.button,
body.woocommerce-page button.button,
body.woocommerce-page input.button,
body.woocommerce-page #respond input#submit,
.agape-cart-breadcrumb__button:not(.agape-cart-breadcrumb__button--secondary) {
	align-items: center;
	background-color: var(--agape-button-green-end) !important;
	background-image: var(--agape-button-green-gradient) !important;
	border: 1px solid var(--agape-button-green-border) !important;
	border-radius: var(--agape-button-radius) !important;
	box-shadow: var(--agape-button-shadow), var(--agape-button-highlight) !important;
	box-sizing: border-box;
	color: var(--agape-button-on-dark) !important;
	cursor: pointer;
	display: inline-flex;
	font-size: 0.95rem;
	font-weight: var(--agape-button-font-weight) !important;
	justify-content: center;
	letter-spacing: 0.005em;
	line-height: 1.15;
	min-height: var(--agape-button-min-height) !important;
	padding: var(--agape-button-padding-y) var(--agape-button-padding-x) !important;
	text-decoration: none !important;
	text-transform: none;
	transition: background-image 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 120ms ease;
}

.wp-block-button:where(:not(.is-style-outline):not(.is-style-agape-gold):not(.is-style-agape-teal):not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next)) > .wp-block-button__link:hover,
.wp-block-button:where(:not(.is-style-outline):not(.is-style-agape-gold):not(.is-style-agape-teal):not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next)) > .wp-block-button__link:focus-visible,
body.woocommerce-page a.button:hover,
body.woocommerce-page a.button:focus-visible,
body.woocommerce-page button.button:hover,
body.woocommerce-page button.button:focus-visible,
body.woocommerce-page input.button:hover,
body.woocommerce-page input.button:focus-visible,
body.woocommerce-page #respond input#submit:hover,
body.woocommerce-page #respond input#submit:focus-visible,
.agape-cart-breadcrumb__button:not(.agape-cart-breadcrumb__button--secondary):hover,
.agape-cart-breadcrumb__button:not(.agape-cart-breadcrumb__button--secondary):focus-visible {
	background-color: var(--agape-button-green-hover-end) !important;
	background-image: var(--agape-button-green-hover-gradient) !important;
	border-color: var(--agape-button-green-hover-border) !important;
	box-shadow: var(--agape-button-hover-shadow), var(--agape-button-highlight) !important;
	color: var(--agape-button-on-dark) !important;
	transform: translateY(-1px);
}

.wp-block-button:where(:not(.is-style-outline):not(.is-style-agape-gold):not(.is-style-agape-teal):not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next)) > .wp-block-button__link:active,
body.woocommerce-page a.button:active,
body.woocommerce-page button.button:active,
body.woocommerce-page input.button:active,
body.woocommerce-page #respond input#submit:active,
.agape-cart-breadcrumb__button:not(.agape-cart-breadcrumb__button--secondary):active {
	background-color: var(--agape-button-green-active-end) !important;
	background-image: var(--agape-button-green-active-gradient) !important;
	box-shadow: var(--agape-button-active-shadow) !important;
	transform: translateY(0);
}

/* Gutenberg exposes these variants in the Button block Styles panel. */
.wp-block-button.is-style-agape-gold > .wp-block-button__link,
.agape-button--gold {
	background-color: var(--agape-button-gold-end) !important;
	background-image: var(--agape-button-gold-gradient) !important;
	border-color: var(--agape-button-gold-border) !important;
	color: var(--agape-button-on-dark) !important;
}

.wp-block-button.is-style-agape-gold > .wp-block-button__link:hover,
.wp-block-button.is-style-agape-gold > .wp-block-button__link:focus-visible,
.agape-button--gold:hover,
.agape-button--gold:focus-visible {
	background-color: var(--agape-button-gold-hover-end) !important;
	background-image: var(--agape-button-gold-hover-gradient) !important;
	border-color: var(--agape-button-gold-hover-border) !important;
}

.wp-block-button.is-style-agape-gold > .wp-block-button__link:active,
.agape-button--gold:active {
	background-color: var(--agape-button-gold-active-end) !important;
	background-image: var(--agape-button-gold-active-gradient) !important;
	border-color: var(--agape-button-gold-hover-border) !important;
	box-shadow: var(--agape-button-active-shadow) !important;
	transform: translateY(0);
}

.wp-block-button.is-style-agape-teal > .wp-block-button__link,
.agape-button--teal {
	background-color: var(--agape-button-teal-end) !important;
	background-image: var(--agape-button-teal-gradient) !important;
	border-color: var(--agape-button-teal-border) !important;
	color: var(--agape-button-on-dark) !important;
}

.wp-block-button.is-style-agape-teal > .wp-block-button__link:hover,
.wp-block-button.is-style-agape-teal > .wp-block-button__link:focus-visible,
.agape-button--teal:hover,
.agape-button--teal:focus-visible {
	background-color: var(--agape-button-teal-hover-end) !important;
	background-image: var(--agape-button-teal-hover-gradient) !important;
	border-color: var(--agape-button-teal-hover-border) !important;
}

.wp-block-button.is-style-agape-teal > .wp-block-button__link:active,
.agape-button--teal:active {
	background-color: var(--agape-button-teal-active-end) !important;
	background-image: var(--agape-button-teal-active-gradient) !important;
	border-color: var(--agape-button-teal-hover-border) !important;
	box-shadow: var(--agape-button-active-shadow) !important;
	transform: translateY(0);
}

.wp-block-button.is-style-agape-pill > .wp-block-button__link,
.agape-header-actions .wp-block-button__link,
.agape-mobile-donate .wp-block-button__link,
.agape-button--pill {
	border-radius: var(--agape-button-pill-radius) !important;
}

.wp-block-button.is-style-outline:not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next) > .wp-block-button__link,
.agape-cart-breadcrumb__button--secondary {
	background: color-mix(in srgb, var(--agape-ui-primary) 7%, #fff) !important;
	border: 1px solid color-mix(in srgb, var(--agape-ui-primary) 58%, transparent) !important;
	border-radius: var(--agape-button-radius) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
	color: var(--agape-ui-primary-hover) !important;
	font-weight: var(--agape-button-font-weight) !important;
	min-height: var(--agape-button-min-height) !important;
	padding: var(--agape-button-padding-y) var(--agape-button-padding-x) !important;
}

.wp-block-button.is-style-outline:not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next) > .wp-block-button__link:hover,
.wp-block-button.is-style-outline:not(.agape-logo-carousel__prev):not(.agape-logo-carousel__next) > .wp-block-button__link:focus-visible,
.agape-cart-breadcrumb__button--secondary:hover,
.agape-cart-breadcrumb__button--secondary:focus-visible {
	background: color-mix(in srgb, var(--agape-ui-primary) 14%, #fff) !important;
	border-color: var(--agape-button-green-hover-border) !important;
	color: var(--agape-ui-heading) !important;
}

body.woocommerce-page :where(a.button, button.button, input.button):disabled,
body.woocommerce-page :where(a.button, button.button, input.button).disabled,
body.woocommerce-page :where(a.button, button.button, input.button):disabled:hover,
body.woocommerce-page :where(a.button, button.button, input.button).disabled:hover {
	background: #e5eae5 !important;
	border-color: #d4dbd5 !important;
	box-shadow: none !important;
	color: #78827b !important;
	cursor: not-allowed;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-button__link,
	body.woocommerce-page :where(a.button, button.button, input.button) {
		transition: none !important;
	}
}
