@charset "UTF-8";
/*!
 * ============================================================================
 *  Farben2025.css — Bereinigt & kommentiert von ChatGPT (21.09.2025)
 * ============================================================================
 * Zweck
 *   - Enthält ausschließlich Farbdefinitionen & Farbhintergründe für deine Seiten.
 *   - Keine Layout- oder Typografie-Regeln (die sind in helmich2025.all.css).
 *
 * Struktur
 *   1) Farbvariablen (CSS Custom Properties im :root)
 *   2) Grundelemente & Hintergründe
 *   3) Überschriften, Links, Zitate
 *   4) Code-/Monospace-Farben
 *   5) Bereichs-spezifische Hintergründe (Biologie, Chemie, Informatik, Ernährung)
 *   6) Hervorhebungen, Marker & Kästen
 * ============================================================================
 */

/* ==========================================================================
   1) CSS-Variablen — zentrale Farbtöne
   --------------------------------------------------------------------------
   Alle Hauptfarben sind hier definiert. Bitte bei künftigen Änderungen
   immer diese Variablen anpassen statt harte Werte zu setzen.
   ========================================================================== */
:root{
  --schwarz: rgb(0,0,0);
  --dunkelgrau: rgb(91,91,91);
  --mittelgrau: rgb(191,191,191);
  --hellgrau: rgba(191,191,191,.50);
  --hellgrauBG: rgba(191,191,191,.25);
  --hellgrauer: rgba(223,223,223,1);
  --weissgrau: rgba(239,239,239,1);
  --weiss: rgba(255,255,255,1);

  --hellgrauBlau: rgba(191,191,215,.50);
  --hellgrauBGBlau: rgba(191,191,215,.25);

  --dunkelbraun: rgba(118,51,34,1);
  --braun: rgba(118,51,34,.75);
  --mittelbraun: rgba(118,51,34,.5);
  --hellbraun: rgba(118,51,34,.2);
  --hellbraunBG: rgba(118,51,34,.1);
  --hautfarbe: rgba(218,168,140,.5);
  --hautfarbeBG: rgba(218,168,140,.25);
  --holzfarbe: rgba(245,200,140,.75);

  --schwarzgruen: rgba(0,47,0,1);
  --dunkelgruen: rgba(0,63,0,.8);
  --gruen: rgba(0,100,0,.4);
  --mittelgruen: rgba(0,100,0,.25);
  --hellgruen: rgba(0,100,0,.15);
  --hellgruenAufGrau: rgb(0,255,0);
  --hellgruenBG: rgba(0,100,0,.075);

  --schwarzblau: rgba(0,0,91,1);
  --dunkelblau: rgba(0,0,127,1);
  --blau: rgba(0,0,139,.75);
  --mittelblau: rgba(0,0,139,.5);
  --hellblau: rgba(0,0,139,.1);
  --hellblauBG: rgba(0,0,139,.05);

  --hellviolett: rgba(100,0,139,.2);
  --dunkelviolett: rgba(100,0,139,1);

  --schwarzrot: rgba(91,0,0,1);
  --dunkelrot: rgba(162,79,47,.8);
  --rot: rgba(162,79,47,.5);
  --mittelrot: rgba(255,79,47,.1);
  --hellrot: rgba(255,79,47,.05);
  --hellrotBG: rgba(255,79,47,.03);

  --definition: rgba(255,191,191,.5);

  --gelb: rgba(223,223,0,.7);
  --mittelgelb: rgba(223,223,0,.4);
  --hellgelb: rgba(255,249,204,1);
  --hellbeige: rgba(255,244,224,1);

  --hellgrauorange: rgba(191,175,159,.125);
}

/* ==========================================================================
   2) Grundelemente & Hintergründe
   ========================================================================== */
