/**
 * Theme – Quellenverweise
 *
 * Nummerierte Belege für Seiten mit Faktenaussagen (Windkraft, Argumente).
 * Im Fliesstext steht eine hochgestellte Ziffer, die auf den passenden
 * Eintrag der Quellenliste am Seitenende springt; von dort führt ein
 * Rücksprungpfeil zur Textstelle zurück.
 *
 * Markup (von Hand im Editor oder via Inhalt gesetzt):
 *   … Aussage im Text.<sup class="spnkt-quelle-ref"><a id="quelle-ref-1"
 *     href="#quelle-1" aria-describedby="quellen-titel">1</a></sup>
 *
 *   <ol class="spnkt-quellen">
 *     <li id="quelle-1">Titel der Quelle … <a class="spnkt-quellen__zurueck"
 *       href="#quelle-ref-1" aria-label="Zurück zur Textstelle">↩</a></li>
 *   </ol>
 *
 * Barrierefreiheit: Die Ziffer ist ein normaler Link (tastaturbedienbar),
 * `scroll-margin-top` verhindert, dass der Sprungziel-Eintrag unter dem
 * klebenden Header verschwindet. :target hebt den angesprungenen Eintrag
 * kurz hervor – ohne Farbe als einziges Unterscheidungsmerkmal (WCAG 1.4.1),
 * da zusätzlich ein Balken links erscheint.
 */

/* --- Verweis im Fliesstext --- */

.spnkt-quelle-ref {
	font-size: 0.7em;
	line-height: 0;
	/* Direkt am Satzzeichen – kein margin, sonst franst der Text aus. */
	margin-left: 0.1em;
}

.spnkt-quelle-ref a {
	color: var( --wp--preset--color--primary );
	text-decoration: none;
	font-weight: 700;
	/* Trefferfläche vergrössern, ohne den Textfluss zu verschieben: das
	   Padding wird durch negatives margin wieder ausgeglichen (WCAG 2.5.8). */
	padding: 0.5em;
	margin: -0.5em;
}

.spnkt-quelle-ref a:hover,
.spnkt-quelle-ref a:focus-visible {
	text-decoration: underline;
}

/* --- Quellenliste am Seitenende --- */

.spnkt-quellen {
	margin-top: 0.5rem;
	padding-left: 1.5rem;
	font-size: var( --wp--preset--font-size--small );
	line-height: 1.6;
}

.spnkt-quellen li {
	margin-bottom: 0.6rem;
	/* Abstand zum klebenden Header beim Ansprung. */
	scroll-margin-top: 6rem;
	/* Platz für den :target-Balken, damit nichts springt. */
	padding-left: 0.5rem;
	border-left: 3px solid transparent;
}

.spnkt-quellen li:target {
	border-left-color: var( --wp--preset--color--primary );
	background-color: var( --wp--preset--color--light );
}

.spnkt-quellen__zurueck {
	/* Geschütztes Leerzeichen-Verhalten: Der Pfeil bleibt beim letzten Wort
	   und rutscht nicht allein auf eine neue Zeile. */
	display: inline-block;
	margin-left: 0.4em;
	text-decoration: none;
	/* Trefferfläche vergrössern, ohne die Zeilenhöhe zu sprengen. */
	padding: 0.2em 0.35em;
}

.spnkt-quellen__zurueck:hover,
.spnkt-quellen__zurueck:focus-visible {
	text-decoration: underline;
}

/* Sprungziel im Fliesstext ebenfalls freistellen (Rücksprung vom Beleg). */
.spnkt-quelle-ref a:target {
	outline: 2px solid var( --wp--preset--color--primary );
	outline-offset: 2px;
}
