/* ============================================================================
   PreloDoc · prelodoc-themen.css
   Zehn Farbschemen, umschaltbar über ein Attribut am <html>-Element.

   ----------------------------------------------------------------------------
   WIE ES FUNKTIONIERT

   Die ganze Anwendung benutzt CSS-Variablen statt fester Hexwerte. Diese
   Datei setzt sie je Schema. Umgeschaltet wird über

       <html data-pd-thema="waldgruen">

   Kein Neuladen von Stylesheets, kein Aufblitzen der alten Farbe: Die Werte
   sind alle schon da, es gilt nur ein anderer Satz.

   ----------------------------------------------------------------------------
   WELCHE VARIABLEN ES GIBT

     --pd-primaer        Hauptfarbe: Überschriften, Knöpfe, Menü
     --pd-primaer-dunkel dieselbe Farbe beim Überfahren und Drücken
     --pd-akzent         Hervorhebung: Abzeichen, Fokusrahmen
     --pd-hell           sehr helle Tönung für Hinweisflächen
     --pd-rand           Rand zu --pd-hell passend
     --pd-warnung        Fehler und Löschen — in JEDEM Schema rot
     --pd-avatar-bg      Kreis mit den Initialen — in JEDEM Schema gleich
     --pd-avatar-fg      Schrift darin — ebenso

   WARUM DIE INITIALEN NICHT MITWANDERN: Der Kreis oben rechts ist die
   Person, nicht die Anwendung. Er soll wiedererkennbar bleiben, egal welches
   Schema gerade gilt — und er ist der einzige Punkt der Oberfläche, an dem
   man sich selbst sieht.

   Deshalb stehen --pd-avatar-bg und --pd-avatar-fg EINMAL hier oben und
   nicht je Schema. Wer ein Schema ergänzt, kann sie gar nicht vergessen.

   WARUM DIE WARNFARBE NICHT MITWANDERT: Rot heißt Gefahr. Ein Schema, in dem
   Löschen grün und Speichern rot wäre, sähe hübsch aus und würde Fehler
   verursachen. Die Warnfarbe bleibt in allen zehn Schemen dieselbe.

   ----------------------------------------------------------------------------
   WIE DIE SCHEMEN GEWÄHLT SIND

   Alle zehn haben denselben Aufbau: eine tiefe, gesättigte Hauptfarbe mit
   genug Abstand zu Weiß, damit Text darauf lesbar bleibt, und einen Akzent,
   der sich davon deutlich unterscheidet.

   Kein Schema ist heller als etwa 45 % Helligkeit in der Hauptfarbe —
   sonst wird weiße Schrift auf Knöpfen unlesbar. Das ist der Grund, warum es
   kein Pastellschema gibt, so hübsch es aussähe.
   ============================================================================ */

/* Gilt fuer ALLE Schemen. Steht ausserhalb der Schema-Bloecke, damit es
   niemand versehentlich ueberschreibt oder beim naechsten Schema vergisst. */
:root {
    --pd-avatar-bg: #F0A500;
    --pd-avatar-fg: #1A4A7A;
}

