/* ============================================
   SIMPLELYTICS 5 - Farbvariablen
   Standard (Light Mode)
   ============================================ */

:root {
    /* Rot */
    --color-red-dark2:      #ff3333;
    --color-red-dark1:      #ff5c5c;
    --color-red:            #ff8585;
    --color-red-light1:     #ffadad;
    --color-red-light2:     #ffd6d6;

    /* Orange */
    --color-orange-dark2:   #ff6600;
    --color-orange-dark1:   #ff8533;
    --color-orange:         #ffa366;
    --color-orange-light1:  #ffc299;
    --color-orange-light2:  #ffe0cc;

    /* Gelb */
    --color-yellow-dark2:   #ffcc00;
    --color-yellow-dark1:   #ffd426;
    --color-yellow:         #ffdb4d;
    --color-yellow-light1:  #ffe373;
    --color-yellow-light2:  #ffeb99;

    /* Grün hell */
    --color-green-dark2:    #66cc00;
    --color-green-dark1:    #7dd426;
    --color-green:          #94db4d;
    --color-green-light1:   #abe373;
    --color-green-light2:   #c2eb99;

    /* Grün dunkel */
    --color-green2-dark2:   #009933;
    --color-green2-dark1:   #33ad5c;
    --color-green2:         #66c285;
    --color-green2-light1:  #99d6ad;
    --color-green2-light2:  #ccebd6;

    /* Blau hell */
    --color-blue-dark2:     #3399ff;
    --color-blue-dark1:     #51a8ff;
    --color-blue:           #71b8ff;
    --color-blue-light1:    #8fc7ff;
    --color-blue-light2:    #add6ff;

    /* Blau dunkel */
    --color-blue2-dark2:    #333399;
    --color-blue2-dark1:    #5c5cad;
    --color-blue2:          #8585c2;
    --color-blue2-light1:   #adadd6;
    --color-blue2-light2:   #d6d6eb;

    /* Grau & Allgemein */
    --color-grey1:          #dddddd;
    --color-grey2:          #eeeeee;
    --color-grey3:          #bbbbbb;
    --color-white:          #ffffff;

    /* UI Farben (Light Mode) */
    --color-background:     #eeeeee;
    --color-background-alt: #ffffff;
    --color-text:           #222222;
    --color-text-muted:     #666666;
    --color-border:         #dddddd;
    --color-card:           #ffffff;
    --color-card-shadow:    rgba(0, 0, 0, 0.08);

    /* Navigation & Footer */
    --color-nav-footer-bg:  #ffffff;
    --color-nav-footer-text: #222222;
}

/* ============================================
   Dark Mode
   ============================================ */

[data-bs-theme="dark"] {
    /* UI Farben (Dark Mode) */
    --color-background:     #333333;
    --color-background-alt: #444444;
    --color-text:           #e0e0e0;
    --color-text-muted:     #aaaaaa;
    --color-border:         #555555;
    --color-card:           #444444;
    --color-card-shadow:    rgba(0, 0, 0, 0.3);

    /* Farben im Dark Mode etwas aufgehellt */
    --color-red:            #ff5c5c;
    --color-orange:         #ff8533;
    --color-yellow:         #ffd426;
    --color-green:          #7dd426;
    --color-green2:         #33ad5c;
    --color-blue:           #51a8ff;
    --color-blue2:          #5c5cad;

    /* Navigation & Footer */
    --color-nav-footer-bg:  #000000;
    --color-nav-footer-text: #ffffff;
}