/* 灵犀 V4 - CSS 修复层 */
/* 覆盖内联样式的错误和冲突 */

/* === 布局 === */
.chat-container {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
.chat-messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}
.chat-input-area {
  flex-shrink: 0 !important;
}
#v4kpiRow, #v4modRow, #v4tableArea {
  flex-shrink: 0 !important;
}

/* === 侧栏折叠 === */
.side-nav.folded + .main-content,
.side-nav.folded ~ .main-content {
  margin-left: 56px !important;
}

/* === 聊天消息 === */
.chat-messages {
  text-align: left !important;
  padding-left: 16px !important;
}
.msg-row {
  justify-content: flex-start !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}
.msg-avatar {
  flex-shrink: 0 !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.msg-bubble {
  max-width: 80% !important;
  border-radius: 8px !important;
}

/* === 浮动气泡 === */
.float-bubbles {
  position: fixed !important;
  right: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 999 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.float-bubble {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  cursor: pointer !important;
  padding: 8px !important;
  border-radius: 12px !important;
  background: rgba(16, 185, 129, 0.1) !important;
  border: 1px solid rgba(16, 185, 129, 0.2) !important;
}
.float-bubble:hover {
  background: rgba(16, 185, 129, 0.2) !important;
  border-color: rgba(16, 185, 129, 0.4) !important;
}
.bubble-dot-pulse {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #10b981 !important;
  display: block !important;
}
.bubble-label {
  font-size: 10px !important;
  color: #b4b4b4 !important;
  margin-top: 4px !important;
  white-space: nowrap !important;
}

/* === nav items === */
.nav-item:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  color: #fafafa !important;
}
.nav-item.active {
  background: rgba(16, 185, 129, 0.1) !important;
  color: #10b981 !important;
}

/* === KPI折叠 === */
.v4-kpi-collapsed {
  height: 28px !important;
  min-height: 28px !important;
  overflow: hidden !important;
}
.v4-kpi-collapsed .v4-kpi-scroll,
.v4-kpi-collapsed .v4-kpi-navs {
  display: none !important;
}

/* === 侧栏折叠按钮 === */
#sidebarFoldBtn {
  z-index: 100 !important;
  position: fixed !important;
}

/* === 滚动条美化 === */
::-webkit-scrollbar {
  width: 4px !important;
  height: 4px !important;
}
::-webkit-scrollbar-track {
  background: transparent !important;
}
::-webkit-scrollbar-thumb {
  background: rgba(16, 185, 129, 0.3) !important;
  border-radius: 2px !important;
}

/* ===== Mobile Responsive ===== */
@media (max-width: 768px) {
  .sidebar { width: 56px !important; min-width: 56px !important; }
  .sidebar .brand-info { display: none !important; }
  .sidebar .version-badge { display: none !important; }
  .sidebar .nav-group-items { display: none !important; }
  .sidebar .nav-group.open .nav-group-items { display: block !important; }
  .sidebar .brand-logo { margin: 0 auto; }
  .chat-container { margin-left: 56px !important; }
  .boss-kc { min-width: 100px !important; padding: 6px 4px !important; }
  .boss-kc .v4-kv { font-size: 16px !important; }
  .v4-kc { min-width: 60px !important; padding: 4px 2px !important; }
  .v4-kl { font-size: 9px !important; }
  .v4-kv { font-size: 14px !important; }
  .chat-messages { padding: 10px 12px !important; }
  .chat-input-area { padding: 8px 12px !important; }
  .input-wrapper textarea { font-size: 13px !important; }
  .msg-bubble { max-width: 95% !important; font-size: 13px !important; }
  .float-bubbles { display: none !important; }
  canvas[style*="position:fixed"] { display: none !important; }
  .welcome-msg { padding: 20px 10px !important; }
  .welcome-msg h2 { font-size: 16px !important; }
  .welcome-icon { width: 40px !important; height: 40px !important; }
}
@media (max-width: 480px) {
  .sidebar { width: 0 !important; min-width: 0 !important; overflow: hidden !important; }
  .chat-container { margin-left: 0 !important; }
  .boss-kc { min-width: 80px !important; }
  .boss-kc .v4-kv { font-size: 14px !important; }
}