/* 桌面端工作区 v8.2 — 面板内容样式
 *
 * 🍞 面包屑:
 *   @COUPLED public/chat.html, desktop/renderer/chat.html
 *   @WHY 2026-07-11: P1-1 硬编码色→tokens（原 0% 令牌化→~50% 覆盖）+ P2-1 px→rem
 * ======================================== */

/* 步骤内容（兼容旧 tbp-ws- 前缀，服务端推送使用） */
.tbp-ws-step{margin-bottom:8px}
.tbp-ws-step-label{font-size:0.6875rem;color:var(--tbp-fg-subdued);margin-bottom:4px}
.tbp-ws-thumb{
  width:100%;border-radius:6px;border:1px solid #374151;
  cursor:zoom-in;max-height:200px;object-fit:scale-down;background:#000;
}
.tbp-ws-thumb.expanded{max-height:none;cursor:zoom-out}
.tbp-ws-placeholder{color:var(--tbp-text-dim);font-size:13px;text-align:center;padding:48px 16px}

/* 新 ws- 前缀别名（供 workspace-panel.js 使用） */
.tbp-ws-step.ws-step,.ws-step{margin-bottom:8px}
.ws-step-label{font-size:0.6875rem;color:var(--tbp-fg-subdued);margin-bottom:4px}
.ws-thumb{
  width:100%;border-radius:6px;border:1px solid #374151;
  cursor:zoom-in;max-height:200px;object-fit:scale-down;background:#000;
}
.ws-thumb.expanded{max-height:none;cursor:zoom-out}

/* 桌面模式 — 控制提示栏 */
.ws-desktop-controls{
  padding:10px 12px;background:rgba(59,130,246,0.08);
  border-bottom:1px solid rgba(59,130,246,0.15);text-align:center;
}
.ws-hint{font-size:12px;color:#60a5fa;line-height:1.5}
.ws-desktop-screenshots{flex:1;overflow-y:auto}

/* 桌面 Tab — 截图画布 */
.ws-desktop-canvas-wrap{
  flex:1;position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:#000;
}
#wsDesktopCanvas{
  max-width:100%;max-height:100%;object-fit:contain;
}
.ws-desktop-empty{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--tbp-text-dim);font-size:14px;pointer-events:none;
}

/* 桌面 Tab — 底部工具栏 */
.ws-desktop-toolbar{
  display:flex;gap:6px;padding:8px 12px;flex-shrink:0;
  background:var(--tbp-bg-secondary);border-top:1px solid var(--tbp-border-strong);
  align-items:center;flex-wrap:wrap;
}
.ws-dt-btn{
  padding:5px 12px;border:1px solid var(--tbp-border-strong);border-radius:6px;
  background:#252836;color:var(--tbp-text-secondary);font-size:12px;
  cursor:pointer;transition:all .15s;white-space:nowrap;
}
.ws-dt-btn:hover{
  background:var(--tbp-accent);border-color:var(--tbp-accent);color:#fff;
}
.ws-dt-btn:active{transform:scale(.95)}

/* 快捷键按钮 — 更紧凑 */
.ws-dt-btn-key{
  padding:5px 8px;font-size:0.6875rem;min-width:28px;text-align:center;
}

/* 分隔线 */
.ws-dt-sep{
  width:1px;height:20px;background:var(--tbp-border-strong);margin:0 4px;
}

/* 内联输入框 */
.ws-dt-inline-input{
  display:flex;gap:4px;align-items:center;flex:1;min-width:120px;max-width:220px;
}
.ws-dt-inline-input input{
  flex:1;padding:4px 8px;border:1px solid var(--tbp-border-strong);border-radius:6px;
  background:#11141c;color:var(--tbp-fg-bright);font-size:12px;outline:none;
  min-width:0;
}
.ws-dt-inline-input input:focus{
  border-color:var(--tbp-accent);
}
.ws-dt-inline-input button{
  padding:4px 10px;border:1px solid var(--tbp-accent);border-radius:6px;
  background:var(--tbp-accent);color:#fff;font-size:12px;cursor:pointer;
  white-space:nowrap;
}
.ws-dt-inline-input button:hover{
  background:#7c8cf0;border-color:#7c8cf0;
}

/* 状态文字 */
.ws-dt-status{
  font-size:0.6875rem;color:var(--tbp-accent);margin-left:auto;white-space:nowrap;
}
