/*
 * editor-paper.css — P1.3 ② 编辑场景"随手记纸感"。
 *
 * 不动 CodeMirror 内部主题(怕跟 highlight.js / CodeMirror 模式冲突),
 * 只在外层 .editor-pane / .CodeMirror / .markdown-body 上叠纸感:
 *  - 编辑器与预览区改用米白纸感底色(用 ink-50 — 比 ink-0 多一层灰意,接近纸)
 *  - 行高从 1.8 微调到 1.75(中文友好,且不给搜索/找词造成累赘)
 *  - 标题输入框去边、放大、字重稍减
 *
 * 纯写作模式增强(已存在 body.focus-mode):
 *  - 主区居中 800px(原来是 max-width 860px)
 *  - 顶部工具栏移到屏幕外,鼠标接近顶端 80px 才回弹(滚动状态保留)
 *  - 字号从 14 → 16(中文 + 800px 宽足够)
 *  - 隐藏左侧导航(.sidebar)和右侧 chat panel
 */

/* ========== 编辑器底层"纸感" ========== */
.editor-pane,
.preview-pane {
    background: var(--bg-secondary);
}

.CodeMirror {
    /* 米色纸感:亮色用 ink-50,暗色保持原 ink-50 dark 映射 */
    background: var(--bg-secondary) !important;
    /* 行高调到 1.75,中文阅读舒适 */
    line-height: 1.75 !important;
}

[data-theme="dark"] .CodeMirror {
    background: var(--bg-secondary) !important;
}

/* 标题输入框:轻量、无边、贴 paper */
.title-input {
    /* 不再放强烈的边框;鼠标 hover 才出 1px 浅灰提示 */
    background: transparent;
}

/* ========== 纯写作模式(focus-mode)— 强化版 ========== */
body.focus-mode .editor-pane {
    /* 全屏写作:编辑框自适应屏幕宽度、居中,两边留约 5% 边距(防止贴边 + 视觉偏移)。
     * 用 90vw 让它跟随窗口宽度走;1800px 的上限只是给超宽屏 / 4K 兜底,
     * 避免单行拉得过长不利阅读。常规 1080p/1440p 下基本等于 90vw。
     *
     * 关键:resizer 拖动后会给 .editor-pane 打上 inline `flex: 0 0 <Npx>`,
     * 把分屏宽度钉死。max-width 只能"封顶"不能"撑开",所以不加这条 flex 覆盖的话,
     * focus 模式只会把那条分屏宽度居中显示(就是用户看到的"宽度没变只是居中了")。
     * 用 flex: 1 1 auto !important 盖掉 inline flex,让它在隐藏预览区后撑满到 90vw。 */
    flex: 1 1 auto !important;
    max-width: min(1800px, 90vw) !important;
    margin: 0 auto;
    padding: 24px 8px;
}

body.focus-mode .CodeMirror {
    font-size: 16px !important;
    line-height: 1.78 !important;
}

/* 隐藏左侧文档导航 */
body.focus-mode .sidebar {
    display: none !important;
}

body.focus-mode .sidebar-collapse-btn {
    display: none !important;
}

/* 纯写作模式的顶栏策略:整条 app 顶栏(标题 / 保存 / 问答 / 用户菜单 / 主题)
 * 直接收起。写作时这些都是噪音,退出有三条路兜底:右上角「按 ESC 退出」浮标、
 * ESC 键、以及编辑器工具栏里的 focusModeBtn。
 *
 * 为什么不做"鼠标够到顶端才弹回"的浮层:workspace-header-stack 是 absolute 浮层,
 * 弹出来正好盖住它下方那条编辑工具栏(.pane-header 里的 B / I / 链接 / AI 等按钮)——
 * 鼠标挪开才看得到工具栏、一够上去就被盖,交互拧巴。收掉浮层后,编辑工具栏成为
 * 唯一的顶栏,常驻可见、永不被盖。 */
body.focus-mode .workspace-header-stack {
    display: none !important;
}

/* 编辑工具栏:纯写作下它就是顶栏。sticky 顶住,内容滚动时也不丢。 */
body.focus-mode .editor-pane .pane-header {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* 退出按钮:绑在屏幕右上角小提示(由 JS 渲染) */
.focus-exit-hint {
    position: fixed;
    top: 12px;
    right: 16px;
    z-index: 70;
    padding: 6px 11px;
    border-radius: 999px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-sm);
    font-size: 12px;
    cursor: pointer;
    user-select: none;
    transition: opacity var(--motion-standard);
    opacity: 0;
    pointer-events: none;
}
body.focus-mode .focus-exit-hint {
    opacity: 1;
    pointer-events: auto;
}
.focus-exit-hint:hover {
    color: var(--text-primary);
    border-color: var(--border-color);
}
