/* ── Shop banner dark overlay (desktop) ── */
#shop-top-banner {
	overflow: hidden;
}
#shop-top-banner:before {
	content: "";
	width: 80%;
	height: 800px;
	position: absolute;
	bottom: 0px;
	left: -17%;
	top: -415px;
	z-index: 1;
	right: 0px;
	background: #000000d1;
	background-size: 100% 100%;
	background-position: 0px 0px;
	border-radius: 50%;
	filter: blur(0px);
	border: 1px solid #3b3b3b;
}

/**woocommerce***/
.woocommerce ul.products li.product a img {

	 transition: 0.9s;
}
.woocommerce ul.products li.product a:hover img {
    transform: scale(1.1);
}
.woocommerce ul.products li.product .custom-woocommerce-thumbnail{
	 background: #F8F8F8;
    padding: 40px;
    border-radius: 12px;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 {
    padding: .5em 0;
    margin: 0;
    font-size: 1em;
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #1E1E1E;
}
.woocommerce ul.products li.product .price {
font-size: 16px;
    color: #EB601D !important;
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    width: 50%;
    float: left;
}
.woocommerce-product-category{
    padding: 10px 0px;
}
.woocommerce-product-category a{
    color: #7E7E7E;
}
.post-type-archive .wcpf-layout-item.wcpf-box-style .wcpf-heading-label,
.post-type-archive .wcpf-field-item.wcpf-box-style .wcpf-heading-label {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
    background: #000000;
    color: #fff;
    padding: 15px;
    text-transform: capitalize;
}
.post-type-archive .wcpf-layout-item.wcpf-box-style .wcpf-heading-label .box-toggle,
.post-type-archive .wcpf-field-item.wcpf-box-style .wcpf-heading-label .box-toggle {
    color: #fff;
}
.wcpf-field-color-list .wcpf-content, .wcpf-field-text-list .wcpf-content, .wcpf-field-box-list .wcpf-content, .wcpf-field-checkbox-list .wcpf-content, .wcpf-field-radio-list .wcpf-content, .wcpf-field-drop-down-list .wcpf-content, .wcpf-field-price-slider .wcpf-content {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 6px;
    padding: 15px;
}

.woocommerce ul.products li.product .button {
    display: none;
}

/* Arrow for collapsed filter */
#custom-filter  .fa-minus:before {
    content: "\f077"; /* Font Awesome down arrow (collapsed state) */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
    display: inline-block;
    font-size:16px;
}

/* Arrow for expanded filter */
#custom-filter .fa-plus:before {
    content: "\f078"; /* Font Awesome up arrow (expanded state) */
     /*//transform: rotate(180deg); /* Optional: Rotate arrow when expanded */
	  font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
    display: inline-block;
    font-size:16px;
}
#custom-filter .wpfFilterWrapper .wfpTitle {
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    font-size: 16px;
}
#custom-filter .wpfFilterWrapper .wpfFilterTitle {
    cursor: pointer;
    position: relative;
    cursor: pointer;
    background: #000000;
    color: #fff;
    padding: 8px 10px 15px 10px;
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    font-size: 16px;
}
#custom-filter .wpfFilterWrapper i,
#custom-filter .wpfFilterWrapper svg {
    float: right;
    top: 8px;
}
#custom-filter .wpfFilterContent .wpfCheckboxHier{
    color: #1E1E1E;
}
#custom-filter .wpfFilterWrapper[data-filter-type="wpfPrice"] .wpfFilterContent {
    padding: 20px;
}
#custom-filter .wpfFilterVerScroll li {
    margin-bottom: 8px;
}
#custom-filter .wpfFilterWrapper {
    display: block !important;
    visibility: visible !important;
}
#custom-filter .wpfFilterVerScroll,
#custom-filter .wpfStarsRating {
  padding: 20px 20px 0px 20px;
}
#top-filter .wpfMainWrapper{
	display: flex;
}
#top-filter .wpfFilterWrapper select {
    width: 220px;
    border: 1px solid #DADADA;
    padding: 10px;
    border-radius: 8px;
    height: 48px;
}
#top-filter .wpfSingleInputSearch {
    width: 320px;
    border: 0px solid #DADADA;
    padding: 0px;
    border-radius: 8px;
    height: 48px;
    float: right;
}
#top-filter .wpfSingleInputSearch input.passiveFilter {
    width: 100%;
    margin: 0px 0px;
    box-sizing: border-box;
    padding-right: 0px;
    border-radius: 8px;
    height: 48px;
    border: 1px solid #DADADA;
}

/* ========================================
   Mobile Filter Drawer
   ======================================== */

/* Hidden on desktop */
#elo-mobile-filter-toggle {
	display: none;
}
#elo-mobile-filter-overlay {
	display: none;
}
#elo-mobile-filter-drawer {
	display: none;
}

