/* tokens.css — die Farb- und Schriftwerte der Marke, an genau einer Stelle.
 *
 * Zwei Flaechen benutzen sie: die Terminverwaltung (.fsbk-app) und der
 * Abschnitt "Deine Anmeldung" in der oeffentlichen Buchungsstrecke
 * (.fsb-self). Deshalb stehen sie in einer eigenen Datei statt zweimal.
 *
 * Es gibt keine Grautoene: gedaempfter Text, Trennlinien und Raender entstehen
 * als Deckkraftstufen von Schwarz. Kein Hex-Wert ausserhalb dieser Liste.
 */

/* ---------------------------------------------------------------- Tokens */
.fsbk-app,
.fsb-self {
  /* Grundfarben */
  --fsb-weiss:      #ffffff;
  --fsb-schwarz:    #130901;
  --fsb-blau:       #0000ff;
  --fsb-blau-60:    #7070ff;
  --fsb-blau-40:    #adadff;
  --fsb-blau-10:    #ebebff;
  --fsb-rot:        #f72e2e;
  --fsb-rot-60:     #f96262;
  --fsb-rosa:       #ffadce;
  --fsb-rot-10:     #ffebf3;
  --fsb-gelb:       #ffff3f;
  --fsb-gelb-40:    #ffffb1;
  --fsb-gelb-20:    #ffffe0;
  --fsb-lime:       #c6f91f;
  --fsb-lime-60:    #d7fb60;
  --fsb-lime-20:    #f0fdc3;

  /* Deckkraftstufen von Schwarz — der Ersatz fuer Grau */
  --fsb-text:       var(--fsb-schwarz);
  --fsb-text-2:     rgba(19, 9, 1, .64);
  --fsb-text-3:     rgba(19, 9, 1, .42);
  --fsb-rand:       rgba(19, 9, 1, .16);
  --fsb-haarlinie:  rgba(19, 9, 1, .09);
  --fsb-punkt-leer: rgba(19, 9, 1, .15);

  /* Auf dunklem Grund */
  --fsb-auf-dunkel-2: rgba(255, 255, 255, .72);
  --fsb-auf-dunkel-3: rgba(255, 255, 255, .6);
  --fsb-rand-hell:    rgba(255, 255, 255, .25);

  /* Schrift */
  --fsb-font:      'Raleway', Inter, Arial, sans-serif;
  --fsb-font-titel:'Bowlby One SC', Anton, Impact, sans-serif;

  /* Kanten */
  --fsb-bedienrand: 1.5px solid var(--fsb-schwarz);
  --fsb-r-klein: 3px;
  --fsb-r-mittel: 5px;
  --fsb-r-gross: 8px;

  --fsb-z-portal: 10000;
}