/**
 * FAQ Filter Dropdown
 *
 * Hides the native Elementor Taxonomy Filter button row inside
 * .faq-container ONLY after JS has successfully built and inserted the
 * dropdown (see js/faq-filter-dropdown.js, which adds
 * .has-dropdown-filter to .faq-container once ready). If that class is
 * never added, the native buttons stay visible and fully functional.
 */

.faq-container.has-dropdown-filter search.e-filter {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.faq-container .expoxr-faq-filter-select-wrapper {
	margin-bottom: 1.5rem;
}

.faq-container .expoxr-faq-filter-select-wrapper__label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.faq-container .expoxr-faq-filter-select {
	display: block;
	width: 100%;
	font-size: 1rem;
	line-height: 1.4;
	color: inherit;
	background-color: #fff;
	border: 1px solid var(--e-global-color-primary);
	border-radius: 6px;
	cursor: pointer;
}

.faq-container .expoxr-faq-filter-select:focus {
	outline: 2px solid var(--e-global-color-primary);
	outline-offset: 2px;
}

/* Child kategorien are already dash-prefixed in the option text (see
   js/faq-filter-dropdown.js); this indent is a best-effort visual aid on
   browsers that honor padding on <option> — not load-bearing. */
.faq-container .expoxr-faq-filter-select option[value] {
	padding-left: 0.5rem;
}

@media (max-width: 767px) {
	.faq-container .expoxr-faq-filter-select {
		max-width: 100%;
	}
}