/**
 * css/tournament-badges.css - Team-Badge System
 * Pfad: /css/tournament-badges.css
 * 
 * Funktionen:
 * - Farbkodierte Team-Badges (A-F)
 * - Spieler-Badge System
 * - Badge-Hover-Effekte
 * - Badge-Responsive Design
 */

/* ========================================
   TEAM BADGE SYSTEM
======================================== */

.team-badge {
    display: inline-block !important;
    padding: 0.5rem 1rem !important;
    border-radius: 15px !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    border: 2px solid !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

.team-badge:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2) !important;
    text-decoration: none !important;
}

/* ========================================
   TEAM-SPEZIFISCHE FARBEN
======================================== */

/* Team A - Blau */
.team-badge[style*="e3f2fd"] {
    background-color: #e3f2fd !important;
    color: #1565c0 !important;
    border-color: #2196f3 !important;
}

/* Team B - Grün */
.team-badge[style*="e8f5e9"] {
    background-color: #e8f5e9 !important;
    color: #2e7d32 !important;
    border-color: #4caf50 !important;
}

/* Team C - Orange */
.team-badge[style*="fff3e0"] {
    background-color: #fff3e0 !important;
    color: #ef6c00 !important;
    border-color: #ff9800 !important;
}

/* Team D - Pink */
.team-badge[style*="fce4ec"] {
    background-color: #fce4ec !important;
    color: #c2185b !important;
    border-color: #e91e63 !important;
}

/* Team E - Lila */
.team-badge[style*="f3e5f5"] {
    background-color: #f3e5f5 !important;
    color: #7b1fa2 !important;
    border-color: #9c27b0 !important;
}

/* Team F - Teal */
.team-badge[style*="e0f2f1"] {
    background-color: #e0f2f1 !important;
    color: #00695c !important;
    border-color: #009688 !important;
}

/* ========================================
   SPIELER BADGES
======================================== */

.players-badge {
    font-weight: 600 !important;
    color: var(--tennis-blue) !important;
    font-size: 0.95rem !important;
    margin-top: 0.25rem !important;
    display: block !important;
}

.players-badge.fw-bold {
    font-weight: 700 !important;
}

.players-badge.text-primary {
    color: var(--tennis-blue) !important;
}

.players-badge.text-muted {
    color: #6c757d !important;
    font-style: italic;
}

/* ========================================
   POINTS DISPLAY
======================================== */

.points-display {
    font-size: 1.2rem;
    color: var(--tennis-blue);
    font-weight: bold;
}

/* ========================================
   RESPONSIVE BADGES
======================================== */

@media (max-width: 768px) {
    .team-badge {
        font-size: 0.9rem !important;
        padding: 0.4rem 0.8rem !important;
    }
    
    .players-badge {
        font-size: 0.85rem !important;
    }
}

@media (max-width: 576px) {
    .team-badge {
        font-size: 0.8rem !important;
        padding: 0.3rem 0.6rem !important;
    }
    
    .players-badge {
        font-size: 0.75rem !important;
    }
}

/* ========================================
   PRINT STYLES FÜR BADGES
======================================== */

@media print {
    .team-badge {
        background: #f8f9fa !important;
        color: #333 !important;
        border: 1px solid #333 !important;
        box-shadow: none !important;
        transform: none !important;
    }
    
    .players-badge {
        color: #333 !important;
    }
}

/* ========================================
   ACCESSIBILITY
======================================== */

@media (prefers-contrast: high) {
    .team-badge {
        border-width: 3px !important;
        font-weight: bold !important;
    }
}

.team-badge:focus {
    outline: 3px solid var(--gold) !important;
    outline-offset: 2px !important;
}