/* ============================================================
   VOICE STYLES v3
   ============================================================ */

/* ── Voice Toggle (lobby) ── */
.voice-toggle { display:flex; gap:0.6rem; }
.voice-opt {
    flex:1; display:flex; flex-direction:column; align-items:center;
    gap:0.3rem; padding:0.9rem 0.75rem;
    background:var(--bg-elevated); border:2px solid var(--border);
    border-radius:var(--radius-sm); cursor:pointer;
    transition:var(--transition); font-family:var(--font-body);
    -webkit-tap-highlight-color:transparent;
}
.voice-opt:hover   { border-color:var(--red); }
.voice-opt--active { border-color:var(--red); background:var(--red-glow); }
.voice-opt__icon   { font-size:1.5rem; line-height:1; }
.voice-opt__label  { font-size:0.8rem; font-weight:700; color:var(--text-primary); }
.voice-opt__desc   { font-size:0.68rem; color:var(--text-secondary); text-align:center; }

/* ── Mic button (tu propio mic) ── */
.mic-toggle {
    background:transparent; border:none; cursor:pointer;
    font-size:1.1rem; padding:0.3rem; border-radius:6px;
    transition:var(--transition); line-height:1; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    -webkit-tap-highlight-color:transparent;
}
.mic-toggle:hover     { background:var(--bg-elevated); }
.mic-toggle:active    { transform:scale(0.9); }

/* ── Mic indicator (solo visual, otros jugadores) ── */
.mic-indicator {
    display:flex; align-items:center; justify-content:center;
    width:1.4rem; flex-shrink:0; opacity:0.7;
}

/* ── SVG iconos de micrófono ── */
.mic-svg { width:18px; height:18px; }

/* ── Indicador sutil de quien habla ── */
/* Solo un borde izquierdo verde que aparece/desaparece */
.turn-item { border-left: 3px solid transparent; transition: border-left-color 0.2s ease; }
.turn-item.is-speaking { border-left-color: var(--green); }