/*
 * ====================================================================
 * TEAMS DISTANCES TABLE STYLES
 * ====================================================================
 * Template: teams_distances_bs5.twig
 * Zweck: Vereins-Entfernungs-Tabelle - zeigt Gesamtkilometer und
 *        durchschnittliche Entfernungen für Auswärtsfahrten
 * 
 * Enthält nur template-spezifische Styles für:
 * - Total Distance Info (Gesamtkilometer-Anzeige)
 * - Average Distance Info (Durchschnittsentfernung)
 * - Tabellen-spezifische Hover-Effekte (Golden hover)
 * - Alert-Info Styling für Entfernungen
 * - Spalten-spezifische Breiten
 * 
 * CSS Counter, Wrapper, Responsive-Breakpoints, Print-Styles und
 * Sticky-Backgrounds werden zentral gehandhabt
 * ====================================================================
 */

/* Total Distance Info Styling */
.total-distance-info {
    line-height: 1.2;
}

.total-distance-info .total-distance {
    color: var(--fm-text-primary);
    font-size: 1.1rem;
    display: block;
}

.total-distance-info small {
    font-size: 0.8rem;
    line-height: 1;
    opacity: 0.8;
}

/* Average Distance Info Styling */
.avg-distance-info {
    line-height: 1.2;
}

.avg-distance-info .avg-distance {
    color: var(--fm-gold);
    font-size: 1.1rem;
    display: block;
}

.avg-distance-info small {
    font-size: 0.8rem;
    line-height: 1;
    opacity: 0.8;
}

/* Hover-Effekte für numerische Spalten */
#teamsDistancesTable tbody tr:hover .total-distance {
    color: var(--fm-gold);
}

/* Alert Styling */
.alert-info {
    background-color: rgba(182, 139, 71, 0.1);
    border-color: var(--fm-gold);
    color: var(--fm-text-primary);
}

.alert-info .alert-heading {
    color: var(--fm-gold);
    font-weight: 600;
}

/* Spalten-spezifische Breiten */
#teamsDistancesTable th:nth-child(3),
#teamsDistancesTable td:nth-child(3) {
    min-width: 140px;
}

#teamsDistancesTable th:nth-child(4),
#teamsDistancesTable td:nth-child(4) {
    min-width: 130px;
}

/* Mobile-spezifische Anpassungen */
@media (max-width: 1199px) {
    .total-distance-info .total-distance,
    .avg-distance-info .avg-distance {
        font-size: 1rem;
    }
}

@media (max-width: 991px) {
    .total-distance-info small,
    .avg-distance-info small {
        font-size: 0.75rem;
    }
    
    /* Kompaktere Spaltenbreiten */
    #teamsDistancesTable th:nth-child(3),
    #teamsDistancesTable td:nth-child(3),
    #teamsDistancesTable th:nth-child(4),
    #teamsDistancesTable td:nth-child(4) {
        min-width: 110px;
    }
}

@media (max-width: 767px) {
    .total-distance-info .total-distance,
    .avg-distance-info .avg-distance {
        font-size: 0.9rem;
    }
    
    .total-distance-info small,
    .avg-distance-info small {
        font-size: 0.7rem;
    }
    
    /* Noch kompaktere Spaltenbreiten */
    #teamsDistancesTable th:nth-child(3),
    #teamsDistancesTable td:nth-child(3),
    #teamsDistancesTable th:nth-child(4),
    #teamsDistancesTable td:nth-child(4) {
        min-width: 90px;
    }
}

@media (max-width: 576px) {
    .total-distance-info .total-distance,
    .avg-distance-info .avg-distance {
        font-size: 0.85rem;
    }
    
    .total-distance-info small,
    .avg-distance-info small {
        font-size: 0.65rem;
    }
}