/* ========== DARK MODE STYLES ========== */
html.dark-mode, html.dark-mode body {
    background-color: #1c1c1c;
    color: #e0e0e0;
}

html.dark-mode table {
    background-color: #2c2c2c;
    box-shadow: 10px 15px 15px 1px rgba(0, 0, 0, 0.8);
}

html.dark-mode tr.tabellenkopf {
    background-color: #007f00;
    color: #ffffff;
}

html.dark-mode tr.r1 {
    background-color: #2a2a2a;
}

html.dark-mode tr.r2 {
    background-color: #333333;
}

html.dark-mode tr.reihe-1 {
    background-color: #2a2a2a;
}

html.dark-mode tr.reihe-2 {
    background-color: #333333;
}
html.dark-mode td {
    color: #e0e0e0;
}

html.dark-mode a {
    color: #90caf9;
}

html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3 {
    color: #ffffff;
    text-shadow: 2px 2px 5px #000;
}

/* Farben für Status bleiben */
html.dark-mode span#winner {
    color: #00B233;
}
html.dark-mode span#run {
    color: red;
}
html.dark-mode span#pause {
    color: orange;
}
html.dark-mode span#st,
html.dark-mode span#nd {
    color: #00B233;
}
html.dark-mode span#rd {
    color: #ff8c00;
}

/* Menü */
html.dark-mode nav ul {
    background: #2a2a2a;
    background: linear-gradient(to bottom, #3a3a3a 0%, #2a2a2a 100%);
    box-shadow: 0px 0px 9px rgba(255,255,255,0.05);
}

html.dark-mode nav ul li:hover {
    background: #444;
    background: linear-gradient(to bottom, #4f4f4f 0%, #5a5a5a 40%);
}

html.dark-mode nav ul li a {
    color: #ddd;
}

html.dark-mode nav ul ul {
    background: #3a3a3a;
}

html.dark-mode nav ul ul li {
    border-top: 1px solid #555;
    border-bottom: 1px solid #444;
}

html.dark-mode nav ul ul li a {
    color: #eee;
}

html.dark-mode nav ul ul li a:hover {
    background: #555;
}

/* Scroll Button */
html.dark-mode .scroll {
    background: rgba(50, 50, 50, 0.7);
    color: #fff;
}

html.dark-mode .scroll:hover {
    background: rgba(50, 50, 50, 1.0);
}