.mf-faq {
	--mf-faq-border: #e2e4e7;
	--mf-faq-text: inherit;
	--mf-faq-question-size: 1.6rem;
	--mf-faq-line-height: 1.3;
	display: flex;
	flex-direction: column;
}

.mf-faq-item {
	border-bottom: 1px solid var(--mf-faq-border);
}

.mf-faq-item:first-child {
	border-top: 1px solid var(--mf-faq-border);
}

/* !important nötig: Theme-Regeln wie ".single-content h3 { margin: 1.5em 0 .5em }"
   haben durch die zusätzliche Klasse höhere Spezifität als ".mf-faq-question"
   allein und würden unser margin sonst überschreiben – das war die Ursache
   für die ungleichen Abstände (1.5em oben / .5em unten statt symmetrisch). */
.mf-faq-question {
	margin: .1em 0 !important;
}

/* "all: unset" kappt alle vom Theme geerbten Button-Styles (uppercase,
   letter-spacing, border, padding, box-shadow) sauber, statt sie einzeln
   gegen ggf. spezifischere Theme-Regeln auszuhebeln. Danach bauen wir
   gezielt neu auf, was wir wirklich brauchen. font-size in rem, nicht em,
   damit die Größe unabhängig von geerbten Theme-Überschriftengrößen bleibt. */
.mf-faq .mf-faq-toggle {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	width: 100%;
	cursor: pointer;
	padding: 1rem 0;
	font-size: var(--mf-faq-question-size);
	font-weight: bold;
	line-height: var(--mf-faq-line-height);
	color: var(--mf-faq-text);
	text-transform: none;
	letter-spacing: normal;
}

.mf-faq .mf-faq-toggle:hover,
.mf-faq .mf-faq-toggle:focus {
	opacity: 0.6;
}

.mf-faq-toggle::after {
	content: "+";
	flex-shrink: 0;
	line-height: var(--mf-faq-line-height);
}

.mf-faq-item.is-open .mf-faq-toggle::after {
	content: "\2212"; /* Minuszeichen */
}

/* Antwort-Text bewusst OHNE eigene font-size: übernimmt die normale
   Fließtext-Größe der Seite (body/p), statt einen eigenen Wert zu erzwingen. */
.mf-faq-answer {
	padding: 0 0 1rem;
	color: var(--mf-faq-text);
}

.mf-faq-answer p {
	margin: 0 0 1em;
}

.mf-faq-answer p:last-child {
	margin-bottom: 0;
}

.mf-faq-answer ul {
	margin: 0 0 1em;
	padding-left: 1.25em;
}

.mf-faq-answer ul:last-child {
	margin-bottom: 0;
}

.mf-faq-answer li {
	margin: 0 0 0.25em;
}

.mf-faq-answer[hidden] {
	display: none;
}
