/* ============================================================
   Tour Dates Plugin – Basis-Styles v1.2
   ============================================================ */

.td-tour-dates { width: 100%; }

.td-band-section + .td-band-section { margin-top: 3rem; }
.td-band-name { margin-bottom: 1rem; }

.td-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ============================================================
   Tabelle – feste Spaltenbreiten für konsistentes Layout
   über alle Band-Sektionen hinweg
   ============================================================ */
.td-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;   /* ← sorgt für einheitliche Breiten */
}

/* Spaltenbreiten (Summe = 100%) */
.td-table .td-col-datum    { width: 14%; }
.td-table .td-col-stadt    { width: 16%; }
.td-table .td-col-location { width: 32%; }
.td-table .td-col-land     { width:  8%; }
.td-table .td-col-tickets  { width: 30%; }

/* Kopfzeile – gleiche Breiten wie tbody via col-Klassen */
.td-table thead th:nth-child(1) { width: 14%; }
.td-table thead th:nth-child(2) { width: 16%; }
.td-table thead th:nth-child(3) { width: 32%; }
.td-table thead th:nth-child(4) { width:  8%; }
.td-table thead th:nth-child(5) { width: 30%; }

.td-table thead th {
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
    padding: 0.65rem 1rem;
}

.td-table tbody td {
    padding: 0.65rem 1rem;
    vertical-align: middle;
    /* Überlangen Text abschneiden statt Tabelle aufzubrechen */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Location darf umbrechen wenn nötig */
.td-col-location {
    white-space: normal;
    word-break: break-word;
}

.td-col-land    { text-align: center; }
.td-col-tickets { white-space: nowrap; }

/* Hover */
.td-table tbody td { transition: background-color 200ms ease, color 200ms ease; }
.td-table tbody tr { cursor: default; }

/* ============================================================
   Ticket-Button
   ============================================================ */
.td-ticket-btn {
    display: inline-block;
    padding: 0.3rem 0.9rem;
    border: 1px solid currentColor;
    border-radius: 3px;
    text-decoration: none;
    font-size: 0.85em;
    transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease;
    margin-right: 0.35rem;
    line-height: 1.4;
}
.td-ticket-btn:last-child { margin-right: 0; }

/* ============================================================
   Status-Labels
   ============================================================ */
.td-status-label {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 3px;
    border: 1px solid transparent;
    font-size: 0.82em;
    font-weight: 600;
    letter-spacing: 0.03em;
    white-space: nowrap;
    line-height: 1.4;
}
.td-status--ausverkauft { background-color: rgba(200,120,0,0.12); color: #c87800; border-color: rgba(200,120,0,0.35); }
.td-status--abgesagt    { background-color: rgba(200,30,30,0.10);  color: #c01e1e; border-color: rgba(200,30,30,0.30); }
.td-table tbody tr.td-row--ausverkauft td { opacity: 0.75; }
.td-table tbody tr.td-row--abgesagt    td { opacity: 0.60; }

/* ============================================================
   „Neu"-Badge
   ============================================================ */
.td-new-badge {
    display: inline-block;
    margin-left: 0.45rem;
    padding: 0.1rem 0.45rem;
    font-size: 0.7em;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 3px;
    background-color: #e53935;
    color: #ffffff;
    vertical-align: middle;
    line-height: 1.5;
}

.td-no-ticket { opacity: 0.4; }
.td-empty     { opacity: 0.6; font-style: italic; }

/* ============================================================
   Responsive – Stacked-Layout
   ============================================================ */
@media (max-width: 640px) {
    .td-table { table-layout: auto; } /* Auf Mobil wieder auto */

    .td-table thead { display: none; }

    .td-table tbody tr {
        display: block;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(128,128,128,0.2);
    }

    .td-table tbody td {
        display: flex;
        gap: 0.5rem;
        padding: 0.2rem 0.5rem;
        align-items: baseline;
        width: 100% !important;
        white-space: normal;
        overflow: visible;
    }

    .td-table tbody td::before {
        content: attr(data-label);
        flex: 0 0 100px;
        font-weight: 600;
        font-size: 0.78em;
        opacity: 0.65;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }
}
