.wd-add-btn-replace>a {
	--btn-padding: 0;
	overflow: hidden;
}

.wd-add-btn-replace>a span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: inherit;
	transition: transform .25s ease, opacity .15s ease;
}

.wd-add-btn-replace>a:before {
	content: var(--wd-btn-icon, unset);
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 400;
	font-size: 20px;
	transition: opacity .15s ease, transform .25s ease;
	transform: translateY(100%);
	font-family: "woodmart-font";
}

.wd-add-btn-replace>a:after {
	position: absolute;
	top: calc(50% - 9px);
	inset-inline-start: calc(50% - 9px);
	opacity: 0;
	transition: opacity .2s ease;
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	border: 1px solid rgba(0, 0, 0, 0);
	border-left-color: currentColor;
	border-radius: 50%;
	vertical-align: middle;
	animation: wd-rotate 450ms infinite linear var(--wd-anim-state, paused);
}

.wd-add-btn-replace>a:hover:before {
	transform: translateY(0) translateZ(0);
}

.wd-add-btn-replace>a:hover span {
	transform: translateY(-100%) translateZ(0);
}

.wd-add-btn-replace>a.loading:before, .wd-add-btn-replace>a.loading span {
	opacity: 0;
}

.wd-add-btn-replace>a.loading:after {
	opacity: 1;
	--wd-anim-state: running;
}

.wd-add-btn-replace>a.added {
	--wd-btn-icon: "";
}

.wd-add-btn-replace .wd-action-icon {
	display: none;
}