/* Sharebuttons (rx_shariff) — einfarbige Icons statt Marken-Hintergrundfarben.
   Hintergrund: vendor/reelworx/rx-shariff/Resources/Public/Css/shariff.min.css
   vergibt pro Dienst eine feste Marken-Hintergrundfarbe mit weißem Icon
   (z.B. WhatsApp #5cbe4a), unabhängig vom Dark-/Light-Mode-Toggle dieser
   Seite. Mehrere Kombinationen unterschreiten WCAG 1.4.11 (Kontrast für
   grafische Objekte, ≥3:1) — WhatsApp-Grün gegen Weiß liegt bei nur ~2,35:1
   (per Relativluminanz-Berechnung verifiziert). Da button-style-icon den
   Text ohnehin per text-indent:-9999px versteckt, tragen die Farben nur
   zur (unzuverlässigen) Markenwiedererkennung bei, nicht zur Bedienbarkeit.

   Fix: alle 12 Marken-Hintergründe neutralisiert, Icon-Farbe auf
   var(--text-color) umgestellt — wechselt dadurch automatisch mit dem
   Dark-Mode-Toggle mit (dieselbe Kaskade wie Buchnavigation/Personen-Icons/
   Normdaten-SeeAlso-Buttons, siehe dark-mode.css). !important nötig, da
   shariff.min.css über eigene, gleich oder höher spezifische Selektoren
   (z.B. ".shariff .facebook a", Spezifität 0,2,1) verfügt und je nach
   TypoScript-Ladereihenfolge nach dieser Datei geladen werden kann. */
.shariff li a {
    background-color: transparent !important;
    color: var(--text-color, #1E1815) !important;
}

.shariff li a:hover,
.shariff li a:focus-visible {
    background-color: var(--custom-gray-bg, #f5f6f9) !important;
    color: var(--primary-color, #7A1F2E) !important;
}

/* Zeilenaufteilung 7+5 (2026-08-06, Michaels Vorgabe): ShareButtons.html
   rendert dafür zwei unabhängige <rx:shariff>-Widgets (je ein eigener
   .shariff-Container), gewrappt in je ein .share-buttons-row — siehe
   Begründung im f:comment der Partial-Datei (ein erster Versuch mit einem
   einzigen Widget + CSS-Zeilenumbruch-Trick ließ das erzwungene Element
   seine Zeile allein beanspruchen, statt alle 5 Dienste der zweiten Gruppe
   nebeneinander zu zeigen). Abstand zwischen den beiden Zeilen, analog zum
   margin-bottom, das shariff.min.css bereits zwischen einzelnen Buttons
   innerhalb einer Zeile setzt (siehe .orientation-horizontal li). */
.share-buttons-row:not(:last-child) {
    margin-bottom: 0.5rem;
}