/**
 * Related products (Elementor 641 / kitify-wooproducts 623c97df) slide buttons —
 * identical to homepage collection/style Kitify arrows (jaj-style-slider.css).
 */

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 8px !important;
	background: rgba(46, 90, 167, 0.5) !important;
	background-color: rgba(46, 90, 167, 0.5) !important;
	color: #fff !important;
	fill: #fff !important;
	border: none !important;
	box-shadow: none !important;
	line-height: 0 !important;
	text-align: center !important;
	/* Center on photo height (set by jaj-related-products.js). */
	top: var(--jaj-arrow-top, 50%) !important;
	transform: translateY(-50%) !important;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow span,
.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow i,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow span,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow i {
	display: none !important;
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow::before,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow::before {
	content: "" !important;
	display: block !important;
	width: 14px !important;
	height: 14px !important;
	margin: 0 !important;
	flex-shrink: 0;
	background-color: #fff !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.prev-arrow::before,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.prev-arrow::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15 5L8 12l7 7' stroke='%23000' stroke-width='3.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15 5L8 12l7 7' stroke='%23000' stroke-width='3.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.next-arrow::before,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.next-arrow::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 5l7 7-7 7' stroke='%23000' stroke-width='3.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 5l7 7-7 7' stroke='%23000' stroke-width='3.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow:hover,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow:hover {
	background: rgba(0, 0, 0, 0.5) !important;
	background-color: rgba(0, 0, 0, 0.5) !important;
	color: #fff !important;
	fill: #fff !important;
}

.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow:hover::before,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow:hover::before {
	background-color: #fff !important;
	color: transparent !important;
}

/* Same as PDP thumbnail strip: hide the arrow that can't move further (no wrap). */
.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.swiper-button-disabled,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.swiper-button-disabled,
.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.is-disabled,
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.is-disabled,
.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow[aria-disabled="true"],
.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow[aria-disabled="true"] {
	display: none !important;
	opacity: 0 !important;
	pointer-events: none !important;
	cursor: default !important;
}

@media (max-width: 767px) {
	.single-product .elementor-kitify-wooproducts .kitify-carousel,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel {
		overflow: visible !important;
	}

	.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.prev-arrow,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.prev-arrow {
		left: -20px !important;
		right: auto !important;
	}

	.single-product .elementor-kitify-wooproducts .kitify-carousel .kitify-arrow.next-arrow,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .kitify-arrow.next-arrow {
		right: -20px !important;
		left: auto !important;
	}
}

/*
 * Related / recommended products: 9:16 photo tiles.
 * Crop via object-fit only — source image files unchanged.
 * 2 columns only on mobile; PC keeps Elementor carousel columns + arrows.
 */
.single-product .elementor-kitify-wooproducts .product-item__thumbnail,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail {
	aspect-ratio: 9 / 16;
	width: 100%;
	overflow: hidden;
	background: #f2f2f2;
}

.single-product .elementor-kitify-wooproducts .product-item__thumbnail-placeholder,
.single-product .elementor-kitify-wooproducts .product-item__thumbnail-placeholder a,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail-placeholder,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail-placeholder a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	min-height: 100%;
}

/* Cover tile even when there is no second/gallery thumb (or only a placeholder). */
.single-product .elementor-kitify-wooproducts .product-item__thumbnail-placeholder img,
.single-product .elementor-kitify-wooproducts .product-item__thumbnail-placeholder a img,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail-placeholder img,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail-placeholder a img {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover !important;
	object-position: center center !important;
}

/*
 * Crossfade / photo-shift (Kitify enable_alt_image).
 * Theme hover rules are under ul.products — keep those, and add tap toggle for mobile.
 */
.single-product .elementor-kitify-wooproducts .product-item__thumbnail-placeholder .product_second_image,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail-placeholder .product_second_image {
	position: absolute !important;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	display: block;
	opacity: 0;
	background-size: cover !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	transition: opacity 300ms ease-in-out;
	pointer-events: none;
	z-index: 1;
}

.single-product .elementor-kitify-wooproducts .product-item:hover .product-item__thumbnail-placeholder .product_second_image,
.single-product .elementor-kitify-wooproducts .product-item.is-showing-second .product-item__thumbnail-placeholder .product_second_image,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item:hover .product-item__thumbnail-placeholder .product_second_image,
.elementor-641 .elementor-element.elementor-element-623c97df .product-item.is-showing-second .product-item__thumbnail-placeholder .product_second_image {
	opacity: 1;
}

@media (max-width: 767px) {
	.single-product .elementor-kitify-wooproducts .kitify-carousel .swiper-slide,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .swiper-slide {
		width: 50% !important;
		max-width: 50%;
		box-sizing: border-box;
	}

	/*
	 * Mobile: show full title + price (no line-clamp). Let cards grow and add
	 * space above the footer so nothing is clipped.
	 */
	.single-product .elementor-kitify-wooproducts .swiper-slide,
	.single-product .elementor-kitify-wooproducts .product-item,
	.single-product .elementor-kitify-wooproducts li.product,
	.elementor-641 .elementor-element.elementor-element-623c97df .swiper-slide,
	.elementor-641 .elementor-element.elementor-element-623c97df .product-item,
	.elementor-641 .elementor-element.elementor-element-623c97df li.product {
		overflow: visible !important;
		height: auto !important;
	}

	.single-product .elementor-kitify-wooproducts .kitify-products__list_wrapper.swiper-container,
	.single-product .elementor-kitify-wooproducts .kitify-carousel .swiper-wrapper,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-products__list_wrapper.swiper-container,
	.elementor-641 .elementor-element.elementor-element-623c97df .kitify-carousel .swiper-wrapper {
		height: auto !important;
		padding-bottom: 12px !important;
		box-sizing: border-box !important;
	}

	.single-product .elementor-kitify-wooproducts .product-item__thumbnail,
	.elementor-641 .elementor-element.elementor-element-623c97df .product-item__thumbnail {
		overflow: hidden;
	}

	.single-product .elementor-kitify-wooproducts .product-item__description,
	.elementor-641 .elementor-element.elementor-element-623c97df .product-item__description {
		overflow: visible !important;
		padding-bottom: 8px;
	}

	.single-product .elementor-kitify-wooproducts .woocommerce-loop-product__title,
	.elementor-641 .elementor-element.elementor-element-623c97df .woocommerce-loop-product__title {
		display: block;
		-webkit-line-clamp: unset;
		line-clamp: unset;
		overflow: visible;
		text-overflow: unset;
		white-space: normal;
		max-height: none;
	}

	.single-product .elementor-kitify-wooproducts .product-item__description--info .price,
	.elementor-641 .elementor-element.elementor-element-623c97df .product-item__description--info .price {
		display: inline-block;
		max-width: 100%;
		overflow: visible;
		white-space: nowrap;
		line-height: 1.4;
	}

	/* Extra blank space before the footer so full title + price stay on screen */
	.single-product .elementor-kitify-wooproducts,
	.elementor-641 .elementor-element.elementor-element-623c97df {
		margin-bottom: 48px !important;
		padding-bottom: 24px !important;
	}
}