.base-filter {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.base-filter .filter-header {
	font-weight: 600;
	font-size: 14px;
	line-height: 1.8;
}
.base-filter .filter-footer {
	position: relative;
	background-color: var(--theme-color-background-darker);
	height: 30px;
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: var(--theme-color-background-darker3);
}
.base-filter .filter-footer .card-expand {
	position: absolute;
	right: 2px;
	top: 2px;
	cursor: pointer;
	border-radius: 50%;
	width: 26px;
	height: 26px;
	text-align: center;
	background-color: var(--theme-color-background-brighter2);
	border-style: solid;
	border-width: 1px;
	border-color: var(--theme-color-background-darker2);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.base-filter button.btn {
	border-radius: 3px;
	padding: 2px 10px;
	margin: 1px 3px;
}
.base-filter .badge {
	padding: 0.3em 0.5em;
	font-weight: 600;
	font-size: 0.7rem;
	margin: 2px;
	cursor: help;
}

.base-filter .first-level-tabs,
.base-filter .second-level-tabs {
	margin: 0;
	padding: 0
}

.base-filter .tab {
	cursor: pointer;
	background-color: var(--theme-color-background-brighter2);
	margin: 0;
	padding: 0;
	border-color: var(--theme-color-background-darker2);
	border-width: 1px;
	border-style: solid;
}
.base-filter .tab:hover {
	background-color: var(--list-element-background-light-hover);
	transition: all .5s;
}
.base-filter .tab[data-selected=true] {
	background-color: var(--list-element-background-light-selected);
}
.base-filter .tab .tab-name {
	margin-left: 7px;
	font-size: 0.85rem;
	font-weight: 600;
}

.base-filter .filter-container {
	background-color: var(--theme-color-background-darker);
	display: flex;
	overflow: hidden;
}
.base-filter .filter-container .container-fluid {
	padding: 0 10px 10px 10px;
}
.base-filter .filter-container .searchable {
	background-color: var(--theme-color-background-brighter2);
	border-color: var(--theme-color-background-darker2);
	border-style: solid;
	border-width: 1px;
	border-radius: 7px;
	cursor: pointer;
	padding: 0 10px;
	font-size: 14px;
}
.base-filter .filter-container .searchable:hover {
	background-color: var(--list-element-background-light-hover);
	transition: all .5s;
}
.base-filter .filter-container .searchable span {
	margin-left: 7px;
}

.base-filter .applied-filter {
	background-color: var(--theme-color-background-darker2);
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: var(--theme-color-background-darker3);
}
.base-filter .applied-filter .searchable {
	background-color: var(--theme-color-background-brighter2);
	border-color: var(--theme-color-background-darker);
	border-style: solid;
	border-width: 1px;
	border-radius: 7px;
	cursor: pointer;
	padding: 0 10px;
	font-size: 14px;
}
.base-filter .applied-filter .searchable span {
	margin-left: 7px;
}
.base-filter .applied-filter .searchable:hover {
	background-color: var(--list-element-background-light-deselected);
	transition: all .5s;
}
.base-filter .applied-filter .searchable .close {
	color: inherit;
	margin-left: 3px;
	font-size: smaller;
}
.base-filter .applied-filter .searchable:hover .close {
	color: var(--interaction-option-danger);
	transition: all .5s;
}