.component-shop-filter-dropdown {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 180px;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-head {
	display: flex;
	color: white;
	align-items: center;
	background: #4A4848;
	border: 1px solid #E2E2E2;
	border-radius: 1.5rem;
	padding: 0.5rem 1rem;
	gap: 0.5rem;
	cursor: pointer;
	justify-content: center;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-head span {
	font-size: 0.7drem;
	color: white;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-head svg {
	width: 1rem;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-body {
	position: absolute;
	display: grid;
	grid-template-rows: 0fr;
	left: 0;
	top: 105%;
	width: 14rem;
	z-index: 5;
	background: white;
	transition: 250ms all ease-in-out;
	border-radius: 1rem;
	overflow: hidden;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-body > div {
	overflow-y: hidden;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-body > div > div{
	border-bottom: 1px solid #E2E2E2;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-item {
	font-size: 0.8rem;
	padding: 0.4rem 1rem;
	line-height: 1.2rem;
	cursor: pointer;
	transition: 250ms all ease;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-item:not(:last-child) {
	border-bottom: 1px solid #E2E2E2;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-item:hover {
	background: #E2E2E2;
}

.component-shop-filter-dropdown.open .component-shop-filter-dropdown-body{
	grid-template-rows: 1fr;
}

.component-shop-filter-dropdown .component-shop-filter-dropdown-item.hide {
	display: none;
}

