/* ============================================================
   GLOBAL CHAT TABS (Event-Chat + Radio-Chat)
   ============================================================ */

.chat-tabs {
    display: flex;
    gap: 6px;
    margin: 12px 0;
    flex-wrap: wrap;
}

/* Einzelner Tab */
.chat-tab {
    position: relative;
    padding: 6px 28px 6px 12px;
    background: #e9e9e9;
    border: 1px solid #ccc;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    user-select: none;
    transition: background 0.2s, border-color 0.2s;
}

/* Aktiver Tab */
.chat-tab.active {
    background: #007bff;
    color: white;
    border-color: #0066d6;
}

/* Hover */
.chat-tab:hover {
    background: #dcdcdc;
}

/* Close-Button (nur Radio-Chats) */
.chat-tab .close-btn {
    position: absolute;
    right: 6px;
    top: 4px;
    font-weight: bold;
    color: #666;
    cursor: pointer;
    padding: 0 4px;
    border-radius: 4px;
}

.chat-tab .close-btn:hover {
    background: rgba(0,0,0,0.15);
    color: black;
}

/* Blink-Effekt bei neuen Nachrichten */
@keyframes tabBlink {
    0%   { background: #ffcc00; }
    50%  { background: #ffe680; }
    100% { background: #ffcc00; }
}

.chat-tab.blink {
    animation: tabBlink 1s infinite;
    border-color: #d4a300;
}

/* Mobile Optimierung */
@media (max-width: 600px) {
    .chat-tab {
        padding: 6px 24px 6px 10px;
        font-size: 13px;
    }
}