/* ==========================================================================
   Fuse slide-hover button animation (global – includes WooCommerce targets)
   ========================================================================== */

.elementor-element.fs-anim-btn .elementor-button,
.form-button-custom .fs-anim-btn,
.form-button-custom .ff_upload_btn,
.form-button-custom-2 .fs-anim-btn,

.fs-course-add-to-cart-btn a.button,
.fs-course-add-to-cart-btn a.add_to_cart_button,
.fs-course-add-to-cart-btn .single_add_to_cart_button,

.fs-single-add-to-cart-btn button.single_add_to_cart_button,
.fs-single-add-to-cart-btn .single_add_to_cart_button,
.fs-single-add-to-cart-btn a.button,

.fs-single-checkout-btn .elementor-button,
.fs-single-checkout-btn a.elementor-button,

.fs-menu-cart .elementor-menu-cart__footer-buttons > a.elementor-button--checkout {
	position: relative !important;
	overflow: hidden !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	height: 50px !important;
	min-height: 50px !important;
	padding: 0 30px !important;
}

.fs-anim-wrap {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	overflow: hidden;
}

.fs-anim-layer {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	pointer-events: none;
	white-space: nowrap;
}

.fs-anim-layer--clone {
	position: absolute !important;
	left: 0;
	top: 0;
	transform: translateY(110%);
}

@media (min-width: 600px) {
	.elementor-element.fs-anim-btn .elementor-button:hover .fs-anim-layer:first-child,
	.form-button-custom .fs-anim-btn:hover .fs-anim-layer:first-child,
	.form-button-custom .ff_upload_btn:hover .fs-anim-layer:first-child,
	.form-button-custom-2 .fs-anim-btn:hover .fs-anim-layer:first-child,

	.fs-course-add-to-cart-btn a.button:hover .fs-anim-layer:first-child,
	.fs-course-add-to-cart-btn a.add_to_cart_button:hover .fs-anim-layer:first-child,
	.fs-course-add-to-cart-btn .single_add_to_cart_button:hover .fs-anim-layer:first-child,

	.fs-single-add-to-cart-btn button.single_add_to_cart_button:hover .fs-anim-layer:first-child,
	.fs-single-add-to-cart-btn .single_add_to_cart_button:hover .fs-anim-layer:first-child,
	.fs-single-add-to-cart-btn a.button:hover .fs-anim-layer:first-child,

	.fs-single-checkout-btn .elementor-button:hover .fs-anim-layer:first-child,
	.fs-single-checkout-btn a.elementor-button:hover .fs-anim-layer:first-child,

	.fs-menu-cart .elementor-menu-cart__footer-buttons > a.elementor-button--checkout:hover .fs-anim-layer:first-child {
		transform: translateY(-110%);
	}

	.elementor-element.fs-anim-btn .elementor-button:hover .fs-anim-layer--clone,
	.form-button-custom .fs-anim-btn:hover .fs-anim-layer--clone,
	.form-button-custom .ff_upload_btn:hover .fs-anim-layer--clone,
	.form-button-custom-2 .fs-anim-btn:hover .fs-anim-layer--clone,

	.fs-course-add-to-cart-btn a.button:hover .fs-anim-layer--clone,
	.fs-course-add-to-cart-btn a.add_to_cart_button:hover .fs-anim-layer--clone,
	.fs-course-add-to-cart-btn .single_add_to_cart_button:hover .fs-anim-layer--clone,

	.fs-single-add-to-cart-btn button.single_add_to_cart_button:hover .fs-anim-layer--clone,
	.fs-single-add-to-cart-btn .single_add_to_cart_button:hover .fs-anim-layer--clone,
	.fs-single-add-to-cart-btn a.button:hover .fs-anim-layer--clone,

	.fs-single-checkout-btn .elementor-button:hover .fs-anim-layer--clone,
	.fs-single-checkout-btn a.elementor-button:hover .fs-anim-layer--clone,

	.fs-menu-cart .elementor-menu-cart__footer-buttons > a.elementor-button--checkout:hover .fs-anim-layer--clone {
		transform: translateY(0);
	}
}

/* Upload button */
.form-button-custom .ff_upload_btn {
	background-color: #ffffff !important;
	border: 2px solid #E30B2E !important;
	color: #E30B2E !important;
	border-radius: 4px;
	cursor: pointer;
}

.form-button-custom .ff_upload_btn .fs-anim-layer::before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background-color: currentColor;
	-webkit-mask-image: url('https://fuse.club/wp-content/uploads/2025/12/Submit-Progress.svg');
	mask-image: url('https://fuse.club/wp-content/uploads/2025/12/Submit-Progress.svg');
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.form-button-custom .ff_upload_btn:hover {
	background-color: #ffffff !important;
	color: #E30B2E !important;
	opacity: 1 !important;
}

.form-button-custom input[type="file"].fs-upload-btn {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	-webkit-clip-path: inset(50%) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;
}

/* Multiline variant – use with fs-anim-btn fs-anim-btn--wrap */
.elementor-element.fs-anim-btn.fs-anim-btn--wrap .elementor-button,
.fs-anim-btn.fs-anim-btn--wrap,
.fs-anim-btn--wrap .fs-anim-layer {
	white-space: normal !important;
	text-align: center;
	line-height: 1.3;
}

.fs-anim-btn--wrap .fs-anim-wrap {
	height: auto;
	min-height: 100%;
}

.fs-anim-btn--wrap .fs-anim-layer {
	padding-top: 8px;
	padding-bottom: 8px;
}

/* Legacy simple hover (optional) */
/* .fh-button a:hover {
	background-color: #bf0b26;
} */
