/* ============================================
   ECX 15 - Basisregeln fuer den Header
   Die zwei Regeln aus 10-base.css, die der Header
   braucht, umgehaengt auf seine eigenen Bausteine.

   NUMMER 15 UND NICHT 30: Diese Datei muss VOR den
   Komponenten (topbar, nav, nav-mobile) geladen
   werden. Sie hat dieselbe Spezifitaet wie deren
   Regeln (beide 0,1,0), waere sie spaeter dran,
   wuerde sie sie ueberschreiben. Als 30er geladen
   hat sie das Polster von .ecx-nav__trigger
   plattgemacht (22px 18px -> 0) und die
   Aufklapp-Punkte aus der Zeile gehoben.
   ============================================ */

/*
 * Der Header laeuft ueber die Klasse .ecx-kopf, die auf JEDER Seite mit
 * ECX-Header steht - auch auf solchen, deren Inhalt noch aus dem
 * Altbestand kommt. Dort darf die Klasse .ecx NICHT gesetzt werden, weil
 * daran die Basisregeln aus 10-base.css haengen und die den Fliesstext
 * alter Seiten umformatieren wuerden.
 *
 * Der Header selbst kommt fast ohne .ecx aus: topbar.css, nav.css und
 * nav-mobile.css arbeiten mit eigenen .ecx-*-Klassen, box-sizing liefert
 * Bootstrap ohnehin site-weit. Gemessen fehlen genau zwei Dinge:
 *
 *   ohne .ecx faerben sich die Topbar-Links blau statt weiss
 *     (rgb(30,115,190) statt rgb(255,255,255))
 *   Lupe und Burger bekommen den GeneratePress-Knopfrahmen
 *     (1px Rand, grauer Grund statt randlos und durchsichtig)
 *
 * Genau diese beiden Regeln stehen hier, gebunden an die Bausteine des
 * Headers statt an den Body. Damit ist der Header vollstaendig, ohne dass
 * irgendetwas ausserhalb von ihm beruehrt wird.
 *
 * :where() haelt die Spezifitaet bei 0,1,0 - genau wie in 10-base.css,
 * damit die Komponentenregeln in topbar.css und nav.css weiterhin
 * gewinnen.
 */

.ecx-topbar :where(a),
.ecx-nav :where(a),
.ecx-panel :where(a) {
  color: inherit;
  text-decoration: none;
}

/*
 * Dasselbe fuer den Hover-Zustand. Begruendung ausfuehrlich in
 * 10-base.css: Bootstrap und GeneratePress setzen ein nacktes
 * a:hover { color: ... } auf 0,1,1, das jede Klassenregel auf 0,1,0
 * schlaegt. Der Header braucht die Gegenregel ein zweites Mal, weil er
 * auf den noch nicht umgebauten Seiten ausserhalb von .ecx steht.
 *
 * Ohne sie faerben sich Topbar-Logo und Panel-Links beim Ueberfahren
 * von Weiss auf #222 - auf dem dunklen Grund unlesbar.
 *
 * Die Socials- und Sprachlinks landen damit beim Ueberfahren auf
 * inherit statt auf ihrem eigenen #fff. Das ist dieselbe Farbe: die
 * Topbar und das Panel vererben Weiss. Wer hier spaeter eine
 * abweichende Farbe setzt, muss sie fuer :hover wiederholen.
 */
.ecx-topbar :where(a):hover, .ecx-topbar :where(a):focus,
.ecx-nav :where(a):hover,    .ecx-nav :where(a):focus,
.ecx-panel :where(a):hover,  .ecx-panel :where(a):focus { color: inherit; }

/* Knoepfe ebenso - button:hover { color: #fff } aus dem
   GeneratePress-Inline-CSS wiegt genauso 0,1,1. Betrifft im Header
   Lupe, Burger und den Schliesser des Menue-Panels. */
.ecx-topbar :where(button):hover, .ecx-topbar :where(button):focus,
.ecx-nav :where(button):hover,    .ecx-nav :where(button):focus,
.ecx-panel :where(button):hover,  .ecx-panel :where(button):focus { color: inherit; }

.ecx-topbar :where(button),
.ecx-nav :where(button),
.ecx-panel :where(button) {
  font-family: inherit;
  cursor: pointer;
  border: 0;
  background: none;
  padding: 0;
  color: inherit;
}
