/* 金顺达企业智能体 · 对话页美化层（2026-11-04）— 叠加在构建产物之上，品牌绿 #0E7C66 */
:root { --jsd-green: #0E7C66; --jsd-green-weak: #EAF4F0; --jsd-border: #DCE7E3; --jsd-ink: #24332F; }

/* 基础排版 */
body { font-family: "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif; color: var(--jsd-ink); }

/* 消息流：留白与可读性 */
.agent-chat .body { line-height: 1.75; }
.agent-chat .bubble-wrap { max-width: 920px; }
.agent-chat .bubble-wrap .msg { margin: 16px 0; }

/* 消息气泡（卡片化） */
.msg .bubble { background: #fff !important; border: 1px solid var(--jsd-border) !important; border-radius: 12px !important;
  padding: 14px 18px !important; box-shadow: 0 1px 2px rgba(15,60,50,.05); line-height: 1.75 !important; font-size: 15px !important; }
.msg.user .bubble { background: var(--jsd-green) !important; border-color: var(--jsd-green) !important; }
.msg.user .bubble, .msg.user .bubble * { color: #fff !important; }

/* 快捷提示：药丸按钮 */
.quick-row { gap: 10px !important; flex-wrap: wrap; }
.quick-chip { background: #fff !important; border: 1px solid #BFD8D0 !important; color: var(--jsd-green) !important;
  border-radius: 999px !important; padding: 8px 16px !important; font-size: 13px !important; cursor: pointer; transition: all .15s ease; }
.quick-chip:hover { background: var(--jsd-green-weak) !important; border-color: var(--jsd-green) !important; }

/* 应用卡片（空态选择应用） */
.app-grid { gap: 14px; }
.app-card { background: #fff; border: 1px solid var(--jsd-border); border-radius: 14px; padding: 18px; cursor: pointer; transition: all .15s ease; }
.app-card:hover { border-color: var(--jsd-green); box-shadow: 0 6px 18px rgba(14,124,102,.10); transform: translateY(-1px); }
.app-icon { background: var(--jsd-green-weak); color: var(--jsd-green); border-radius: 10px; }
.app-name { font-weight: 600; }

/* 顶栏（通知/记忆/素材等工具条）：白底细分隔线，元素收紧 */
.topbar { background: #fff; border-bottom: 1px solid var(--jsd-border); }
.topbar .title { font-weight: 600; color: var(--jsd-ink); }

/* 底部输入区 */
.input-row { background: #fff; border-top: 1px solid var(--jsd-border); }
.input-row textarea { border-radius: 10px; border-color: var(--jsd-border) !important; }
.input-row textarea:focus { border-color: var(--jsd-green) !important; box-shadow: 0 0 0 2px rgba(14,124,102,.12) !important; }
.kb-switch, .input-row label { white-space: nowrap; }

/* 工具调用卡片（人工在环） */
.tool-card { background: #FBFDFC; border: 1px solid var(--jsd-border); border-radius: 12px; }
.tool-head { color: var(--jsd-green); font-weight: 600; }

/* 会话搜索与列表微调 */
.conv-search input { border-radius: 8px; }

/* 滚动条 */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: #C9D6D1; border-radius: 8px; }
*::-webkit-scrollbar-track { background: transparent; }

/* ── v2 底部合成区结构整改（2026-11-04）：三行布局 ──
   L1 快捷提示整行（药丸横排） / L2 附件·助手按钮行 / L3 开关+模型+输入框+发送 */
.input-row { flex-wrap: wrap !important; row-gap: 8px; align-items: center; }
.input-row .quick-row { flex: 1 1 100% !important; order: -1 !important; display: flex !important; flex-wrap: wrap; gap: 10px; }
.input-row .att-btns { display: flex !important; gap: 8px; flex: 0 0 auto; align-items: center; }
.input-row .att-btns > * { white-space: nowrap; }
.input-row .kb-switch { flex: 0 0 auto; }
.input-row .hint { flex-basis: 100%; margin: 0; font-size: 12px; color: #8AA09A; }
.input-row .el-select { flex: 0 0 150px; }
.input-row .el-textarea { flex: 1 1 280px; }
.input-row .pending-atts { flex-basis: 100%; }

/* 顶栏工具条收紧 */
.topbar { gap: 6px; }
.topbar .el-button, .topbar .el-check-tag { font-size: 12px; }

/* ── v3 composer：WorkBuddy 式卡片布局（2026-11-04）──
   卡片内：快捷提示行 → 控件行(附件/开关) → 大输入框 → 模型+发送 */
.input-row { display: flex !important; flex-wrap: wrap; align-items: center; column-gap: 10px;
  border: 1px solid var(--jsd-border) !important; border-radius: 16px !important;
  padding: 12px 14px !important; margin: 0 14px 12px !important; background: #fff !important;
  box-shadow: 0 2px 10px rgba(15,60,50,.06); }
.input-row .quick-row { order: 0; flex: 1 1 100%; padding-bottom: 8px; border-bottom: 1px dashed #E4EDEA; }
.input-row .att-btns { order: 1; display: flex !important; gap: 4px; align-items: center; }
.input-row .att-btns > * { white-space: nowrap; }
.input-row .att-btns .el-button { border: none !important; background: transparent !important;
  color: #5F7370 !important; box-shadow: none !important; padding: 6px 8px; }
.input-row .att-btns .el-button:hover { color: var(--jsd-green) !important; background: var(--jsd-green-weak) !important; }
.input-row .hint { order: 2; flex: 0 1 auto; font-size: 12px; color: #8AA09A; margin: 0; }
.input-row .pending-atts { order: 3; flex-basis: 100%; }
.input-row .el-textarea { order: 4; flex: 1 1 100%; }
.input-row .el-textarea__inner { min-height: 64px !important; font-size: 14px !important;
  padding: 10px 12px !important; border-radius: 10px !important; box-shadow: none !important;
  border-color: var(--jsd-border) !important; resize: none; }
.input-row .el-textarea__inner:focus { border-color: var(--jsd-green) !important;
  box-shadow: 0 0 0 2px rgba(14,124,102,.10) !important; }
.input-row .kb-switch { order: 5; }
.input-row .el-select { order: 6; width: 190px; }
.input-row .el-button--primary { order: 7; margin-left: auto !important;
  border-radius: 10px !important; padding: 10px 24px !important; font-weight: 600; }

/* v4: bigger textarea + model select pinned bottom-right */
.input-row { position: relative !important; padding-bottom: 56px !important; }
.input-row .el-textarea__inner { min-height: 130px !important; font-size: 15px !important; line-height: 1.7 !important; }
.input-row .el-select { position: absolute !important; right: 100px; bottom: 12px; z-index: 5; }
