
/* CATEGORY THINGS ??? */

#filter-icon svg, #sort-icon svg {
	stroke: none;
	stroke-dasharray: none;
	stroke-linecap: butt;
	stroke-linejoin: miter;
	stroke-miterlimit: 10;
	fill-rule: nonzero;
	opacity: 1;
}

#filter-icon g, #sort-icon g {
	stroke-width: 0; 
	fill: none; 
}

#filter-icon path, #sort-icon path {
	stroke-width: 1; 
	fill: rgb(0,0,0); 
	stroke-linecap: round;
	transform: matrix(1 0 0 1 0 0);
}

.filters, .sort {
	position: absolute;
	width: 100%;
	min-height: 200px;
	background-color: white;
	padding: 1rem;
	top:-50px;
	display: none;
	flex-direction: column;
}

.filter-toggle, .sort-toggle {
	cursor: pointer;
}

.filters input[type="text"], .filters input[type="number"], .input-bordered {
	border: 1px solid rgba(191, 191, 191, 0.3);
	font-size: 14px;
	padding: .5rem;
	background-color: transparent;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type=number] {
	-moz-appearance: textfield;
}

/* PRICE RANGE SLIDER */
.range_container {
	display: flex;
	flex-direction: column;
	width: 80%;
}

.sliders_control {
	position: relative;
	min-height: 50px;
}

.form_control {
	position: relative;
	display: flex;
	justify-content: space-between;
	font-size: 24px;
	color: #635a5a;
	margin-bottom: 1rem;
}

input[type=range]::-webkit-slider-thumb {
	-webkit-appearance: none;
	pointer-events: all;
	width: 16px;
	height: 16px;
	background-color: #a4c0d4;
	border-radius: 50%;
	cursor: pointer;
	border: none;
}

input[type=range]::-moz-range-thumb {
	-webkit-appearance: none;
	pointer-events: all;
	width: 16px;
	height: 16px;
	background-color: #a4c0d4;
	border-radius: 50%;
	cursor: pointer;
	border:none;
}

input[type=range]::-webkit-slider-thumb:hover {
	background: #a4c0d4;
}

input[type="number"] {
	color: #8a8383;
	width: 50px;
	height: 30px;
	font-size: 16px;
	border: none;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	opacity: 1;
}

input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	height: 2px;
	width: 100%;
	position: absolute;
	background-color: hsl(210, 100%, 75%);
	pointer-events: none;
}

#fromSlider {
	height: 0;
	z-index: 1;
}

.all-items {
	max-height: 300px;
	overflow-y: auto;
	margin-top: 1rem;
}

.sort-choices div:hover {
	display: list-item;                                            
	list-style-type: disc;
	list-style-position: inside;
	cursor: pointer;
}

.sort-active {
	display: list-item;
	list-style-type: disc;
	list-style-position: inside;
}

.all-categories-menu {
	overflow-x: auto;
	max-width: 100%;
	cursor: grab;
	scrollbar-width: none; /* For Firefox to hide scrollbar */
	-ms-overflow-style: none; /* For Internet Explorer and Edge to hide scrollbar */
}

.scroll-container::-webkit-scrollbar {
	display: none; /* For Chrome, Safari, and newer versions of Edge */
}

.chosen-products .product-card {
	min-width: 300px;
}

@media only screen and (max-width: 1300px) {
	.chosen-products .product-card {
	    min-width: 230px;
	}
}

@media only screen and (max-width: 1000px) {
	.chosen-products .product-card {
		min-width: 200px;
	}
}

@media only screen and (max-width: 900px) {
	.chosen-products .product-card {
		min-width: 170px;
	}
}

@media only screen and (max-width: 850px) {
	.grid-cols-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.chosen-products .product-card {
		min-width: 340px;
	}
}

@media only screen and (max-width: 700px) {
	.chosen-products .product-card {
		min-width: 250px;
	}
}

@media only screen and (max-width: 600px) {
	.chosen-products {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}
