/*
 * Grupleo-Farben fuer Material for MkDocs.
 * Quelle der Werte: frontend/src/app/app.css, --primary-color-default.
 *
 * Wichtig: Das Handbuch zeigt bewusst das Grupleo-Standardbranding und nicht die
 * Farben eines einzelnen Mandanten. Mandanten koennen Logo und Akzentfarbe
 * anpassen — ein Screenshot in Vereinsfarben waere fuer alle anderen irrefuehrend.
 */

:root {
  --md-primary-fg-color:        #6200ea;
  --md-primary-fg-color--light: #7c2ff0;
  --md-primary-fg-color--dark:  #4b00b5;
  --md-accent-fg-color:         #6200ea;
}

/* In der dunklen Darstellung hat #6200ea auf dunklem Grund zu wenig Kontrast.
   Links und Akzente laufen deshalb ueber einen aufgehellten Ton. */
[data-md-color-scheme="slate"] {
  --md-typeset-a-color: #b794ff;
  --md-accent-fg-color: #b794ff;
}

/*
 * Rollen-Kennzeichnung am Artikelanfang.
 *
 * Die Navigation ist nach Thema gegliedert, nicht nach Rolle (siehe
 * ENTSCHEIDUNGEN.md, Abschnitt 3 "Zu 6"). Damit trotzdem sofort erkennbar ist,
 * wen ein Artikel betrifft, traegt jede Seite direkt unter der Ueberschrift:
 *
 *     Für Vereins-Admins
 *     { .rolle }
 */
.md-typeset p.rolle {
  display: inline-block;
  margin: -0.4rem 0 1.2rem;
  padding: 0.15rem 0.7rem;
  border-radius: 1rem;
  background: var(--md-primary-fg-color);
  color: #fff;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

[data-md-color-scheme="slate"] .md-typeset p.rolle {
  background: #7c2ff0;
}

/* Screenshots vom Fliesstext abheben, damit die Bildkante erkennbar bleibt —
   die App hat viel Weissraum und wuerde sonst mit der Seite verschwimmen. */
.md-typeset img[src*="bilder/"] {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 4px;
}