/* ==========================================================================
   Modul: content-table (klassische Content-Tabelle)
   Hinweis: Farben/Fonts ggf. an die CSS-Variablen des jeweiligen Themes
   anpassen (mobile-pocket vs. bluesource). Die var()-Aufrufe unten haben
   bewusst Fallback-Werte, damit das Modul auch ohne Anpassung funktioniert.
   ========================================================================== */

/* Scroll-Wrapper: Tabelle bleibt auf Mobile per horizontalem Scroll nutzbar */
.content-table__wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-top: 2rem;
}

.content-table__wrapper:focus-visible {
    outline: 2px solid var(--color-primary, #f26722);
    outline-offset: 4px;
}

.content-table__table {
    width: 100%;
    min-width: 640px; /* verhindert Zerquetschen bei vielen Spalten */
    border-collapse: collapse;
    font-size: 1rem;
    line-height: 1.5;
    text-align: left;
}

/* Zellen */
.content-table__table th,
.content-table__table td {
    padding: 1rem 1.25rem;
    vertical-align: top;
    border-bottom: 1px solid var(--table-border, rgba(128, 128, 128, 0.25));
}

.content-table__table.is-compact th,
.content-table__table.is-compact td {
    padding: 0.5rem 0.75rem;
}

/* Kopfzeile */
.content-table__table thead th {
    font-weight: 700;
    white-space: nowrap;
    background: var(--table-head-bg, rgba(128, 128, 128, 0.08));
    border-bottom: 2px solid var(--color-primary, #f26722);
}

/* Erste Spalte hervorheben (Option "first_col_bold") */
.content-table__table.has-bold-first-col tbody th[scope="row"] {
    font-weight: 700;
}

/* Zebra-Streifen (Option "striped") */
.content-table__table.is-striped tbody tr:nth-child(even) {
    background: var(--table-stripe-bg, rgba(128, 128, 128, 0.05));
}

/* Links in Zellen */
.content-table__table a {
    color: var(--color-primary, #f26722);
    text-decoration: underline;
}

/* Fußnote / Quelle */
.content-table__caption {
    margin-top: 0.75rem;
    font-size: 0.875rem;
    opacity: 0.7;
}

/* Dunkle Sektionen: Border/Stripes leicht anheben
   (Klassen-Namen ggf. an eure bgcolor-Werte anpassen) */
.content-table.section-bg-dark .content-table__table th,
.content-table.section-bg-dark .content-table__table td {
    border-bottom-color: rgba(255, 255, 255, 0.15);
}

.content-table.section-bg-dark .content-table__table.is-striped tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.04);
}

/* Mobile: etwas kompakter */
@media (max-width: 767px) {
    .content-table__table {
        font-size: 0.9rem;
    }

    .content-table__table th,
    .content-table__table td {
        padding: 0.75rem 0.875rem;
    }
}
