/* 主题变量 */
:root {
  /* 明亮主题 - 科技蓝玻璃态设计 */
  --background-color: #f8f9fa;
  --text-color: #212529;
  --primary-color: #007bff; /* 科技蓝主色 */
  --primary-light: #80bdff;
  --primary-dark: #0056b3;
  --secondary-color: #6c757d;
  --success-color: #28a745;
  --danger-color: #dc3545;
  --warning-color: #ffc107;
  --info-color: #17a2b8;
  --light-color: #f8f9fa;
  --dark-color: #343a40;
  
  /* 玻璃态效果变量 */
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(0, 123, 255, 0.18);
  --glass-shadow: 0 8px 32px 0 rgba(0, 123, 255, 0.15);
  --glass-backdrop: blur(16px);
  
  /* 侧边栏 - 科技蓝风格 */
  --sidebar-bg: linear-gradient(135deg, #1a1f36 0%, #2c3e50 100%);
  --sidebar-text: #ffffff;
  --sidebar-hover-bg: rgba(0, 123, 255, 0.15);
  --sidebar-active-bg: var(--primary-color);
  --sidebar-active-text: #ffffff;
  --sidebar-border-color: rgba(255, 255, 255, 0.1);
  --sidebar-group-title-color: #a0a9c0;
  
  /* 头部 */
  --header-bg: var(--glass-bg);
  --header-text: var(--text-color);
  --header-backdrop: var(--glass-backdrop);
  
  /* 卡片 */
  --card-bg: var(--glass-bg);
  --card-border: var(--glass-border);
  --card-shadow: var(--glass-shadow);
  --card-backdrop: var(--glass-backdrop);
  
  /* 按钮 */
  --btn-primary-bg: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);
  --btn-primary-text: #ffffff;
  --btn-primary-hover-bg: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-color) 100%);
  
  /* 链接 */
  --link-color: var(--primary-color);
  --link-hover-color: var(--primary-dark);
  
  /* 输入框 */
  --input-bg: rgba(255, 255, 255, 0.9);
  --input-border: var(--glass-border);
  --input-focus-border: var(--primary-color);
  --input-focus-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* 暗色主题 - 科技蓝玻璃态设计 */
[data-theme="dark"] {
  --background-color: #0d1117;
  --text-color: #f0f6fc;
  --primary-color: #58a6ff; /* 暗色模式下的科技蓝 */
  --primary-light: #79c0ff;
  --primary-dark: #388bfd;
  --secondary-color: #8b949e;
  --success-color: #3fb950;
  --danger-color: #f85149;
  --warning-color: #d29922;
  --info-color: #58a6ff;
  --light-color: #21262d;
  --dark-color: #f0f6fc;
  
  /* 暗色模式玻璃态效果 */
  --glass-bg: rgba(13, 17, 23, 0.85);
  --glass-border: rgba(88, 166, 255, 0.18);
  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4);
  --glass-backdrop: blur(16px);
  
  /* 侧边栏 - 暗色科技风格 */
  --sidebar-bg: linear-gradient(135deg, #0d1117 0%, #161b22 100%);
  --sidebar-text: #f0f6fc;
  --sidebar-hover-bg: rgba(88, 166, 255, 0.15);
  --sidebar-active-bg: var(--primary-color);
  --sidebar-active-text: #0d1117;
  --sidebar-border-color: rgba(240, 246, 252, 0.1);
  --sidebar-group-title-color: #8b949e;
  
  /* 头部 */
  --header-bg: var(--glass-bg);
  --header-text: var(--text-color);
  --header-backdrop: var(--glass-backdrop);
  
  /* 卡片 */
  --card-bg: var(--glass-bg);
  --card-border: var(--glass-border);
  --card-shadow: var(--glass-shadow);
  --card-backdrop: var(--glass-backdrop);
  
  /* 按钮 */
  --btn-primary-bg: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-light) 100%);
  --btn-primary-text: #0d1117;
  --btn-primary-hover-bg: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-color) 100%);
  
  /* 链接 */
  --link-color: var(--primary-color);
  --link-hover-color: var(--primary-light);
  
  /* 输入框 */
  --input-bg: rgba(33, 38, 45, 0.9);
  --input-border: var(--glass-border);
  --input-focus-border: var(--primary-color);
  --input-focus-shadow: 0 0 0 0.2rem rgba(88, 166, 255, 0.25);
}

/* 顶部菜单布局 */
.topmenu-layout {
  --sidebar-width: 0px;
}

.topmenu-layout .sidebar {
  width: 100%;
  height: auto;
  position: relative;
  transform: none;
}

.topmenu-layout .sidebar-nav {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.topmenu-layout .nav-group {
  display: flex;
  align-items: center;
}

.topmenu-layout .nav-group-title {
  display: none;
}

.topmenu-layout .nav-item {
  width: auto;
  padding: 10px 15px;
}

.topmenu-layout .main-content {
  margin-left: 0;
}