/* Jaggi Handlooms — WooCommerce shop archive */

/* Product hover gallery (functions.php add_hover_image_slider_html) */
li.product {
	position: relative;
	overflow: hidden;
}

.woocommerce-loop-product__link {
	position: relative;
	display: block;
	overflow: hidden;
}

.hover-slider-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease-in-out;
}

.hover-slider-track {
	display: flex;
	height: 100%;
	transition: transform 0.6s ease-in-out;
	will-change: transform;
}

.hover-slider-image {
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
	user-select: none;
}

li.product:hover .hover-slider-wrapper {
	opacity: 1;
}

li.product .et_overlay {
	opacity: 0 !important;
}

/* Shop hero banner */
.custom-shop-banner {
	background-image: var(--jaggi-shop-banner-bg);
	background-size: cover;
	background-position: center;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.custom-shop-banner__heading {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 65px;
	color: #fff !important;
	line-height: 1.2em;
	text-align: center;
	margin-bottom: 10px !important;
}

.custom-shop-banner__breadcrumbs ol.fbc-items {
	text-align: center !important;
}

.custom-shop-banner .flx-brdcrumb .fbc-items {
	width: 100% !important;
}

.custom-shop-banner .flx-brdcrumb .fbc-items li {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.custom-shop-banner .flx-brdcrumb .fbc-wrap li,
.custom-shop-banner .flx-brdcrumb .fbc-wrap li a,
.custom-shop-banner .flx-brdcrumb .fbc-wrap li span {
	font-size: 18px !important;
	color: #fff !important;
}

.custom-shop-banner .flx-brdcrumb .fbc-wrap li a:hover {
	color: #f07730 !important;
}

.custom-shop-banner .flx-brdcrumb .fbc-separator {
	color: rgba(255, 255, 255, 0.7) !important;
}

/* Shop layout */
.woocommerce-shop #main-content .container::before {
	display: none !important;
}

.woocommerce-shop #left-area .woocommerce-breadcrumb,
.woocommerce-shop #left-area .woocommerce-products-header {
	display: none;
}

.woocommerce-shop #main-content .container {
	padding-top: 85px !important;
	padding-bottom: 5px;
}

.woocommerce-shop #left-area {
	padding-left: 37px !important;
	width: 74.125% !important;
}

.woocommerce-shop #sidebar {
	width: 25.875% !important;
}

/* Result count + sort */
.woocommerce-shop.woocommerce .woocommerce-result-count {
	font-size: 20px;
	font-weight: 300;
	color: #212121 !important;
	margin: 0;
	margin-top: 5px;
}

.woocommerce-shop form.woocommerce-ordering {
	margin-top: 25px;
	margin-bottom: 45px;
}

.woocommerce .woocommerce-ordering select {
	background: transparent !important;
	border: 1px solid #d9d9d9;
	border-radius: 0;
	height: 45px;
	font-size: 18px;
	font-weight: 400 !important;
	text-transform: capitalize;
	color: #212121 !important;
	font-family: 'Urbanist', sans-serif;
}

/* Product grid */
.woocommerce-shop.woocommerce ul.products li {
	margin-right: 35px !important;
	width: calc(33.33% - 35px) !important;
	margin-bottom: 40px !important;
}

.woocommerce ul.products li.product h2 {
	padding: 0 !important;
	font-family: 'Urbanist', sans-serif;
	font-weight: 500;
	line-height: 26px;
	font-size: 18px !important;
	text-align: left !important;
	color: #212121 !important;
	transition: all 0.4s ease-in-out;
	margin-top: 5px !important;
}

.woocommerce ul.products li.product span.price {
	margin-top: 8px !important;
	font-size: 16px;
	color: #828282 !important;
}

.woocommerce ul.products li.product span.price del {
	opacity: 1;
}

.woocommerce ul.products li.product span.price del bdi {
	font-weight: 300 !important;
	font-size: 16px !important;
	color: #828282 !important;
}

.woocommerce ul.products li.product span.price bdi {
	font-weight: 600 !important;
	font-size: 18px !important;
	color: #212121 !important;
}

.woocommerce ul.products li.product span.price .sale-percentage {
	font-weight: 400 !important;
	color: #ff4b26 !important;
}

.woocommerce ul.products li .yith-add-to-wishlist-button-block {
	position: absolute;
	z-index: 3;
}

.woocommerce ul.products li.product .star-rating {
	margin-top: 12px !important;
	margin-bottom: 0 !important;
}

