/* Globale Stile für die Live-Ansicht */
body.single-setlist {
    background-color: #000;
    color: #eee;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
}

h3 {
    color:#555 !important;
}

/* Flexbox-Container für das Zwei-Spalten-Layout */
#gig-view-container {
    display: flex;
    height: 100vh;
}

/* Linke Spalte: Setlist-Navigation */
#setlist-nav {
    flex: 0 0 250px;
    background-color: #1a1a1a;
    padding: 1rem;
    overflow-y: auto;
}

#setlist-song-list {
    list-style: none;
    padding: 0;
    margin: 0;
    color:#777;
}

#setlist-song-list li {
    padding: 0.8rem;
    cursor: pointer;
    border-bottom: 1px solid #333;
    transition: background-color 0.2s;
}

#setlist-song-list li:hover {
    background-color: #333;
}

#setlist-song-list li.active {
    background-color: #3498db;
    color: #fff;
}

/* Rechte Spalte: Song-Anzeige */
#song-viewer {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    overflow: hidden; /* Verhindert doppelte Scrollbalken */
    background-color: black;
}

#song-display {
    flex: 1;
    overflow-y: auto; /* Nur dieser Bereich scrollt */
    background-color: #111;
    border-radius: 5px;
    padding: 2rem;
    border: 1px solid #333;
}

#song-title {
    font-size: 3rem; /* Grössere Schrift für Lesbarkeit */
    font-weight: bold;
    margin-bottom: 1.5rem;
    color: #fff;
}

/* Styling für die Akkord- und Text-Ansichten */
.lyrics-part, .chords-part {
    margin-bottom: 2rem;
    color:white;
}

.chords-part {
    font-family: "Courier New", Courier, monospace;
    font-size: 1.5rem;
    line-height: 1.6;
    white-space: pre;
    color:#000;
}

#lyrics-view {
    font-size: 2rem;
    line-height: 2.8; /* Angepasste Zeilenhöhe für die Akkorde */
    white-space: pre-wrap;
}

.chord-wrapper {
    display: inline-block;
    text-align: center;
    line-height: 1;
    vertical-align: bottom;
    margin-bottom: 1.2em;
}

.chord {
    display: block;
    color: #3498db;
    font-weight: bold;
    font-size: 0.9em;
    transform: translateY(-1.2em);
}

/* Die entscheidende Regel zum Ausblenden der Akkorde */
#lyrics-view.chords-hidden .chord-wrapper {
    display: none;
}

/* Untere Steuerleiste */
#controls {
    flex-shrink: 0;
    padding-top: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #333;
}

button {
    background-color: #2a2a2a;
    color: #fff;
    border: 1px solid #555;
    border-radius: 5px;
    padding: 1rem 1.5rem;
    font-size: 1rem;
    cursor: pointer;
    margin: 0 0.5rem;
    transition: background-color 0.2s;
}

button:hover {
    background-color: #4a4a4a;
}