.order,
.multiselect {
cursor:				pointer;
position:			relative;
height:				40px;
display:			-webkit-box;
display:			-ms-flexbox;
display:			flex;
-webkit-box-align:		center;
-ms-flex-align:			center;
align-items:			center;
font-size:			14px;
font-weight:			500;
padding:			6px 25px 6px 13px;
border:				solid 1px #e9ecef;
border-radius:			4px;
background-color:		#fff;
outline:			none;
-webkit-transition:		all 0.3s ease;
transition:			all 0.3s ease;
box-sizing:			border-box;
width:				calc(40% - 10px);
margin-right:			6px;
}
.order:after,
.multiselect:after {
content:			'\f347';
font-family:			dashicons;
position:			absolute;
top:				13px;
right:				9px;
font-size:			12px;
line-height:			1;
transition:			transform 0.3s ease ,-webkit-transform 0.3s ease;
color:				#616a78;
}
.order.active:after,
.multiselect.active:after {
-webkit-transform:		rotate(180deg);
transform:			rotate(180deg);
}
.order:hover,
.multiselect:hover {
border-color:			#cdd4d9;
} .order .caret,
.multiselect .caret {
position:			absolute;
top:				0;
left:				0;
width:				100%;
height:				100%;
z-index:			1;
box-sizing:			border-box;
}
.order .tags,
.multiselect .tags {
max-width:			100%;
overflow:			hidden;
text-overflow:			ellipsis;
}
.order .tags span:first-of-type {
margin-left:			5px;
margin-right:			5px;
}
.order .content,
.multiselect .content {
max-height:			300px;
background-color:		#fff;
box-shadow:			0px 4px 16px 0px rgba(0,0,0,0.15);
position:			absolute;
top:				100%;
left:				0;
z-index:			2;
min-width:			176px;
width:				fit-content;
max-width:			100%;
display:			-webkit-box;
display:			-ms-flexbox;
display:			flex;
-webkit-box-orient:		vertical;
-webkit-box-direction:		normal;
-ms-flex-direction:		column;
flex-direction:			column;
padding:			0;
margin-top:			10px;
border:				solid 1px #e9ecef;
border-radius:			2px;
display:			inline-block;
transition:			grow 1s ease 0.1s;
overflow-y:			auto;
overflow-x:			hidden;
scrollbar-width:		thin;
scrollbar-color:		#616a78 #e9ecef;
}
@keyframes grow {
0% {
display:		inline-block;
}
1% {
height:			0px;
}
100% {
height:			100%;
}
}
.order:not(.active) .content,
.multiselect:not(.active) .content {
display:			none;
transition:			shrink 1s ease 0.1s;
}
@keyframes shrink {
0% {
display:		inline-block;
}
1% {
height:			100%;
}
99% {
height:			0px;
}
100% {
display:		none;
}
}
.order .content:after,
.multiselect .content:after {
content:			'';
position:			absolute;
top:				-9px;
left:				20px;
z-index:			1;
width:				0;
height:				0;
border-left:			9px solid transparent;
border-right:			9px solid transparent;
border-bottom:			10px solid #fff;
}
.order .content:before,
.multiselect .content:before {
border-bottom:			10px solid #e9ecef;
top:				-10px;
}
.order .content ul,
.multiselect .content ul {
z-index:			2;
width:				100%;
height:				100%;
padding:			10px 0;
margin:				0;
border-radius:			2px;
list-style:			none;
display:			inline-block;
}
.order .content ul::-webkit-scrollbar,
.multiselect .content ul::-webkit-scrollbar {
width:				8px;
}
.order .content ul::-webkit-scrollbar-track,
.multiselect .content ul::-webkit-scrollbar-track {
background-color:		#e9ecef;
}
.order .content ul::-webkit-scrollbar-thumb,
.multiselect .content ul::-webkit-scrollbar-thumb {
background-color:		#e9ecef;
border-radius:			20px;
border:				2px solid #e9ecef;
}
.order .content > ul,
.multiselect .content > ul {
white-space:			nowrap;
}
.order .content > ul:hover,
.multiselect .content > ul:hover {
cursor:				pointer;
}
.order .content > ul > li {
padding-left:			10px;
padding-top:			10px;
height:				40px;
}
.multiselect .content > ul > li {
margin-left:			10px;
margin-top:			10px;
}
.multiselect .content > ul > li.disabled {
opacity:			0.3;
}
.multiselect .content > ul > li:not(.sub) {
font-weight:			bold;
}
.multiselect .content > ul > li.sub {
margin-left:			20px;
}
.multiselect .content > ul > li > span {
display:			inline-block;
width:				100%;
padding-left:			5px;
}
.order .content > ul > li:hover {
background-color:		#b0b0b099;
}
div.order .content > ul > li.selected {
background-color:		#e9ecef;
}
.order .content > ul > li > span {
display:			inline-block;
height:				32px;
width:				32px;
}
.order .content > ul > li > span:first-of-type {
margin-left:			5px;
margin-right:			15px;
}
.order .content > ul > li > span:last-of-type {
margin-right:			5px;
}
.order.enter-active,
.order.leave-active,
.multiselect.enter-active,
.multiselect.leave-active {
-webkit-transition:			opacity 0.3s ease-out;
transition:				 opacity 0.3s ease-out;
}
.sorting-select-inner {
width:				100%;
overflow:			hidden;
white-space:			nowrap;
text-overflow:			ellipsis;
}
.filter-tags {
display:			flex;
flex-flow:			wrap;
gap:				12px;
width:				100%;
margin-bottom:			5px;
}
.filter-tags span {
background-color:		#e9ecef;
color:				black;
border-radius:			4px;
padding:			2px 5px;
margin-left:			5px;
margin-top:			5px;
}
.filter-tags span:not(.active):not(.reset) {
display:			none;
}
.filter-tags span:not(.reset):after {
content:			'x';
padding-left:			4px;
padding-right:			4px;
cursor:				pointer;
}
.filter-tags span:hover:after {
color:				#0004;
}
.filter-tags span.reset {
background-color:		transparent;
color:				#616a78;
text-decoration:		underline dashed;
cursor:				pointer;
}
.filter-tags span.reset.hidden,
.filter-tags span:first-of-type.reset {
display:			none;
}