:root {
  /* Basis-Farbpalette von hell nach dunkel */
  --blau-50:  #CCE0EF;
  --blau-100: #99C1DF;
  --blau-200: #66A2CF;
  --blau-300: #3383BF;
  --blau-400: #0064A0;
  --blau-500: #004B80;

  /* Textfarben */
  --text-auf-hell:  #003355;  /* dunkles Blau für Text auf hellen Flächen */
  --text-auf-dunkel: #f7f7f7; /* Weiß für Text auf dunklem Hintergrund */

  /* Hover-Farben */
  --hover-blau-hell:   #B3D3EA; /* helleres Blau für Hover auf hellen Buttons */
  --hover-blau-dunkel: #005C99; /* stärkeres Blau für Hover auf dunklen Buttons */

  /* Rahmen-/Linienfarben */
  --rahmen-blau: #99C1DF;

  /* Akzent / Fokusfarbe */
  --fokus-blau:  #66A2CF;

  /* Background hell */
  --background-hell:  #F7F7F7;

  /* Basis-Farbpalette Rot von hell nach dunkel */
  --rot-50:  #FDE2E1;
  --rot-100: #F9B8B7;
  --rot-200: #F48D8C;
  --rot-300: #F06260;
  --rot-400: #EC3735;
  --rot-500: #C22020;

  /* Textfarben für Rot */
  --text-rot-auf-hell:  #7A0E0E;
  --text-rot-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Rot */
  --hover-rot-hell:   #FAB1B0;
  --hover-rot-dunkel: #B31B1B;

  /* Rahmen-/Linienfarbe für Rot */
  --rahmen-rot: #F48D8C;

  /* Akzent / Fokusfarbe für Rot */
  --fokus-rot:  #EC3735;

  /* Hintergrundfarbe hell für Rotthemen */
  --background-rot-hell:  #FFF5F5;

  /* Basis-Farbpalette Grün von hell nach dunkel */
  --gruen-50:  #E0F5E9;
  --gruen-100: #B8E4C8;
  --gruen-200: #8FD3A8;
  --gruen-300: #66C287;
  --gruen-400: #3DB167;
  --gruen-500: #23994E;

  /* Textfarben für Grün */
  --text-gruen-auf-hell:  #1F5134;
  --text-gruen-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Grün */
  --hover-gruen-hell:   #B2E8C3;
  --hover-gruen-dunkel: #1C7A3D;

  /* Rahmen-/Linienfarbe für Grün */
  --rahmen-gruen: #8FD3A8;

  /* Akzent / Fokusfarbe für Grün */
  --fokus-gruen:  #3DB167;

  /* Hintergrundfarbe hell für Grünthemen */
  --background-gruen-hell:  #F3FBF6;

  /* Basis-Farbpalette Gelb von hell nach dunkel */
  --gelb-50:  #FFF9E0;
  --gelb-100: #FFF1B3;
  --gelb-200: #FFE985;
  --gelb-300: #FFE057;
  --gelb-400: #FFD829;
  --gelb-500: #E6BF00;

  /* Textfarben für Gelb */
  --text-gelb-auf-hell:  #665200;
  --text-gelb-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Gelb */
  --hover-gelb-hell:   #FFF2A6;
  --hover-gelb-dunkel: #CCAA00;

  /* Rahmen-/Linienfarbe für Gelb */
  --rahmen-gelb: #FFE985;

  /* Akzent / Fokusfarbe für Gelb */
  --fokus-gelb:  #FFD829;

  /* Hintergrundfarbe hell für Gelbthemen */
  --background-gelb-hell:  #FFFAE6;
  /* Basis-Farbpalette Grau von hell nach dunkel */
  --grau-50:  #F5F5F5;
  --grau-100: #E0E0E0;
  --grau-200: #CCCCCC;
  --grau-300: #B3B3B3;
  --grau-400: #999999;
  --grau-500: #666666;

  /* Textfarben für Grau */
  --text-grau-auf-hell:  #333333;
  --text-grau-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Grau */
  --hover-grau-hell:   #DDDDDD;
  --hover-grau-dunkel: #555555;

  /* Rahmen-/Linienfarbe für Grau */
  --rahmen-grau: #CCCCCC;

  /* Akzent / Fokusfarbe für Grau */
  --fokus-grau:  #999999;

  /* Hintergrundfarbe hell für Grautöne */
  --background-grau-hell:  #FAFAFA;

  /* Basis-Farbpalette Violett von hell nach dunkel */
  --violett-50:  #E4DDE9;
  --violett-100: #C1B1CD;
  --violett-200: #9D84B0;
  --violett-300: #7A5793;
  --violett-400: #4D1F6F;
  --violett-500: #3A1753;

  /* Textfarben für Violett */
  --text-violett-auf-hell:  #2B1042;
  --text-violett-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Violett */
  --hover-violett-hell:   #CBB8DB;
  --hover-violett-dunkel: #3F1B58;

  /* Rahmen-/Linienfarbe für Violett */
  --rahmen-violett: #9D84B0;

  /* Akzent / Fokusfarbe für Violett */
  --fokus-violett:  #7A5793;

  /* Hintergrundfarbe hell für Violettthemen */
  --background-violett-hell:  #F1EAF5;

  /* Basis-Farbpalette Bernstein von hell nach dunkel */
  --bernstein-50:  #F9E8DD;
  --bernstein-100: #F1C8B1;
  --bernstein-200: #E8A984;
  --bernstein-300: #E08A57;
  --bernstein-400: #D6631F;
  --bernstein-500: #A04A17;

  /* Textfarben für Bernstein */
  --text-bernstein-auf-hell:  #6A2B0D;
  --text-bernstein-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Bernstein */
  --hover-bernstein-hell:   #F0B88C;
  --hover-bernstein-dunkel: #B75315;

  /* Rahmen-/Linienfarbe für Bernstein */
  --rahmen-bernstein: #E8A984;

  /* Akzent / Fokusfarbe für Bernstein */
  --fokus-bernstein:  #E08A57;

  /* Hintergrundfarbe hell für Bernsteinthemen */
  --background-bernstein-hell:  #FEF1E9;

  /* Basis-Farbpalette Salbei von hell nach dunkel */
  --salbei-50:  #ECF2F1;
  --salbei-100: #D3E0DE;
  --salbei-200: #BACECB;
  --salbei-300: #A1BCB8;
  --salbei-400: #82A5A1;
  --salbei-500: #627C79;

  /* Textfarben für Salbei */
  --text-salbei-auf-hell:  #3B5755;
  --text-salbei-auf-dunkel: #FFFFFF;

  /* Hover-Farben für Salbei */
  --hover-salbei-hell:   #CFE2E0;
  --hover-salbei-dunkel: #6E8F8B;

  /* Rahmen-/Linienfarbe für Salbei */
  --rahmen-salbei: #BACECB;

  /* Akzent / Fokusfarbe für Salbei */
  --fokus-salbei:  #A1BCB8;

  /* Hintergrundfarbe hell für Salbeithemen */
  --background-salbei-hell:  #F5F9F8;
}