/**
 * CFSD shared UI primitives (account + PDP).
 */

.cfsd-button-loader {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -1.35em;
	margin-left: -1.35em;
	width: 2.7em;
	height: 2.7em;
	display: none;
	z-index: 10;
	pointer-events: none;
}

.cfsd-button-loader .cfsd-button-loader-hill {
	position: absolute;
	width: 3.55em;
	height: 3.55em;
	top: 0.85em;
	left: 0.85em;
	background-color: transparent;
	border-left: 0.3em solid var(--comfoo-white, #fff);
	transform: rotate(45deg);
}

.cfsd-button-loader .cfsd-button-loader-hill:after {
	content: '';
	position: absolute;
	width: 3.55em;
	height: 3.55em;
	left: 0;
	background-color: transparent;
}

.cfsd-button-loader .cfsd-button-loader-box {
	position: absolute;
	left: 0;
	bottom: -0.05em;
	width: 0.5em;
	height: 0.5em;
	background-color: transparent;
	border: 0.3em solid var(--comfoo-white, #fff);
	border-radius: 15%;
	transform: translate(0, -0.5em) rotate(-45deg);
	animation: cfsd-button-push 2.5s cubic-bezier(0.79, 0, 0.47, 0.97) infinite;
}

@keyframes cfsd-button-push {
	0% {
		transform: translate(0, -0.5em) rotate(-45deg);
	}
	5% {
		transform: translate(0, -0.5em) rotate(-50deg);
	}
	20% {
		transform: translate(0.5em, -1em) rotate(47deg);
	}
	25% {
		transform: translate(0.5em, -1em) rotate(45deg);
	}
	30% {
		transform: translate(0.5em, -1em) rotate(40deg);
	}
	45% {
		transform: translate(1em, -1.5em) rotate(137deg);
	}
	50% {
		transform: translate(1em, -1.5em) rotate(135deg);
	}
	55% {
		transform: translate(1em, -1.5em) rotate(130deg);
	}
	70% {
		transform: translate(1.5em, -2em) rotate(217deg);
	}
	75% {
		transform: translate(1.5em, -2em) rotate(220deg);
	}
	100% {
		transform: translate(0, -0.5em) rotate(-225deg);
	}
}

.cfsd-save-all.cfsd-button-loading .cfsd-button-text,
.cfsd-save-customer-details.cfsd-button-loading .cfsd-button-text,
.cfsd-account-settings-content .woocommerce-Button.cfsd-button-loading .cfsd-button-text,
.cfsd-account-settings-content .woocommerce-Button.cfsd-button-loading {
	color: transparent !important;
}

.cfsd-account-settings-content .woocommerce-Button.cfsd-button-loading .cfsd-button-text {
	display: none;
}

.cfsd-save-all.cfsd-button-loading .cfsd-button-loader,
.cfsd-save-customer-details.cfsd-button-loading .cfsd-button-loader,
.cfsd-account-settings-content .woocommerce-Button.cfsd-button-loading .cfsd-button-loader,
.cfsd-account-settings-content .cfsd-account-save-btn.cfsd-button-loading .cfsd-button-loader,
.cfsd-modal__confirm.cfsd-button-loading .cfsd-button-loader {
	display: block;
}

.cfsd-modal__confirm.cfsd-button-loading .cfsd-button-text {
	color: transparent !important;
}

.cfsd-pdp-flavors .cfsd-card__price .cfsd-price-compare,
.cfsd-variable-product .cfsd-card__price .cfsd-price-compare {
	color: var(--comfoo-dark-40);
	text-decoration: line-through;
}

.cfsd-pdp-flavors .cfsd-card__price .cfsd-price-sale,
.cfsd-variable-product .cfsd-card__price .cfsd-price-sale {
	font-weight: 700;
	color: var(--comfoo-applepie);
}
