/* Die Marke von SPG-Direkt (ADR 0011, Schrift und Tags seit ADR 0016): Schrift, Farben und Maße, die SPG-Portal, SPG-Verein und spg-direkt.de gemeinsam haben. Eine Datei, kein Inline-Stil: Die Content-Security-Policy (Paket 3-03) soll sie ohne Ausnahme laden.

   Die Werte sind die Variablen von spg-direkt.de (--red, --dark, --text, --muted, --line, --chip, --shadow, --radius). Die Schrift Inter kommt aus einer Datei dieser Anwendung (schriften/),
   nie von Google Fonts: keine fremde Adresse, keine Ausnahme in der Content-Security-Policy. Lizenz der Schrift: schriften/LICENSE-inter-ofl.txt (SIL Open Font License 1.1).

   Geladen wird die Datei von den Masken (Anmeldung, Passwort, zweiter Faktor; Stil.razor) und damit auch von der Verwaltung. Das Portal der Vereine (portal.css) hat sein eigenes Aussehen. */

/* Inter, eine Datei mit veränderlicher Stärke (100 bis 900), Version 4.1 (rsms/inter); der Browser lädt sie, sobald ein Text sie braucht. */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("schriften/inter-variable.woff2") format("woff2");
}

:root {
    /* Das Rot der Marke (spg-direkt.de: #ff1710). Es steht für das Zeichen und für Flächen ohne Text. Für Schrift auf Rot und rote Schrift auf Weiß gilt das Knopf-Rot: etwas dunkler,
       damit weiße Schrift auf Rot (und rote auf Weiß) mindestens 4,5 : 1 erreicht (das Rot der Marke kommt auf 3,9 : 1). */
    --marke-rot: #ff1710;
    --marke-rot-knopf: #e8140e;
    --marke-rot-hover: #bf0f0a;
    --marke-rot-aktiv: #8a0b07;

    --marke-dunkel: #20242b;
    --marke-text: #2d3138;
    --marke-ueberschrift: #353a42;
    --marke-leise: #616973;
    --marke-linie: #e4e7eb;
    --marke-chip: #eef2f7;
    --marke-weiss: #fff;
    --marke-grund: linear-gradient(180deg, #f1f3f6 0%, #f5f6f8 100%);

    --marke-schatten: 0 18px 50px #22283114;
    --marke-schatten-leise: 0 10px 28px #2228310f;
    --marke-radius: 28px;
    --marke-radius-karte: 20px;
    --marke-radius-knopf: 12px;
    --marke-kopf-hoehe: 4.8125rem;

    --marke-schrift: Inter, Arial, Helvetica, sans-serif;

    /* Die Farben der Tags (ADR 0016): kleine Pillen mit einem Wort darin. Fläche und Schrift stehen je Farbe zusammen; jedes Paar erreicht mindestens 4,5 : 1 (TagFarbeStilTests). Gelb trägt dunkle Schrift,
       die anderen weiße. Die Farbe ist ein Hinweis, nie die ganze Aussage: Das Wort steht immer im Tag. Das graue Tag ist kein Teil der Marke, es folgt dem Modus der Verwaltung (--spg-*). */
    --marke-tag-blau: #1b5fd1;
    --marke-tag-blau-schrift: #fff;
    --marke-tag-gelb: #f5b800;
    --marke-tag-gelb-schrift: var(--marke-dunkel);
    --marke-tag-orange: #c4490b;
    --marke-tag-orange-schrift: #fff;
    --marke-tag-gruen: #0b7a5a;
    --marke-tag-gruen-schrift: #fff;
    --marke-tag-violett: #6a3fc0;
    --marke-tag-violett-schrift: #fff;
    --marke-tag-rot: var(--marke-rot-knopf);
    --marke-tag-rot-schrift: #fff;
}