/**
 * Häufige Fragen auf Kategorieseiten - zum Auf- und Zuklappen.
 *
 * Das Markup baut das Plugin beim Ausliefern (`Category_Faq_Render`):
 * je Frage ein `<details>` mit `<summary>`. Aufgeklappt wird ohne Skript; der
 * Browser kann es von selbst, und die Antworten stehen im Quelltext - für
 * Suchmaschinen wie für Besucher ohne JavaScript.
 *
 * Eine eigene Datei, weil `style.css` an ihrer Zeilengrenze steht. Geladen nur
 * auf Kategorieseiten (`inc/assets.php`).
 */

.nexlas-faq {
	margin: 0.5rem 0 1.25rem;
	border-top: 1px solid var(--nx-line);
}

.nexlas-faq__item {
	border-bottom: 1px solid var(--nx-line);
}

.nexlas-faq__item > summary {
	position: relative;
	padding: 0.85rem 2.25rem 0.85rem 0;
	font-weight: 600;
	color: var(--nx-ink);
	cursor: pointer;
	list-style: none;
}

.nexlas-faq__item > summary::-webkit-details-marker {
	display: none;
}

/* Plus und Minus statt des Dreiecks - eindeutig auf jedem Bildschirm. */
.nexlas-faq__item > summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 0.35rem;
	transform: translateY(-50%);
	font-size: 1.3rem;
	font-weight: 400;
	line-height: 1;
	color: var(--nx-green-dark);
}

.nexlas-faq__item[open] > summary::after {
	content: "\2013";
}

.nexlas-faq__item > summary:hover {
	color: var(--nx-green-dark);
}

.nexlas-faq__item > summary:focus-visible {
	outline: 2px solid var(--nx-green);
	outline-offset: 2px;
	border-radius: var(--nx-radius-sm);
}

/*
 * Geschlossen heisst unsichtbar - ausdrücklich. Chrome blendet den Inhalt
 * eines geschlossenen `<details>` über `content-visibility` aus; eine
 * Ganzseiten-Aufnahme zeigte die Antworten trotzdem, über der nächsten Frage.
 */
.nexlas-faq__item:not([open]) > p {
	display: none;
}

.nexlas-faq__item > p {
	margin: 0 0 1rem;
	color: var(--nx-ink);
	line-height: 1.6;
}