@media (max-width: 767px) {
	/* Hide filter container visually but keep in DOM so WPF plugin JS
	   can still AJAX-load its filters on production. position:absolute
	   removes it from the Elementor flex flow. */
	#custom-filter {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		overflow: hidden !important;
		clip: rect(0, 0, 0, 0) !important;
		white-space: nowrap !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}

	/* Products column takes full width */
	.elementor-640 .elementor-element.elementor-element-fc56d4f {
		--width: 100% !important;
		width: 100% !important;
		flex: 1 1 100% !important;
		max-width: 100% !important;
	}

	/* Slide-out drawer (appended to body by JS) */
	#elo-mobile-filter-drawer {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 85vw;
		max-width: 360px;
		height: 100vh;
		height: 100dvh;
		z-index: 10002;
		background: #fff;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		transform: translateX(-100%);
		transition: transform 0.3s ease;
		padding-bottom: 80px;
		box-shadow: none;
	}
	#elo-mobile-filter-drawer.elo-filter-open {
		transform: translateX(0);
		box-shadow: 4px 0 20px rgba(0, 0, 0, 0.15);
	}

	/* Force all filter blocks visible inside the drawer */
	#elo-mobile-filter-drawer .wpfFilterWrapper {
		visibility: visible !important;
		display: block !important;
		width: 100% !important;
	}

	/* Sticky filter toggle button */
	#elo-mobile-filter-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		position: fixed;
		bottom: 20px;
		left: 50%;
		transform: translateX(-50%);
		z-index: 9998;
		background: #FF7735;
		color: #1E1E1E;
		font-family: 'Barlow', sans-serif;
		font-weight: 700;
		font-size: 15px;
		padding: 12px 32px;
		border: none;
		border-radius: 40px;
		box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
		cursor: pointer;
		transition: background 0.3s, transform 0.3s;
	}
	#elo-mobile-filter-toggle:active {
		background: #EB601D;
		transform: translateX(-50%) scale(0.96);
	}
	#elo-mobile-filter-toggle i {
		font-size: 14px;
	}

	/* Overlay backdrop */
	#elo-mobile-filter-overlay {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0);
		z-index: 10001;
		pointer-events: none;
		transition: background 0.3s;
	}
	#elo-mobile-filter-overlay.elo-filter-overlay-visible {
		background: rgba(0, 0, 0, 0.5);
		pointer-events: auto;
	}

	/* Close button */
	#elo-mobile-filter-close {
		display: flex;
		align-items: center;
		gap: 6px;
		width: 100%;
		padding: 16px 20px;
		background: #1E1E1E;
		color: #fff;
		font-family: 'Barlow', sans-serif;
		font-weight: 700;
		font-size: 15px;
		border: none;
		cursor: pointer;
		text-align: left;
	}
	#elo-mobile-filter-close i {
		font-size: 16px;
	}

	/* Filter title styling inside drawer */
	#elo-mobile-filter-drawer .wpfFilterWrapper .wpfFilterTitle {
		cursor: pointer;
		background: #000;
		color: #fff;
		padding: 8px 10px 15px 10px;
		font-family: 'Barlow', sans-serif;
		font-weight: 700;
		font-size: 16px;
	}
	#elo-mobile-filter-drawer .wpfFilterVerScroll,
	#elo-mobile-filter-drawer .wpfStarsRating {
		padding: 20px 20px 0 20px;
	}
	#elo-mobile-filter-drawer .wpfFilterVerScroll li {
		margin-bottom: 8px;
	}
	#elo-mobile-filter-drawer .wpfFilterContent .wpfCheckboxHier {
		color: #1E1E1E;
	}
	#elo-mobile-filter-drawer .wpfFilterWrapper[data-filter-type="wpfPrice"] .wpfFilterContent {
		padding: 20px;
	}
	#elo-mobile-filter-drawer .wpfFilterWrapper i,
	#elo-mobile-filter-drawer .wpfFilterWrapper svg {
		float: right;
		top: 8px;
	}
	#elo-mobile-filter-drawer .fa-minus:before {
		content: "\f077";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		margin-right: 10px;
		display: inline-block;
		font-size: 16px;
	}
	#elo-mobile-filter-drawer .fa-plus:before {
		content: "\f078";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		margin-right: 10px;
		display: inline-block;
		font-size: 16px;
	}

	/* Hide toggle when drawer is open */
	body.elo-filter-active #elo-mobile-filter-toggle {
		opacity: 0;
		pointer-events: none;
	}
}

/* ── Shop banner — tablet: fade image so text stays readable ── */
@media (max-width: 1024px) and (min-width: 769px) {
	#shop-top-banner .elementor-element-a4e12a6 {
		opacity: 0.3;
	}
}

/* ── Shop responsive ── */
@media (max-width: 768px) {
	    .woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product {
        width: 100%;
        float: left;
        clear: both;
        margin: 0 0 2.992em;
    }
	#shop-top-banner:before {
		content: "";
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1;
		background: #1E1E1E;
		border-radius: 16px;
		filter: none;
		border: none;
	}
	/* Banner mobile image — properly sized below text */
	#shop-top-banner .elementor-element-b0feb5b {
		z-index: 2 !important;
		margin-top: 10px;
		border-radius: 0 0 16px 16px;
		overflow: hidden;
		opacity: 0.35;
	}
	#shop-top-banner .elementor-element-b0feb5b img {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 0 0 16px 16px;
	}
	/* Heading and description text above image */
	#shop-top-banner .elementor-element-a9d723f,
	#shop-top-banner .elementor-element-4af8647 {
		z-index: 2 !important;
	}
	#top-filter .wpfMainWrapper{
		display: block;
	}
	#top-filter .wpfFilterWrapper select {
		width: 100%;

	}
	#top-filter .wpfSingleInputSearch {
		width: 100%;
	}

}