:root,
:root[data-pd-thema="standard"] {
    /* Standard — das bisherige Blau. Wer nichts wählt, sieht keine Änderung. */
    --pd-primaer:        #1A4A7A;
    --pd-primaer-dunkel: #143A61;
    --pd-akzent:         #F0A500;
    --pd-hell:           #EEF6FF;
    --pd-rand:           #C7DFF7;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="mitternacht"] {
    /* Mitternacht — sehr dunkles Blau, fast schwarz. Ruhig, technisch. */
    --pd-primaer:        #1E293B;
    --pd-primaer-dunkel: #0F172A;
    --pd-akzent:         #38BDF8;
    --pd-hell:           #F1F5F9;
    --pd-rand:           #CBD5E1;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="waldgruen"] {
    /* Waldgrün — gedämpftes Grün, warmer Akzent. */
    --pd-primaer:        #166534;
    --pd-primaer-dunkel: #14532D;
    --pd-akzent:         #F0A500;
    --pd-hell:           #ECFDF3;
    --pd-rand:           #BBE9CC;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="petrol"] {
    /* Petrol — zwischen Blau und Grün, in Ordinationen sehr verbreitet. */
    --pd-primaer:        #0F766E;
    --pd-primaer-dunkel: #115E59;
    --pd-akzent:         #F59E0B;
    --pd-hell:           #E6F5F3;
    --pd-rand:           #B4DED9;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="bordeaux"] {
    /* Bordeaux — ernst und warm. Nicht mit der Warnfarbe zu verwechseln,
       weil deutlich dunkler und weniger gesättigt. */
    --pd-primaer:        #881337;
    --pd-primaer-dunkel: #6B0F2B;
    --pd-akzent:         #F0A500;
    --pd-hell:           #FDF2F5;
    --pd-rand:           #F2CFD9;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="pflaume"] {
    /* Pflaume — Violett, freundlicher als Blau, ohne verspielt zu wirken. */
    --pd-primaer:        #6B21A8;
    --pd-primaer-dunkel: #581C87;
    --pd-akzent:         #F59E0B;
    --pd-hell:           #F7EFFC;
    --pd-rand:           #E0C8F0;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="graphit"] {
    /* Graphit — bewusst farblos. Für alle, denen Farbe egal ist und die
       nur wollen, dass nichts ablenkt. */
    --pd-primaer:        #374151;
    --pd-primaer-dunkel: #1F2937;
    --pd-akzent:         #0891B2;
    --pd-hell:           #F3F4F6;
    --pd-rand:           #D1D5DB;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="kupfer"] {
    /* Kupfer — warmes Braun-Orange. Das einzige Schema mit warmer
       Hauptfarbe; der Akzent geht deshalb ins Kühle. */
    --pd-primaer:        #9A3412;
    --pd-primaer-dunkel: #7C2D12;
    --pd-akzent:         #0E7490;
    --pd-hell:           #FEF3EC;
    --pd-rand:           #F5D3BE;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="marine"] {
    /* Marine — kräftiges Königsblau, deutlich lebendiger als der Standard. */
    --pd-primaer:        #1D4ED8;
    --pd-primaer-dunkel: #1E40AF;
    --pd-akzent:         #F59E0B;
    --pd-hell:           #EEF2FF;
    --pd-rand:           #C7D2FE;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="salbei"] {
    /* Salbei — gedecktes Graugrün, das ruhigste der zehn. */
    --pd-primaer:        #3F6212;
    --pd-primaer-dunkel: #365314;
    --pd-akzent:         #C2410C;
    --pd-hell:           #F3F8E8;
    --pd-rand:           #D5E3B4;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="monochrom"] {
    /* Schwarz-Weiss. Der Akzent ist ein mittleres Grau statt einer Farbe -
       damit bleibt die Anwendung durchgehend unbunt.

       AUSNAHME: --pd-warnung bleibt rot. Wer Schwarz-Weiss waehlt, will keine
       Farbe sehen; wer eine Loeschschaltflaeche in Grau sieht, uebersieht sie. */
    --pd-primaer:        #18181B;
    --pd-primaer-dunkel: #09090B;
    --pd-akzent:         #52525B;
    --pd-hell:           #FAFAFA;
    --pd-rand:           #D4D4D8;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="ozean"] {
    /* Ozean - tiefes Meerblau. Kuehler und gruenstichiger als der Standard. */
    --pd-primaer:        #075985;
    --pd-primaer-dunkel: #0C4A6E;
    --pd-akzent:         #F59E0B;
    --pd-hell:           #E8F4FB;
    --pd-rand:           #B9DDF0;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="indigo"] {
    /* Indigo - zwischen Blau und Violett. Derselbe Ton wie die Gruppe
       Kommunikation in den Einstellungen. */
    --pd-primaer:        #4338CA;
    --pd-primaer-dunkel: #3730A3;
    --pd-akzent:         #F0A500;
    --pd-hell:           #EEEDFC;
    --pd-rand:           #CBC8F5;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="amethyst"] {
    /* Amethyst - sattes Purpur. Deutlich roetlicher und dunkler als Pflaume. */
    --pd-primaer:        #86198F;
    --pd-primaer-dunkel: #701A75;
    --pd-akzent:         #F59E0B;
    --pd-hell:           #FBEDFC;
    --pd-rand:           #EFC9F2;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="espresso"] {
    /* Espresso - dunkles Braun. Der einzige wirklich erdige Ton; der Akzent
       geht ins Kuehle, sonst verschwimmt beides. */
    --pd-primaer:        #4A3728;
    --pd-primaer-dunkel: #3A2B1F;
    --pd-akzent:         #0E7490;
    --pd-hell:           #F7F2ED;
    --pd-rand:           #DFD2C4;
    --pd-warnung:        #D93B3B;
}

:root[data-pd-thema="tanne"] {
    /* Tanne - die dunklere Schwester von Petrol. Wer Petrol mag, aber ruhiger
       will. */
    --pd-primaer:        #134E4A;
    --pd-primaer-dunkel: #0F3D3A;
    --pd-akzent:         #D97706;
    --pd-hell:           #E9F3F2;
    --pd-rand:           #BCDCD8;
    --pd-warnung:        #D93B3B;
}

/* ----------------------------------------------------------------------------
   SVG-SYMBOLE

   In stroke="#1A4A7A" laesst sich keine Variable einsetzen: Browser werten
   var() in Praesentationsattributen nicht zuverlaessig aus.

   Diese Regel faengt die Symbole ab, die auf die Hauptfarbe gesetzt waren.
   Wo currentColor benutzt wird - das ist der Normalfall im Projekt - wandert
   die Farbe ohnehin automatisch mit.
   ---------------------------------------------------------------------------- */
svg[stroke="#1A4A7A"],
svg [stroke="#1A4A7A"] { stroke: var(--pd-primaer); }

svg[fill="#1A4A7A"],
svg [fill="#1A4A7A"] { fill: var(--pd-primaer); }

svg[stroke="#F0A500"],
svg [stroke="#F0A500"] { stroke: var(--pd-akzent); }

svg[fill="#F0A500"],
svg [fill="#F0A500"] { fill: var(--pd-akzent); }
