/* Jellyfish product sliders: preserve existing cards, change only the group flow. */
:root {
	--jf-slider-navy: #132F4A;
	--jf-slider-border: #E5E0D8;
	--jf-slider-gap: 8px;
	--jf-slider-arrow-bg: #132F4A;
	--jf-slider-progress-bg: rgba(27, 42, 74, .12);
	--jf-slider-peek: clamp(34px, 4vw, 72px);
}

.jf-product-slider {
	position: relative;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
}

.home .elementor-widget-jet-listing-grid .jf-product-slider {
	padding-top: 0;
}

.jf-product-slider__controls {
	display: flex;
	justify-content: flex-end;
	gap: 14px;
	margin: 0 0 24px;
	padding-right: clamp(20px, 3vw, 52px);
}

.home .elementor-widget-jet-listing-grid .jf-product-slider__controls {
	position: absolute;
	right: 0;
	top: -64px;
	z-index: 2;
	margin: 0;
}

.jf-product-slider__button {
	appearance: none;
	width: 44px;
	height: 44px;
	border: 1px solid var(--jf-slider-navy) !important;
	border-radius: 999px;
	background: var(--jf-slider-arrow-bg) !important;
	background-color: var(--jf-slider-arrow-bg) !important;
	box-shadow: none !important;
	color: #fff !important;
	font: 22px/1 var(--jf-font-display, Georgia, serif);
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: opacity .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.jf-product-slider__button:hover,
.jf-product-slider__button:focus,
.jf-product-slider__button:focus-visible,
.jf-product-slider__button:active {
	background: var(--jf-slider-navy) !important;
	background-color: var(--jf-slider-navy) !important;
	border-color: var(--jf-slider-navy) !important;
	box-shadow: none !important;
	color: #fff !important;
	outline: none !important;
	transform: translateY(-1px);
}

.jf-product-slider__button:disabled,
.jf-product-slider__button[disabled] {
	background: rgba(255, 255, 255, .72) !important;
	background-color: rgba(255, 255, 255, .72) !important;
	border-color: rgba(27, 42, 74, .24) !important;
	box-shadow: none !important;
	color: var(--jf-slider-navy) !important;
	opacity: .36;
	cursor: default;
	transform: none;
}

.jf-product-slider__button:disabled:hover,
.jf-product-slider__button[disabled]:hover,
.jf-product-slider__button:disabled:focus,
.jf-product-slider__button[disabled]:focus,
.jf-product-slider__button:disabled:active,
.jf-product-slider__button[disabled]:active {
	background: rgba(255, 255, 255, .72) !important;
	background-color: rgba(255, 255, 255, .72) !important;
	border-color: rgba(27, 42, 74, .24) !important;
	color: var(--jf-slider-navy) !important;
}

.jf-product-slider__track,
.woocommerce ul.products.jf-product-slider__track,
.woocommerce-page ul.products.jf-product-slider__track,
.wc-block-product-template.jf-product-slider__track,
.jet-listing-grid__items.jf-product-slider__track {
	display: flex !important;
	flex-wrap: nowrap !important;
	grid-template-columns: none !important;
	gap: var(--jf-slider-gap) !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	scroll-snap-type: x proximity;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	max-width: 100%;
	width: 100% !important;
	padding-bottom: 10px !important;
	cursor: grab;
	touch-action: pan-x;
}

.jf-product-slider__track::-webkit-scrollbar {
	display: none;
}

.jf-product-slider__track {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.jf-product-slider__track.is-dragging {
	cursor: grabbing;
	scroll-behavior: auto;
}

.jf-product-slider__track > .jet-listing-grid__item,
.jf-product-slider__track > li.product,
.jf-product-slider__track > .product,
.jf-product-slider__track > .wc-block-product,
.woocommerce ul.products.jf-product-slider__track > li.product,
.woocommerce-page ul.products.jf-product-slider__track > li.product {
	flex: 0 0 calc((100% - var(--jf-slider-peek) - (var(--jf-slider-gap) * 3)) / 4) !important;
	width: calc((100% - var(--jf-slider-peek) - (var(--jf-slider-gap) * 3)) / 4) !important;
	min-width: calc((100% - var(--jf-slider-peek) - (var(--jf-slider-gap) * 3)) / 4) !important;
	max-width: none !important;
	margin: 0 !important;
	scroll-snap-align: start;
}

.woocommerce ul.products.jf-product-slider__track,
.woocommerce-page ul.products.jf-product-slider__track,
.wc-block-product-template.jf-product-slider__track,
.jet-listing-grid__items.jf-product-slider__track {
	clear: both;
}

.jf-product-slider__progress {
	position: relative;
	width: min(220px, calc(100% - 32px));
	height: 2px;
	margin: 12px clamp(16px, 2.4vw, 42px) 0 auto;
	overflow: hidden;
	background: var(--jf-slider-progress-bg);
}

.jf-product-slider__progress-bar {
	position: absolute;
	inset: 0 auto 0 0;
	display: block;
	width: 18%;
	background: var(--jf-slider-navy);
	transform: translateX(0);
	transform-origin: left center;
	transition: transform .18s ease, width .18s ease;
}

.jf-related-section .jf-product-slider__controls {
	margin-bottom: 12px;
}

.jf-related-section .jf-product-slider__track > li.product {
	flex-basis: 180px !important;
	width: 180px !important;
	min-width: 180px !important;
}

body.post-type-archive-product .jf-product-slider__controls,
body.tax-product_cat .jf-product-slider__controls,
body.tax-product_tag .jf-product-slider__controls,
body.woocommerce-shop .jf-product-slider__controls {
	display: none !important;
}

body.post-type-archive-product .woocommerce ul.products.jf-product-slider__track,
body.tax-product_cat .woocommerce ul.products.jf-product-slider__track,
body.tax-product_tag .woocommerce ul.products.jf-product-slider__track,
body.woocommerce-shop .woocommerce ul.products.jf-product-slider__track {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	flex-wrap: initial !important;
	gap: 48px 8px !important;
	overflow: visible !important;
	scroll-snap-type: none !important;
	padding-bottom: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	cursor: default;
}

body.post-type-archive-product .woocommerce ul.products.jf-product-slider__track > li.product,
body.tax-product_cat .woocommerce ul.products.jf-product-slider__track > li.product,
body.tax-product_tag .woocommerce ul.products.jf-product-slider__track > li.product,
body.woocommerce-shop .woocommerce ul.products.jf-product-slider__track > li.product {
	flex: initial !important;
	width: auto !important;
	min-width: 0 !important;
	scroll-snap-align: none !important;
}

@media (max-width: 768px) {
	.jf-product-slider__controls {
		display: flex;
		margin-bottom: 16px;
		padding-right: 16px;
	}

	.jf-product-slider__button {
		width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.jf-product-slider__track {
		scroll-snap-type: x mandatory;
		max-width: 100%;
		width: 100% !important;
	}

	.jf-product-slider__track > .jet-listing-grid__item,
	.jf-product-slider__track > li.product,
	.jf-product-slider__track > .product,
	.jf-product-slider__track > .wc-block-product,
	.woocommerce ul.products.jf-product-slider__track > li.product,
	.woocommerce-page ul.products.jf-product-slider__track > li.product {
		flex-basis: calc(100% - 58px) !important;
		width: calc(100% - 58px) !important;
		min-width: calc(100% - 58px) !important;
	}

	.jf-related-section .jf-product-slider__track > li.product {
		flex-basis: 140px !important;
		width: 140px !important;
		min-width: 140px !important;
	}
}
