/**
 * chat-common.css — 遥控器与设计器聊天区域的共享样式
 * 避免 remote.html 和 designer.html 中重复定义相同样式
 * ============================================================
 */

/* ============ 聊天气泡通用 ============ */
.msg.user { display:flex; flex-direction:column; align-items:flex-end; animation:fadeIn .3s ease; }
.msg.assistant { animation:fadeIn .3s ease; }
.msg .msg-header { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; padding:2px 10px; border-radius:10px; margin-bottom:6px; }
.msg.user .msg-header { background:#e6f0ff; color:#165dff; }
.msg.assistant .msg-header { background:#f0f0ff; color:#722ed1; }

.msg.user .msg-content { background:linear-gradient(135deg,#4f7dff,#165dff); color:white; padding:10px 16px; border-radius:16px 16px 4px 16px; max-width:90%; word-break:break-word; font-size:13px; line-height:1.6; box-shadow:0 2px 8px rgba(22,93,255,.2); }
.msg.assistant .msg-content { background:white; border-radius:16px; padding:14px 16px; box-shadow:0 2px 8px rgba(0,0,0,.06); font-size:13px; line-height:1.7; color:#1d3a6e; word-break:break-word; border:1px solid #eef2f7; }

/* 系统消息 */
.msg.system { text-align:center; color:#8ea4c2; font-size:12px; font-style:italic; padding:8px; animation:fadeIn .3s ease; line-height:1.5; }

/* ============ Markdown 渲染 ============ */
.msg.assistant .msg-content h1,.msg.assistant .msg-content h2,.msg.assistant .msg-content h3 { margin:16px 0 8px; color:#1d3a6e; }
.msg.assistant .msg-content h1 { font-size:1.3em; border-bottom:2px solid #e5e6eb; padding-bottom:6px; }
.msg.assistant .msg-content h2 { font-size:1.15em; border-bottom:1px solid #eef2f7; padding-bottom:4px; }
.msg.assistant .msg-content h3 { font-size:1.05em; }
.msg.assistant .msg-content p { margin:6px 0; }
.msg.assistant .msg-content pre { background:#f0f4ff; border:1px solid #d6e4ff; border-radius:8px; padding:12px 14px; overflow-x:auto; font-size:13px; line-height:1.5; margin:10px 0; }
.msg.assistant .msg-content code { font-family:'Consolas','Monaco','Courier New',monospace; font-size:0.9em; background:#f0f4ff; padding:2px 6px; border-radius:4px; color:#0e4fd1; }
.msg.assistant .msg-content pre code { background:transparent; padding:0; color:inherit; }
.msg.assistant .msg-content ul,.msg.assistant .msg-content ol { margin:6px 0; padding-left:24px; }
.msg.assistant .msg-content li { margin:2px 0; }
.msg.assistant .msg-content blockquote { border-left:3px solid #165dff; padding:6px 12px; margin:8px 0; background:#f0f5ff; border-radius:0 6px 6px 0; color:#555; }
.msg.assistant .msg-content table { border-collapse:collapse; margin:8px 0; width:100%; font-size:13px; }
.msg.assistant .msg-content th,.msg.assistant .msg-content td { border:1px solid #d6e4ff; padding:6px 10px; text-align:left; }
.msg.assistant .msg-content th { background:#e6f0ff; font-weight:600; }
.msg.assistant .msg-content a { color:#165dff; }
.msg.assistant .msg-content hr { border:none; border-top:1px solid #e5e6eb; margin:12px 0; }
.msg.assistant .msg-content strong { color:#0c3fb8; }

/* ============ AI状态指示 ============ */
.ai-status { display:flex; align-items:center; gap:6px; font-size:12px; color:#8ea4c2; padding:8px 0; animation:fadeIn .3s ease; }
.ai-status .status-dot { width:6px; height:6px; background:#165dff; border-radius:50%; animation:pulse 1.5s infinite; }

/* ============ Token 用量条 ============ */
.chat-tokens { padding:4px 14px; display:flex; align-items:center; gap:6px; font-size:11px; color:#8ea4c2; border-bottom:1px solid #eef2f7; background:#f8faff; flex-shrink:0; }
.chat-tokens .token-label { font-weight:500; }
.chat-tokens .token-used { color:#165dff; font-weight:600; min-width:24px; }
.chat-tokens .token-max { color:#b0c4e0; }
.chat-tokens .token-sep { color:#d6e4ff; }
.chat-tokens .token-bar-bg { flex:1; height:4px; background:#e4ecf7; border-radius:2px; overflow:hidden; max-width:80px; }
.chat-tokens .token-bar-fill { height:100%; background:linear-gradient(90deg,#4f7dff,#165dff); border-radius:2px; transition:width .5s ease; width:0%; }
.chat-tokens .token-pct { font-weight:600; color:#165dff; min-width:32px; text-align:right; font-size:11px; }

/* ============ 空状态 ============ */
.empty-chat { display:flex; flex-direction:column; align-items:center; justify-content:center; flex:1; min-height:0; color:#b0c4e0; text-align:center; padding:24px; }
.empty-chat .empty-icon { font-size:48px; margin-bottom:12px; opacity:.6; }
.empty-chat .empty-text { font-size:14px; line-height:1.6; }
.empty-chat .empty-hint { font-size:12px; margin-top:8px; color:#c0d0e8; }

/* ============ 消息容器公用 ============ */
.chat-messages { flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:12px; background:#f8faff; }

/* ============ 动画 ============ */
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.3; } }
@keyframes fadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }

/* ============ 文件搜索结果表格按钮 ============ */
.filelist-table { width:100%; border-collapse:collapse; table-layout:auto; font-size:13px; }
.filelist-table th, .filelist-table td { border:none !important; padding:6px 8px !important; }
.filelist-table thead th { background:#f0f5ff; position:sticky; top:0; font-size:12px; font-weight:600; color:#165dff; border-bottom:2px solid #d6e4ff !important; }
.filelist-table tbody tr { border-bottom:1px solid #f0f0f0; }
.filelist-table tbody tr:hover { background:#f8faff; }
.filelist-actions { white-space:nowrap; text-align:center; }
body:not(.remote-page) .filelist-actions { white-space:nowrap; text-align:center; }
.remote-page .filelist-actions { white-space:normal; text-align:center; }
.remote-page .filelist-actions .filelist-btn { display:block; width:100%; margin:2px 0; }
.filelist-btn { display:inline-block; padding:3px 8px; border:1px solid #d6e4ff; border-radius:4px; background:white; color:#165dff; cursor:pointer; font-size:11px; transition:all .15s; margin:0 2px; user-select:none; }
.filelist-btn:hover { background:#e6f0ff; border-color:#165dff; }

/* ============ 滚动条 ============ */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#c1c5cd; border-radius:3px; }