/**
 * NoxeAI 官方视觉主题 — 对齐 kp/前端 与 kp/后端 (v6.9.2)
 * 主色 #5147FF，前端侧栏 288px，后台侧栏 220px
 */
@font-face {
  font-family: 'Alibaba PuHuiTi';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('https://jsd.onmicrosoft.cn/gh/nosqlnull/sparkai-fonts@main/AlibabaPuHuiTi-3-65-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Alibaba PuHuiTi';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('https://jsd.onmicrosoft.cn/gh/nosqlnull/sparkai-fonts@main/AlibabaPuHuiTi-3-85-Bold.woff2') format('woff2');
}

:root {
  --primary: #5147FF;
  --primary-hover: #3d35e8;
  --primary-light: #eeecff;
  --noxe-gradient: linear-gradient(135deg, #5147FF 0%, #8b5cf6 50%, #ec4899 100%);
  --bg-page: #efefef;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --sidebar-width-front: 288px;
  --sidebar-width-admin: 220px;
  --header-height-front: 56px;
  --header-height-admin: 50px;
}

[data-theme="dark"] {
  --primary: #6b63ff;
  --primary-hover: #8b84ff;
  --primary-light: #1e1b4b;
  --bg-page: #0f0f12;
  --bg-sidebar: #171717;
  --bg-card: #1f1f23;
}

body.noxeai-front,
body.noxeai-admin {
  font-family: 'Alibaba PuHuiTi', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 前端：侧栏宽度与背景 */
body.noxeai-front {
  --bg-page: #efefef;
}
body.noxeai-front .sidebar {
  width: var(--sidebar-width-front) !important;
  background: var(--bg-sidebar) !important;
  border-right: 1px solid rgba(0, 0, 0, 0.06);
}
body.noxeai-front #panel-chat {
  background: #ffffff;
}

body.noxeai-front #panel-chat:not(.active) {
  display: none !important;
}

[data-theme="dark"] body.noxeai-front #panel-chat {
  background: var(--bg-card, #1f1f23);
}
body.noxeai-front .top-header {
  height: var(--header-height-front);
  min-height: var(--header-height-front);
  background: #ffffff;
  border-bottom: none;
  box-shadow: none;
}
[data-theme="dark"] body.noxeai-front .top-header {
  background: #0f0f12;
}

.logo-text-gradient,
.noxe-gradient-text,
.spark-gradient-text {
  background: var(--noxe-gradient);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: noxe-gradient-shift 4s ease infinite;
}
@keyframes noxe-gradient-shift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

body.noxeai-front .nav-item.active {
  background: var(--primary-light);
  color: var(--primary);
  font-weight: 600;
  box-shadow: none;
}
body.noxeai-front .nav-item.active svg {
  color: var(--primary);
}
/* 开启新对话：保持起步样式（浅底 + 主色字，悬停才实心） */
body.noxeai-front .btn-new-chat {
  background: var(--primary-light);
  color: var(--primary);
  border: 1px solid transparent;
}
body.noxeai-front .btn-new-chat:hover {
  background: var(--primary);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(81, 71, 255, 0.22);
}
body.noxeai-front .btn-new-chat kbd {
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-muted);
}
body.noxeai-front .btn-new-chat:hover kbd {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  border-color: transparent;
}

body.noxeai-front .btn-generate,
body.noxeai-front .agent-run-btn:hover {
  background: var(--primary);
}
body.noxeai-front .btn-generate:hover {
  background: var(--primary-hover);
}

/* 后台侧栏黑白按钮样式见 noxeai-admin.css */

body.noxeai-admin .header {
  height: var(--header-height-admin);
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}
body.noxeai-admin .header-breadcrumb {
  font-size: 13px;
  color: var(--text-muted);
}
body.noxeai-admin .header-breadcrumb strong {
  color: var(--text-main);
  font-weight: 600;
}
body.noxeai-admin .btn-primary,
body.noxeai-admin .nav-item.active {
  background: var(--primary);
}
body.noxeai-admin .btn-primary:hover {
  background: var(--primary-hover);
}
body.noxeai-admin .card {
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}
body.noxeai-admin .admin-version-badge {
  font-size: 10px;
  opacity: 0.7;
  margin-left: 4px;
}

.panel-scroll-area {
  flex: 1;
  overflow-y: scroll;
  overflow-x: hidden;
  padding-right: 8px;
  min-height: 0;
}
.panel-scroll-area::-webkit-scrollbar { width: 10px; }
.panel-scroll-area::-webkit-scrollbar-thumb {
  background: rgba(81, 71, 255, 0.4);
  border-radius: 10px;
}