/* WeClaw :: weclaw.css — 编辑面板 + 语音播放状态条 + toast
 * 自有模块（非上游资产），UPSTREAM.md 登记为 assets/weclaw/ 定制点。
 * 复用 base.css 主题变量（--surface/--text-1/--accent/--border 等），
 * 仿 .notes-overlay/.overview 模式。
 */

/* ================= EDITOR PANEL (E 键) ================= */
.weclaw-editor{
  position:fixed;top:0;right:0;width:320px;height:100vh;
  background:var(--surface);border-left:1px solid var(--border);
  box-shadow:var(--shadow-lg);z-index:60;
  transform:translateX(100%);transition:transform .3s var(--ease);
  overflow-y:auto;padding:20px 24px;
  font-family:var(--font-sans);color:var(--text-1);
}
.weclaw-editor.open{transform:translateX(0)}

.weclaw-editor h3{
  font-size:18px;font-weight:700;margin:0 0 16px;
  padding-bottom:12px;border-bottom:1px solid var(--border);
}
.weclaw-editor .section-label{
  font-size:12px;font-weight:600;color:var(--text-3);
  letter-spacing:.08em;text-transform:uppercase;margin:18px 0 8px;
}
.weclaw-editor .control-row{margin-bottom:14px}
.weclaw-editor label{display:block;font-size:13px;color:var(--text-2);margin-bottom:4px}
.weclaw-editor input[type="range"]{width:100%;accent-color:var(--accent)}
.weclaw-editor .value-tag{
  display:inline-block;font-size:12px;font-weight:600;
  color:var(--accent);min-width:36px;text-align:right;
}
.weclaw-editor input[type="text"]{
  width:100%;padding:6px 10px;font-size:13px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--bg);color:var(--text-1);
}
.weclaw-editor input[type="text"]:focus{outline:2px solid var(--accent);outline-offset:-1px}
/* W11: 页面内容编辑控件（textarea/select 与既有 input 风格一致） */
.weclaw-editor textarea,.weclaw-editor select{
  width:100%;padding:6px 10px;font-size:13px;
border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--bg);color:var(--text-1);
  font-family:inherit;box-sizing:border-box;
}
.weclaw-editor textarea{resize:vertical;min-height:56px;line-height:1.5}
.weclaw-editor textarea:focus,.weclaw-editor select:focus{outline:2px solid var(--accent);outline-offset:-1px}
.weclaw-editor .radio-group{display:flex;gap:12px;margin-bottom:8px}
.weclaw-editor .radio-group label{
  display:flex;align-items:center;gap:4px;font-size:13px;
  cursor:pointer;margin:0;
}
.weclaw-editor .checkbox-row{
  display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-2);
}
.weclaw-editor .btn-row{display:flex;gap:8px;margin-top:20px}
.weclaw-editor button{
  flex:1;padding:8px 12px;font-size:13px;font-weight:600;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--text-1);cursor:pointer;
  transition:background .2s var(--ease);
}
.weclaw-editor button:hover{background:var(--surface-2)}
.weclaw-editor button.primary{
  background:var(--accent);color:#fff;border-color:var(--accent);
}
.weclaw-editor button.primary:hover{opacity:.9}
.weclaw-editor button.danger{color:var(--bad)}
.weclaw-editor .file-btn{
  display:inline-block;padding:4px 10px;font-size:12px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--surface-2);cursor:pointer;margin-top:4px;
}
.weclaw-editor .hint{font-size:11px;color:var(--text-3);margin-top:4px;line-height:1.4}

/* ================= NARRATION STATUS BAR (P 键) ================= */
.weclaw-narration-bar{
  position:fixed;bottom:0;left:0;right:0;height:52px;
  background:rgba(20,22,30,.95);color:#e8ebf4;z-index:55;
  display:flex;align-items:center;gap:16px;padding:0 24px;
  font-family:var(--font-sans);font-size:13px;
  transform:translateY(100%);transition:transform .3s var(--ease);
}
.weclaw-narration-bar.visible{transform:translateY(0)}
.weclaw-narration-bar .play-btn{
  width:32px;height:32px;border-radius:50%;border:none;
  background:var(--accent);color:#fff;font-size:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.weclaw-narration-bar .page-info{
  font-weight:600;min-width:56px;flex-shrink:0;
}
.weclaw-narration-bar .progress-wrap{
  flex:1;height:4px;background:rgba(255,255,255,.15);border-radius:2px;overflow:hidden;
}
.weclaw-narration-bar .progress-fill{
  height:100%;width:0;background:var(--accent);transition:width .1s linear;
}
.weclaw-narration-bar .status-text{
  font-size:12px;color:rgba(255,255,255,.6);min-width:80px;flex-shrink:0;
}
.weclaw-narration-bar .close-btn{
  background:none;border:none;color:rgba(255,255,255,.5);font-size:18px;
  cursor:pointer;padding:4px 8px;flex-shrink:0;
}
.weclaw-narration-bar .close-btn:hover{color:#fff}

/* ================= TOAST ================= */
.weclaw-toast{
  position:fixed;top:20px;left:50%;transform:translateX(-50%) translateY(-100%);
  background:rgba(20,22,30,.92);color:#e8ebf4;padding:10px 24px;
  border-radius:var(--radius-sm);font-size:13px;z-index:70;
  opacity:0;transition:transform .3s var(--ease),opacity .3s var(--ease);
  pointer-events:none;max-width:80vw;text-align:center;
}
.weclaw-toast.show{transform:translateX(-50%) translateY(0);opacity:1}

/* ================= PRINT (hide weclaw chrome) ================= */
@media print{
  .weclaw-editor,.weclaw-narration-bar,.weclaw-toast{display:none!important}
}