.woocommerce ul.products li .star-rating span::before {
	color: #f07730;
}

/* WPF filters sidebar */
.wpfFilterTitle i {
	display: none !important;
}

.wpfFilterWrapper .wfpTitle {
	font-size: 20px;
	font-weight: 600;
	color: #212121 !important;
	text-transform: uppercase;
	border-bottom: 1px solid #e66d26 !important;
	padding-bottom: 7px;
}

.wpfFilterTitle {
	margin-bottom: 20px !important;
	border-bottom: 1px solid #2121211a;
}

.wpfCheckboxHier .wpfFilterContent ul input[type='checkbox'] {
	appearance: none !important;
}

.wpfCheckboxHier .wpfCheckbox input[type='checkbox'] {
	appearance: none !important;
	-webkit-appearance: none !important;
	position: relative;
	padding: 0 10px 20px 15px !important;
	margin: 0;
}

.wpfCheckbox input[type='checkbox']::before {
	content: '';
	width: 17px;
	line-height: 17px;
	height: 17px;
	border: 1.8px solid #d9d9d9;
	display: inline-block;
	position: absolute;
	top: 4px;
	left: 0;
}

.wpfCheckbox input[type='checkbox']:checked::before {
	font-size: 15px;
	content: '\2713';
	color: #fff;
	background: #f07730;
	line-height: 17px;
	font-weight: 600;
	border-color: #f07730;
	text-align: center;
}

.wpfCheckboxHier .wpfFilterVerScroll .wpfValue {
	color: #212121 !important;
	transition: all 0.4s !important;
}

.wpfCheckboxHier .wpfFilterVerScroll li label:hover .wpfValue,
.wpfCheckboxHier .wpfFilterVerScroll li label:hover span.wpfCount {
	letter-spacing: 0.01em;
	color: #f07730 !important;
}

.wpfCheckboxHier .wpfFilterVerScroll span.wpfCount {
	font-weight: 400;
	transition: all 0.4s !important;
}

.woocommerce-shop .wpfFilterWrapper {
	padding: 0 !important;
	margin-top: 0;
	margin-bottom: 40px;
}

.woocommerce-shop .wpfFilterWrapper .wpfFilterVerScroll li:last-child {
	margin-bottom: 0 !important;
}

.wpfCheckboxHier .wpfFilterVerScroll ul {
	margin-top: 8px;
}

.woocommerce-shop .wpfMainWrapper {
	position: relative;
	top: -10px;
}

.woocommerce-shop .wpfMainWrapper .wpfFilterButtons button.wpfClearButton {
	margin: 0;
	color: #fff !important;
	letter-spacing: 0.05em;
	border: none !important;
	font-size: 18px;
	text-transform: uppercase !important;
	background-color: #f07730;
	height: 50px;
	cursor: pointer;
	transition: all 0.4s;
}

.woocommerce-shop .wpfMainWrapper .wpfFilterButtons button.wpfClearButton:hover {
	background-color: #212121 !important;
}

.ui-slider-range.ui-corner-all.ui-widget-header {
	background: #f07730 !important;
	height: 7px;
	top: 2px;
}

div#wpfSliderRange {
	border: 0 !important;
}

span.ui-slider-handle.ui-corner-all.ui-state-default {
	border: none !important;
	background: #f07730 !important;
	width: 12px !important;
}

.wpfFilterWrapper .wpfPriceInputs {
	justify-content: left !important;
}

.wpfFilterWrapper .wpfFilterContent .wpfPriceInputs::before {
	content: 'Price:';
	color: #212121 !important;
	font-weight: 300 !important;
	margin-right: 8px;
}

.wpfFilterWrapper .wpfFilterContent .wpfPriceInputs input {
	border: 1px solid #21212129;
	min-width: 0 !important;
	color: #212121 !important;
	font-size: 18px;
	font-weight: 500 !important;
}

@media only screen and (max-width: 980px) {
	.custom-shop-banner {
		min-height: 250px !important;
	}

	.custom-shop-banner__heading {
		font-size: 45px !important;
	}

	body.woocommerce-shop #left-area,
	body.woocommerce-shop #sidebar {
		padding-left: 0 !important;
		width: 100% !important;
	}

	.woocommerce-shop.woocommerce ul.products li {
		width: calc(50% - 20px) !important;
		margin-right: 20px !important;
	}
}

@media only screen and (max-width: 767px) {
	.woocommerce-shop.woocommerce ul.products li {
		width: 100% !important;
		margin-right: 0 !important;
	}
}