/* Jin-Voice 风格：现代浅色磨砂质感 (Glassmorphism) 主题 */
:root {
  --primary-color: #4A90E2;
  --bg-gradient: linear-gradient(135deg, #fdfbfb 0%, #ebedee 100%);
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(255, 255, 255, 0.4);
  --text-dark: #2c3e50;
  --text-light: #596275;
}

body {
  background: var(--bg-gradient) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  color: var(--text-dark) !important;
  margin: 0;
  height: 100vh;
}

/* 主容器 */
#mumble-ui, .mumble-ui {
  background: var(--glass-bg) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08) !important;
  margin: 20px auto !important;
  max-width: 1200px !important;
  height: calc(100vh - 40px) !important;
  overflow: hidden !important;
}

/* 顶部工具栏 - 修复异常图标 */
.toolbar {
  background: rgba(255, 255, 255, 0.6) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  padding: 10px !important;
}

/* 隐藏破损的 svg 图标 */
.toolbar img, .tb-item img {
    display: none !important;
}

/* 将工具栏原本包含图标的按钮改为纯文字的现代按钮 */
.toolbar a, .toolbar div, .tb-item {
    display: inline-block !important;
    padding: 6px 12px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 8px !important;
    color: var(--primary-color) !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    margin-right: 8px !important;
    margin-bottom: 5px !important;
    border: 1px solid rgba(74, 144, 226, 0.2) !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
}

.toolbar a:hover, .toolbar div:hover, .tb-item:hover {
    background: var(--primary-color) !important;
    color: white !important;
}

/* 连接弹窗 (登录框) */
.dialog {
  background: rgba(255, 255, 255, 0.95) !important;
  border-radius: 20px !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid #fff !important;
  padding: 30px !important;
  width: 320px !important;
  max-width: 90% !important;
  text-align: center !important;
}

.dialog header {
  background: transparent !important;
  color: var(--text-dark) !important;
  font-weight: 800 !important;
  font-size: 1.4rem !important;
  border-bottom: none !important;
  padding-bottom: 5px !important;
  margin-bottom: 20px !important;
}

/* 弹窗表格重排：让标签和输入框上下排列 */
.dialog table, .dialog tbody, .dialog tr {
    display: block !important;
    width: 100% !important;
}
.dialog td {
    display: block !important;
    width: 100% !important;
    padding: 5px 0 !important;
    text-align: left !important;
    font-weight: bold !important;
    color: var(--text-light) !important;
}

/* 输入框和按钮 */
input[type="text"], input[type="password"] {
  border: 1px solid #dfe4ea !important;
  border-radius: 8px !important;
  padding: 12px 15px !important;
  background: #f1f2f6 !important;
  color: var(--text-dark) !important;
  font-size: 1rem !important;
  transition: all 0.3s ease !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 5px !important;
  margin-bottom: 10px !important;
}

input[type="text"]:focus, input[type="password"]:focus {
  border-color: var(--primary-color) !important;
  background: #fff !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.2) !important;
}

button, input[type="submit"], .btn {
  background: var(--primary-color) !important;
  color: white !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  font-size: 1.1rem !important;
  font-weight: bold !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  width: 100% !important;
  margin-top: 15px !important;
}

button:hover, input[type="submit"]:hover {
  background: #357ABD !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 15px rgba(74, 144, 226, 0.4) !important;
}

/* 频道树状图 (左侧) */
.channel-tree {
  background: rgba(241, 242, 246, 0.5) !important;
  border-right: 1px solid rgba(0, 0, 0, 0.05) !important;
  padding: 10px !important;
}

.channel {
  color: var(--text-dark) !important;
  font-weight: 600 !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  transition: background 0.2s !important;
  margin-bottom: 2px !important;
}

.channel:hover {
  background: rgba(74, 144, 226, 0.1) !important;
}

.user {
  color: var(--text-light) !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
}
.user:hover {
  background: rgba(0, 0, 0, 0.03) !important;
}

/* 聊天区域 (右侧) */
.chat {
  background: transparent !important;
}

.log-entry {
  padding: 10px 15px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.02) !important;
  color: var(--text-light) !important;
}

.message-box {
  background: #fff !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
  padding: 15px !important;
}