/* --- voice: Input Sensitivity, connection info, voice moderation (voiceSensitivity.js, voiceStats.js, voiceModeration.js) --- */
.input-sensitivity .settings-row { align-items: center; }
.sensitivity-meter { position: relative; flex: 1; max-width: 360px; height: 24px; }
/* The track is inset by half the slider thumb, so the thumb's centre and the bar's scale line up. */
.sensitivity-track { position: absolute; left: 7px; right: 7px; top: 8px; height: 8px; border-radius: 4px; background: var(--bg-rail); overflow: hidden; }
.sensitivity-fill { height: 100%; width: 0%; background: var(--warning); transition: width 50ms linear; }
.sensitivity-meter.open .sensitivity-fill { background: var(--online); }
.sensitivity-marker { position: absolute; top: 3px; left: calc(7px + (100% - 14px) * var(--pos, 0.5)); width: 2px; height: 18px; margin-left: -1px; background: var(--text-strong); border-radius: 1px; pointer-events: none; }
.sensitivity-slider { position: absolute; inset: 0; width: 100%; height: 24px; margin: 0; padding: 0; background: transparent; -webkit-appearance: none; appearance: none; }
.sensitivity-slider:focus { box-shadow: none; }
.sensitivity-slider::-webkit-slider-runnable-track { height: 24px; background: transparent; }
.sensitivity-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 14px; height: 24px; border-radius: 4px; background: var(--text-strong); box-shadow: 0 0 0 2px var(--bg-chat); cursor: ew-resize; }
.sensitivity-slider:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 2px var(--accent); }
.sensitivity-value { min-width: 9em; }

.voice-panel .voice-stats-toggle { display: flex; align-items: center; gap: 5px; background: none; border: 0; padding: 0; font: inherit; font-weight: 700; font-size: 13.5px; cursor: pointer; text-align: left; }
.voice-panel .voice-stats-toggle:hover { text-decoration: underline; }
.signal-icon { flex: none; }
.signal-good { color: var(--online); }
.signal-fair { color: var(--warning); }
.signal-bad { color: var(--danger); }
.signal-unknown { color: var(--text-muted); }
.voice-stats { position: fixed; z-index: 40; width: min(560px, calc(100vw - 16px)); max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px); overflow: auto; background: var(--bg-sidebar); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5); font-size: 13.5px; }
.voice-stats-header { display: flex; align-items: center; gap: 8px; color: var(--text-strong); }
.voice-stats-header strong { flex: 1; }
.voice-stats-close { font-size: 20px; line-height: 1; padding: 2px 8px; }
.voice-stats-state { font-weight: 600; margin: 4px 0 8px; }
.voice-stats-numbers { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 0 0 8px; }
.voice-stats-numbers dt { color: var(--text-muted); }
.voice-stats-numbers dd { margin: 0; font-weight: 700; color: var(--text-strong); }
.voice-stats-graph { display: block; width: 100%; height: 72px; background: var(--bg-rail); border-radius: 4px; }
.voice-stats-graph .graph-line { fill: none; stroke: currentColor; stroke-width: 2; vector-effect: non-scaling-stroke; }
.voice-stats-graph .graph-bad-line { stroke: var(--danger); stroke-width: 1; stroke-dasharray: 4 4; opacity: 0.6; vector-effect: non-scaling-stroke; }
.voice-stats-graph .graph-dot { fill: var(--text-strong); }
.voice-stats-caption { margin: 4px 0 8px; }
.voice-stats-warning { margin: 0 0 8px; padding: 8px; border-radius: 4px; background: rgba(237, 66, 69, 0.12); color: var(--text); }
.voice-stats-peers { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.voice-stats-peers th { text-align: left; font-weight: 700; color: var(--text-muted); text-transform: uppercase; font-size: 11px; padding: 4px 6px 4px 0; }
.voice-stats-peers td { padding: 4px 6px 4px 0; border-top: 1px solid var(--border); white-space: nowrap; }
.voice-stats-peers td.peer-name { max-width: 120px; overflow: hidden; text-overflow: ellipsis; color: var(--text-strong); }
.voice-stats-peers td.route-relay { color: var(--warning); }

.server-voice-flag { display: inline-flex; align-items: center; color: var(--danger); background: rgba(237, 66, 69, 0.18); border-radius: 4px; padding: 1px; }
.voice-user .flags .server-voice-flag .off { color: var(--danger); }
.icon-button.server-voice-flag { color: var(--danger); background: rgba(237, 66, 69, 0.18); padding: 6px; }
.voice-user.voice-draggable { cursor: grab; }
.voice-user.dragging { opacity: 0.5; }
.voice-channel-row.voice-drop-target { outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: 4px; background: var(--bg-hover); }
.bitrate-input { flex: 1; max-width: 360px; accent-color: var(--accent); }
.bitrate-value { min-width: 4.5em; font-weight: 700; color: var(--text-strong); }