/* Filter Container */
#cwf-filters {
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-family: 'Arial', sans-serif;
}

/* Style for the toggle headers */
.cwf-toggle-header {
    cursor: pointer;
    padding: 10px;
    background-color: transparent;
    position: relative;
}

.cwf-toggle-header.active {
    background-color: transparent;
}

/* Style for the toggle content */
.cwf-toggle-content {
    display: block;
	padding-left: 20px;
}

/* Loading spinner */
.loading-spinner {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
    margin: 20px auto;
}

.cwf-attribute-box label {
	font-family: 'Nunito Sans' !important;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


@media (max-width: 980px) {
    .cwf-toggle-content {
        display: none; /* Hidden by default on mobile */
    }

    .cwf-toggle-header.active + .cwf-toggle-content {
        display: block; /* Show when the header is active */
    }

    .cwf-toggle-header {
        cursor: pointer;
        padding: 10px;
        position: relative;
    }

    .cwf-toggle-header.active {
        background-color: transparent;
    }
	
	.cwf-attribute-box h4 {
		border: none !important;
		margin-bottom: 0px;
	}
}


/* Individual Attribute Box */
.cwf-attribute-box,
.cwf-price-slider,
.cwf-category-box{
    background: #ffffff;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    width: 100%; /* Set width to 250px */
    margin: auto; /* Center the box */
    margin-bottom: 25px; /* Add bottom margin */
}

#product-grid .product_type_variable {
	display: none !important;
}

.cwf-category-label i {
	position: relative;
    padding-left: 15px;
}

/* Attribute Heading */
.cwf-attribute-box h4 {
    font-size: 16px;
    font-weight: 600;
    color: #555;
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #eee;
}

/* Filter Labels */
.cwf-attribute-box label {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Filter Checkbox */
.cwf-attribute-box input[type="checkbox"] {
    appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid #ccc;
    border-radius: 4px;
    margin-right: 10px;
    transition: all 0.3s ease;
    outline: none;
    position: relative;
}

/* Checked State */
.cwf-attribute-box input[type="checkbox"]:checked {
    background-color: #0073aa;
    border-color: #0073aa;
}

.cwf-attribute-box input[type="checkbox"]:checked::before {
    content: '✓';
    color: white;
    font-size: 14px; /* Font size increased */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cwf-attribute-box input[type="checkbox"]:checked::after {
    display: none !important; /* Hides the default checkmark */
}

/* Hover effect */
.cwf-attribute-box label:hover {
    color: #0073aa;
}

/* Price Range Slider Container */
.cwf-price-slider {
	display: none !important; /* Hidden */
    background: #ffffff;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* Slider Input */
.cwf-price-slider input[type="range"] {
    width: 100%;
    margin: 10px 0;
}

.cwf-subcategories {
	padding-left: 20px;
	font-family: 'Nunito Sans';
}

.cwf-sort-dropdown {
	    display: flex;
    vertical-align: middle;
    justify-content: flex-end;
    align-items: center;
    margin-right: 20px;
	gap:15px;
}

.cwf-sort-dropdown #cwf-sort {
	font-family: 'Nunito Sans';
    color: #000;
    border-color: #B59900 !important;
    font-size: 80%;
    background-color: #fff !important;
    border-radius: 8px !important;
}

.cwf-sort-dropdown label {
	font-family: 'Abhaya Libre', sans-serif !important;
    color: #fff;
    font-size: 125%;
}

/* Slider Value Display */
.cwf-price-slider .slider-values {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #333;
}

.cwf-price-slider h4 {
	margin-bottom: 20px
}

.loading-spinner {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


#product-grid #cwf-filters {
	max-width: 100%;
}

#product-grid .woocommerce .products {
	display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: flex-start;
}

#product-grid .woocommerce ul.products li.product {
	text-align: center;
    flex: 1 1 calc(25% - 20px);
    box-sizing: border-box;
    margin-bottom: 5px;
    list-style-type: none;
	display: flex;
    flex-direction: column;
	padding:20px;
	max-width: calc(25% - 20px);
	justify-content: space-between;
	border-radius: 8px !important;
}

#product-grid .woocommerce ul.products li.product a img,
#product-grid .woocommerce ul.products li.product .button{
	border-radius: 8px !important;
}

input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 10px;
    background: #ddd;
    border-radius: 5px;
    position: relative;
    z-index: 2;
}

input[type="range"]::-webkit-slider-runnable-track {
    height: 10px;
    background: #ddd;
    border-radius: 5px;
}

input[type="range"]::-moz-range-track {
    height: 10px;
    background: #ddd;
    border-radius: 5px;
}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background: #0073e6;
    border-radius: 50%;
    cursor: pointer;
    z-index: 3;
}

input[type="range"]::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: #0073e6;
    border-radius: 50%;
    cursor: pointer;
    z-index: 3;
}

#cwf-filters .subcategories {
	padding-left: 20px;
}

#cwf-filters input[type="checkbox"]:not(:checked) {
	background-color: #fff !important;
}


/* Responsive design */
@media (max-width: 768px) {
    #cwf-filters {
        gap: 15px;
    }

    .cwf-attribute-box {
        padding: 10px;
        border-radius: 5px;
    }

    .cwf-attribute-box h4 {
        font-size: 15px;
    }

    .cwf-attribute-box label {
        font-size: 13px;
		font-family: 'Nunito Sans';
    }

    .cwf-attribute-box input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin-right: 8px;
    }
}

@media only screen and (max-width: 1280px) {
	

#product-grid .woocommerce ul.products li.product {
	text-align: center;
    flex: 1 1 calc(33.33% - 20px);
    box-sizing: border-box;
    margin-bottom: 30px;
    list-style-type: none;
	display: flex;
    flex-direction: column;
	padding:20px;
	max-width: 100%;
	justify-content: space-between;
}
	
	
}

@media only screen and (max-width: 1160px) {
	

#product-grid .woocommerce ul.products li.product {
    text-align: center;
    flex: 1 1 calc(33.33% - 0px);
    box-sizing: border-box;
    margin-bottom: 30px;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    padding: 20px;
    max-width: 310px;
    margin-left: 20px;
	justify-content: space-between;
}
	
	
}

@media only screen and (max-width: 980px) {
	

#product-grid .woocommerce ul.products li.product {
    text-align: center;
    flex: 1 1 calc(33.33% - 0px);
    box-sizing: border-box;
    margin-bottom: 30px;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    padding: 20px;
    max-width: 100%;
    margin-left: 0px;
	justify-content: space-between;
}
	
	#product-grid #cwf-filters {
		margin-top: 40px;
	}
	
}

@media only screen and (max-width: 580px) {
	body #product-grid .woocommerce ul.products li.product {
		flex: 1 1 100%;
		max-width: 300px;
        margin: 10px auto !important;
	}

}