/* TGF.Vorstandshistorie — Tabelle aller Vorstandszusammensetzungen.
   Liegt i.d.R. im Creme-Leseband (.reading.band): feste Leseband-Farben statt var(--text)/--muted
   (die lösen auf .tgf-public hell auf → unsichtbar). */

.tgfvh {
    color: inherit;
}

/* Tabelle: schlicht, Leseband-konform; horizontales Scrollen via Bootstrap .table-responsive (Wrapper). */
.tgfvh-table {
    width: 100%;
    border-collapse: collapse;
    color: inherit;
}
.tgfvh-table th,
.tgfvh-table td {
    text-align: left;
    padding: .5rem .75rem;
    border-bottom: 1px solid rgba(36, 27, 18, .16);
    vertical-align: top;
}
.tgfvh-table thead th {
    font-weight: 600;
    font-size: .92rem;
    color: #2a2016;
    border-bottom-width: 2px;
}
.tgfvh-table a {
    color: var(--red, #c90000);
    text-decoration: none;
}
.tgfvh-table a:hover {
    text-decoration: underline;
}
.tgfvh-zeitraum {
    font-weight: 600;
    white-space: nowrap;
}
.tgfvh-anzahl {
    color: #6f5e4a;
}
.tgfvh-bemerkung {
    color: #6f5e4a;
}

/* Badges (Bootstrap .text-bg-success/-warning/-danger liefern die Farben). */
.tgfvh-badge {
    margin-left: .4rem;
    font-weight: 600;
    vertical-align: baseline;
}

/* Legende */
.tgfvh-legende {
    margin-top: 1.6rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(36, 27, 18, .16);
    display: flex;
    flex-direction: column;
    gap: .55rem;
}
.tgfvh-legende-titel {
    font-weight: 700;
}
/* 2-Spalten-Grid: feste Badge-Spalte (so breit wie das breiteste Badge) → Texte bündig untereinander. */
.tgfvh-legende-grid {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .55rem .7rem;
    align-items: start; /* Badge oben am ersten Textzeilen-Rand, nicht mittig (relevant bei umbrechendem Text/Mobile) */
}
.tgfvh-legende-grid .tgfvh-badge {
    margin-left: 0;
    justify-self: start; /* Badge in natürlicher Breite links, nicht über die Spalte gedehnt */
    margin-top: .15rem;  /* Badge-Text auf Höhe der ersten Textzeile (Ausgleich Badge-Padding vs. Zeilenhöhe) */
}