/* ============================================
   MEJORAS VISIBLES PARA FUTONE
   ============================================ */

/* 1. TARJETAS DE EVENTOS: más elevación y brillo */
.evento-card {
    background: linear-gradient(135deg, #1a1a2e, #16213e) !important;
    border-radius: 20px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.3) !important;
}
.evento-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    box-shadow: 0 20px 35px rgba(0, 212, 255, 0.3) !important;
    border-color: #00d4ff !important;
}

/* 2. IMAGEN CON OVERLAY */
.evento-imagen {
    position: relative;
}
.evento-imagen::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 70%);
    pointer-events: none;
}

/* 3. BOTÓN VER */
.btn-ver {
    background: linear-gradient(90deg, #00d4ff, #7c3aed) !important;
    border-radius: 40px !important;
    font-weight: bold !important;
    letter-spacing: 1px !important;
    transition: all 0.3s !important;
}
.btn-ver:hover {
    transform: scale(1.02);
    filter: brightness(1.1);
}

/* 4. MENÚ LATERAL: barra indicadora activa */
.sidebar-nav a.active {
    background: rgba(0, 212, 255, 0.15) !important;
    border-left: 3px solid #00d4ff !important;
}
.sidebar-nav a:hover {
    background: rgba(0, 212, 255, 0.1) !important;
    padding-left: 20px !important;
    transition: 0.2s;
}

/* 5. CHAT: burbujas mejoradas */
.chat-message {
    border-radius: 18px !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
}
.chat-message.usuario {
    background: linear-gradient(135deg, #1e2a3a, #16213e) !important;
    border-bottom-right-radius: 4px !important;
}
.chat-message.admin {
    background: linear-gradient(135deg, #2a1a3a, #1a0f2a) !important;
    border-bottom-left-radius: 4px !important;
}

/* 6. BOTÓN FLOTANTE DEL REPRODUCTOR */
.pip-btn {
    background: rgba(0,0,0,0.7) !important;
    backdrop-filter: blur(4px);
    border-radius: 12px !important;
    transition: 0.2s;
}
.pip-btn:hover {
    background: #00d4ff !important;
    transform: scale(1.1);
}