:root {
  /* Basisfarben */
  --bd-color: #F5F5F5; /* Grey 100 */
  --ct-color: #FFFFFF; /* White */
  --div-color: #FFFFFF; /* White */
  --blk-color: #000000; /* Black */

  /* Grüntöne der Navigation */
  --bt-color: #66BB6A; /* Material Green 400 */
  --bt-h-color: #81C784; /* Material Green 300 */
  --link-color: #43A047; /* Material Green 600 */
  --link-h-color: #2E7D32; /* Material Green 800 */
  --header-color: #F1F8E9; /* Light Green 50 */
  --green50-color: #E8F5E9; /* Material Green 50 (very light) */
  --bt-f-color: #FFFFFF; /* White */

  /* Weitere Material-Grün-Töne */
  --green100-color: #C8E6C9; /* Material Green 100 */
  --green200-color: #A5D6A7; /* Material Green 200 */
  --green300-color: #81C784; /* Material Green 300 */
  --green400-color: #66BB6A; /* Material Green 400 */
  --green600-color: #43A047; /* Material Green 600 */

  /* Grautöne */
  --alt-div-color: #F5F5F5; /* Grey 100 */
  --alt-div-hover-color: #E0E0E0; /* Grey 300 */
  --grey200-color: #EEEEEE; /* Grey 200 */
  --grey300-color: #E0E0E0; /* Grey 300 */
  --grey50-color: #FAFAFA; /* Grey 50 (very light) */
  --grey400-color: #BDBDBD; /* Grey 400 */
  --grey600-color: #757575; /* Grey 600 */

  /* Akzentfarben */
  --red600-color: #E53935; /* Red 600 */
  --yellow600-color: #FDD835; /* Yellow 600 */
  --lightblue600-color: #039BE5; /* Light Blue 600 */
}

/* ---------- Dark Mode - Akzentfarbe: Material Orange ---------- */
/* Wird per JS gesetzt: html[data-theme="dark"] (Toggle im Header) */
html[data-theme="dark"] {
  /* Basisfarben */
  --bd-color: #121212; /* Material Dark Background */
  --ct-color: #1E1E1E; /* Material Dark Surface */
  --div-color: #1E1E1E;
  --blk-color: #FFFFFF;

  /* Akzent: Orange ersetzt Grün */
  --link-color: #FB8C00; /* Material Orange 600 */
  --link-h-color: #FFB74D; /* Material Orange 400 */
  --header-color: #1E1E1E;
  --green50-color: #2A2118; /* dunkles Warmbraun statt Grün 50 */
  --bt-f-color: #FFFFFF;

  /* Grüntöne bleiben definiert, wirken aber als gedeckte Varianten */
  --bt-color: #FFA726; /* Orange 400 */
  --bt-h-color: #FFB74D;
  --green100-color: #3E2F1C; /* dunkler Warmton (statt Green 100) */
  --green200-color: #5C4526;
  --green300-color: #FFB74D; /* Orange 400 */
  --green400-color: #FFA726; /* Orange 400 */
  --green600-color: #FB8C00; /* Orange 600 */

  /* Grautöne invertiert (dunkel) */
  --alt-div-color: #1E1E1E;
  --alt-div-hover-color: #424242; /* Grey 800 */
  --grey200-color: #303030;
  --grey300-color: #424242;
  --grey50-color: #1A1A1A;
  --grey400-color: #757575; /* Grey 600 */
  --grey600-color: #BDBDBD; /* Grey 400 - heller Text auf dunkel */
}