/*
 * back-to-top.css — die Schaltfläche „Nach oben" (Arbeitsschritt 13, E11).
 *
 * Gemessen am Bestand: `#return-to-top` in migration/bestand/assets/merged.css, das Verhalten
 * in map.js. Übernommen ist das Erscheinungsbild, nicht das Markup — die Begründung steht in
 * E11 und in inc/back-to-top.php.
 *
 * Diese Datei lädt auf **jeder** Seite, anders als post.css, archive.css und 404.css. Das ist
 * kein Versehen: die Schaltfläche steht im Bestand auf jeder Seite, und eine Bedingung, die
 * „überall" heißt, ist keine.
 */

.wi-to-top {
  position: fixed;
  bottom: var(--wi-to-top-bottom);
  right: var(--wi-to-top-right);
  z-index: var(--wi-to-top-z);

  display: flex;
  align-items: center;
  justify-content: center;

  width: var(--wi-to-top-size);
  height: var(--wi-to-top-size);
  padding: 0;

  color: var(--wi-color-on-dark);
  background-color: var(--wi-color-accent-hover);
  border: 0;
  border-radius: var(--wi-radius);
  cursor: pointer;

  /*
   * Der Grundzustand ist unsichtbar — und zwar so, dass die Schaltfläche dabei weder
   * anklickbar noch mit dem Tabulator erreichbar ist. `opacity` allein täte das nicht: eine
   * durchsichtige Schaltfläche bleibt eine Schaltfläche und fängt Klicks ab, die dem Inhalt
   * darunter gelten. `visibility` nimmt sie aus beidem heraus und lässt sich trotzdem
   * überblenden, was `display: none` nicht kann.
   *
   * Ohne JavaScript bleibt es bei diesem Zustand. Das ist Absicht (E11): die Schaltfläche ist
   * eine Bequemlichkeit, kein Zugang zu einem Inhalt.
   */
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--wi-to-top-fade) ease, visibility var(--wi-to-top-fade) ease;
}

.wi-to-top.is-visible {
  opacity: 1;
  visibility: visible;
}

/*
 * Kein Hover-Wechsel: der Bestand hat keinen, und die Fläche trägt bereits die Hover-Farbe des
 * Menüs. Der Fokusring dagegen muss sein — er ist der einzige sichtbare Hinweis darauf, wo die
 * Tastatur gerade steht, und Divi setzt `outline: none` auf Schaltflächen.
 */
.wi-to-top:focus-visible {
  outline: var(--wi-border-width-button) solid var(--wi-color-ink);
  outline-offset: var(--wi-border-width-button);
}

.wi-to-top__chevron {
  display: block;
  width: var(--wi-to-top-icon);
  height: var(--wi-to-top-icon);
}

/*
 * Wer Bewegung abbestellt hat, bekommt keine. Den Bildlauf selbst regelt back-to-top.js — das
 * hier ist das Überblenden.
 */
@media (prefers-reduced-motion: reduce) {
  .wi-to-top {
    transition: none;
  }
}

/*
 * Der Hebel für die Kartenseite (E11, Auflage).
 *
 * Der Bestand blendet die Schaltfläche dort aus (`body.map-page #return-to-top { display: none
 * !important }`): auf der Karte scrollt nicht die Seite, sondern die Karte, und die Fläche
 * unten rechts gehört dem Kartenwerkzeug. Die Seite gibt es hier noch nicht — sie entsteht im
 * Plan `wildisland-map-plugin`. Das Child-Theme stellt deshalb nur den Hebel bereit: das
 * Plugin hängt `wi-no-to-top` an die Körperklassen (`body_class`), und die Schaltfläche ist
 * weg.
 *
 * `!important` ist hier begründet und nicht bequem: die Regel muss gegen `.is-visible`
 * gewinnen, das JavaScript jederzeit wieder setzen kann.
 */
body.wi-no-to-top .wi-to-top {
  display: none !important;
}