iframe{ background-color: var(--hellgruen); border: none; }
body{ background-image: url(ringbuch-1.jpg); }
main, #main{ background-color: var(--weiss); }
header p, .weiter{ background-color: rgba(255,255,191,.5); }
header h2{ color: #fff; }

/* ==========================================================================
   3) Überschriften, Links, Zitate
   ========================================================================== */
h1{ color: var(--schwarz); }
h2{ color: var(--schwarz); }
h3{ color: var(--braun); }
h4{ color: var(--schwarz); }
h5, .gross, big{ color: var(--dunkelgruen); }
.formel{ color: var(--dunkelblau); }
h6{ color: var(--braun); }

a{ color: var(--dunkelgruen); }
a:hover{ color: var(--braun); }
cite{ color: darkslategray; }

/* ==========================================================================
   4) Code-/Monospace-Farben
   ========================================================================== */
samp{ color: var(--dunkelgruen); background-color: var(--hellgruen); }

/* Code-Farben im Informatik-Bereich konsistent halten */
section.informatikBG pre,
section.informatikBG code {
  color: var(--dunkelblau);
  background-color: var(--hellblauBG);
}

/* Generell: Code immer dunkelblau – falls ältere Regeln existieren */
main pre,
main code {
  color: var(--dunkelblau);
}



kbd{ color: var(--schwarz); background-color: var(--hellgrau); }
section .breitbild{ background-color: var(--weiss); }

/* ==========================================================================
   5) Bereichs-spezifische Hintergründe
   ========================================================================== */
/* Biologie */
.biologie{ background-color: var(--mittelgruen); }
.biologieBG{ background-color: var(--weiss); }

/* Chemie */
.chemie, .organik{ background-color: var(--mittelrot); }
.chemieBG{ background-color: var(--weiss); }
.chemieQuer{ background-color: var(--rot); }

/* Informatik */
.informatik{ background-color: var(--hellblau); }
.informatikBG{ background-color: var(--hellblauBG); }
.quelltext{ color: var(--dunkelblau); }

/* Ernährung */
.helmichBraun{ background-color: var(--mittelrot); }
.helmichHaut{ background-color: var(--hautfarbe); }
.ernaehrung{ background-color: var(--gelb); }
.ernaehrungBG{ background-color: var(--weiss); }

/* Medizin */
.medizinBG{ background-color: rgba(255,191,255,.5); }

/* ==========================================================================
   6) Hervorhebungen, Marker & Kästen
   ========================================================================== */
/* Kontextabhängige Fachbegriffe 
section.biologieBG   .fachbegriff{ color:#065F46; }
section.chemieBG     .fachbegriff{ color:#7F1D1D; }
section.informatikBG .fachbegriff{ color:#1E3A8A; }
section.ernaehrungBG .fachbegriff{ color:#996515; }
*/


/* Allgemeine Textfarben */
.farbeRot{ color: var(--dunkelrot); }
.farbeDunkelrot{ color: var(--schwarzrot); }
.farbeBlau{ color: var(--blau); }
.farbeDunkelblau{ color: var(--dunkelblau); }
.farbeGruen{ color: var(--dunkelgruen); }
.farbeHellgruen{ color: var(--hellgruenAufGrau); }
.farbeGrau{ color: var(--dunkelgrau); }
.farbeWeiss{ color: var(--weiss); }

/* Textmarker */
.pastellGelb{ background-color: rgba(255,255,0,.2); }
.textmarkerGelb{ background-color: rgba(255,255,0,.7); }
.pastellGruen{ background-color: rgba(234,248,228,1); }
.textmarkerGruen{ background-color: rgba(0,255,0,.7); }
.pastellRot{ background-color: rgba(255,159,159,.2); }
.textmarkerRot{ background-color: rgba(255,159,159,.6); }
.pastellBlau{ background-color: rgba(159,159,255,.2); }
.textmarkerBlau{ background-color: rgba(159,159,255,.6); }
.pastellGrau{ background-color: rgba(191,191,191,.3); }
.textmarkerGrau{ background-color: rgba(191,191,191,1); }
.pastellViolett{ background-color: orchid; }
.textmarkerOrange{ background-color: var(--mittelbraun); color: beige; }

/* Textkästen (Farben via Variablen) */
.anweisung, .anfaenger, .didaktik, .merktext{
  background-color:#EAF8E4; border-color: var(--dunkelgruen);
}
.merktext .titel, .anweisung .titel{ color: var(--dunkelgruen); }
.kasten{ border-color: var(--dunkelblau); }
.kastenMed{ background-color: thistle; border-color: var(--dunkelrot); }
.versuch{ background-color: var(--hellblau); border-color: var(--dunkelblau); }
.aufgabe{ background-color:#D9EDFF; border-color:#2D2D2D; color:#2D2D2D; }
.versuch .titel, .kasten .titel{ color: var(--dunkelblau); }
.aufgabe .titel, .aufgabe p{ color:#2D2D2D; }

/* Auskommentiert am 20.09.2025 
   --------------------------------------
.verbindung, .verbindung a{ color: var(--dunkelblau); }
.enzym, .enzym a{ color: firebrick; }
.coenzym, .coenzym a{ color: blueviolet; }
.stoffgruppe, .stoffgruppe a,
.klasse, .klasse a,
.taxon, .taxon a{ color: sienna; }
.methode{ color: blue; }
.objekt{ color: firebrick; }
.variable, .parameter{ color: darkslateblue; }
.konstante{ color: darkorchid; }
.datentyp{ color: indigo; }
------------------------------------------ */

section.chemieBG     .stoffgruppe, .stoffgruppe a,
section.chemieBG     .verbindung,  .verbindung a,
section.chemieBG     .enzym,       .enzym a,
section.chemieBG     .coenzym      .coenzyn a { color:#7F1D1D; }


section.biologieBG     .stoffgruppe, .stoffgruppe a,
section.biologieBG     .verbindung,  .verbindung a,
section.biologieBG     .enzym,       .enzym a,
section.biologieBG     .klasse,      .klasse a,
section.biologieBG     .taxon,       .taxon a,
section.biologieBG     .coenzym      .coenzym a { color:#065F46; }


section.ernaehrungBG     .stoffgruppe,.stoffgruppe a,
section.ernaehrungBG     .verbindung, .verbindung a,
section.ernaehrungBG     .enzym,      .enzym a,
section.ernaehrungBG     .coenzym     .coenzym a { color:#996515; }


section.informatikBG     .klasse,
section.informatikBG     .objekt,
section.informatikBG     .methode,
section.informatikBG     .variable,
section.informatikBG     .parameter,
section.informatikBG     .konstante,
section.informatikBG     .datentyp,
section.informatikBG     .parameter {color: #1E3A8A;}

section.informatikBG     .klasse a,
section.informatikBG     .objekt a,
section.informatikBG     .methode a,
section.informatikBG     .variable a,
section.informatikBG     .parameter a,
section.informatikBG     .konstante a,
section.informatikBG     .datentyp a,
section.informatikBG     .parameter a {color: #1E3A8A;}

.fachbegriff, .fachbegriff a {color: black;}






/* Definitionen */
.definition{ background-color: var(--definition); border-color: var(--dunkelrot); }
.definition .titel{ color: var(--dunkelrot); }

/* Experten & Lösungen */
.experten{ color: var(--schwarz); background-color: var(--mittelgelb); border-color: var(--dunkelbraun); }
.experten .titel{ color: var(--dunkelbraun); }
.loesung{ color: var(--schwarz); background-color: var(--hellblauBG); border-color: var(--dunkelgruen); }
.loesung .titel{ color: var(--dunkelgruen); }

/* Footer Dark Theme */
.footerDark{ background-color: var(--dunkelgrau); color: var(--weiss); }
.footerDark a{ color: var(--weiss); }
.footerDark p{ color: var(--mittelgrau); }