/* =========================================================
 * Notion 风格主题（参考 stylekit.top/zh/styles/notion-style）
 * 极简文档风：米色底 #f7f6f3、文字 #37352f、细边框、小圆角、
 * 浅灰 hover(#efedea)/active(#e3e1db)、禁大圆角/渐变/重阴影/位移动画
 * 切换方式：<html data-theme="notion">，由 app.js 依用户设置写入
 * ========================================================= */

:root[data-theme="notion"] {
  --ink: #37352f;
  --paper: #f7f6f3;
  --red: #eb5757;
  --yellow: #dfab01;
  --blue: #2eaadc;
  --green: #0f7b6c;
  --shadow: none;
}

/* 系统字体栈（替代漫画字体） */
:root[data-theme="notion"] body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
:root[data-theme="notion"] ::selection { background: rgba(46, 170, 220, 0.25); }

/* ========== 顶栏 / 侧栏 ========== */
:root[data-theme="notion"] .topbar {
  border-bottom: 1px solid #e3e1db;
  background: var(--paper);
}
:root[data-theme="notion"] .logo {
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  font-size: 16px;
}
:root[data-theme="notion"] .sidebar {
  border-right: 1px solid #e3e1db;
  background: var(--paper);
  padding: 10px;
}
:root[data-theme="notion"] .main { background: #fff; }

/* ========== 会话列表项 ========== */
:root[data-theme="notion"] .conv-item {
  border: 1px solid #e3e1db;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
  margin-bottom: 4px;
  padding: 8px 10px;
  font-weight: 500;
  transition: background-color 0.15s, border-color 0.15s;
}
:root[data-theme="notion"] .conv-item:hover { transform: none; box-shadow: none; background: #efedea; }
:root[data-theme="notion"] .conv-item.active { background: #e3e1db; box-shadow: none; border-color: #d0cec7; }
:root[data-theme="notion"] .conv-item .conv-del { color: #a09f9a; opacity: 0; font-weight: 600; }
:root[data-theme="notion"] .conv-item:hover .conv-del { opacity: 1; }
:root[data-theme="notion"] .conv-item .conv-del:hover { color: var(--red); }

/* ========== 按钮 ========== */
:root[data-theme="notion"] .comic-btn,
:root[data-theme="notion"] .comic-btn-sm {
  border: 1px solid #e3e1db;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  box-shadow: none;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  padding: 7px 14px;
  transition: background-color 0.15s;
}
:root[data-theme="notion"] .comic-btn:hover,
:root[data-theme="notion"] .comic-btn-sm:hover { transform: none; box-shadow: none; background: #efedea; }
:root[data-theme="notion"] .comic-btn:active,
:root[data-theme="notion"] .comic-btn-sm:active { transform: none; background: #e3e1db; }
:root[data-theme="notion"] .comic-btn-primary,
:root[data-theme="notion"] .comic-btn-blue { background: var(--blue); border-color: var(--blue); color: #fff; }
:root[data-theme="notion"] .comic-btn-primary:hover,
:root[data-theme="notion"] .comic-btn-blue:hover { background: #1f8fc0; border-color: #1f8fc0; }
:root[data-theme="notion"] .comic-btn-yellow { background: transparent; border-color: #e3e1db; color: var(--ink); }
:root[data-theme="notion"] .comic-btn-ghost { background: transparent; box-shadow: none; }
:root[data-theme="notion"] .comic-btn-ghost:hover { transform: none; background: #efedea; box-shadow: none; }

/* ========== 输入框 ========== */
:root[data-theme="notion"] .comic-input {
  border: 1px solid #e3e1db;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
  font-weight: 400;
}
:root[data-theme="notion"] .comic-input:focus {
  box-shadow: 0 0 0 2px rgba(46, 170, 220, 0.3);
  border-color: var(--blue);
}
:root[data-theme="notion"] .comic-input::placeholder { color: #a09f9a; }

/* ========== 消息区 / 输入区 ========== */
:root[data-theme="notion"] .msg-area { background: #fff; background-image: none; }
:root[data-theme="notion"] .input-area {
  border-top: 1px solid #e3e1db;
  background: var(--paper);
}
:root[data-theme="notion"] .input-area textarea {
  border: 1px solid #e3e1db;
  border-radius: 6px;
  background: #fff;
  padding: 8px 12px;
  min-height: 40px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
:root[data-theme="notion"] .input-area textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(46, 170, 220, 0.3);
}

/* ========== 气泡 ========== */
:root[data-theme="notion"] .bubble {
  border: 1px solid #e3e1db;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}
:root[data-theme="notion"] .bubble-user {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}
:root[data-theme="notion"] .bubble-ai { background: #fff; color: var(--ink); }

/* ========== 气泡内 Markdown ========== */
:root[data-theme="notion"] .bubble-ai code {
  background: #efedea;
  color: #37352f;
  border-radius: 4px;
}
:root[data-theme="notion"] .bubble-ai pre {
  background: #f7f6f3;
  border: 1px solid #e3e1db;
  border-radius: 6px;
}
:root[data-theme="notion"] .bubble-ai pre code { background: none; color: #37352f; }
:root[data-theme="notion"] .bubble-ai th, :root[data-theme="notion"] .bubble-ai td {
  border: 1px solid #e3e1db;
}
:root[data-theme="notion"] .bubble-ai th { background: #efedea; font-weight: 600; }
:root[data-theme="notion"] .bubble-ai blockquote {
  border-left: 3px solid #d0cec7;
  color: #6f6e69;
  padding-left: 10px;
}
:root[data-theme="notion"] .bubble-ai a { color: var(--blue); }

/* ========== 空状态 ========== */
:root[data-theme="notion"] .empty-state .big { font-size: 22px; letter-spacing: 0; font-weight: 600; }
:root[data-theme="notion"] .empty-state { color: #6f6e69; }

/* ========== 用户菜单 ========== */
:root[data-theme="notion"] .user-menu-pop {
  background: #fff;
  border: 1px solid #e3e1db;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
:root[data-theme="notion"] .user-menu-pop .menu-item {
  border-bottom: 1px solid #efedea;
  font-weight: 500;
  border-radius: 4px;
  padding: 8px 10px;
}
:root[data-theme="notion"] .user-menu-pop .menu-item:hover { background: #efedea; }
:root[data-theme="notion"] .menu-email { border-bottom: 1px solid #efedea; font-weight: 400; }

/* ========== 动效：Notion 禁位移动画，全部收敛为透明度/颜色过渡 ========== */
:root[data-theme="notion"] .pop-in { animation: notion-fade 0.2s ease-out both; }
@keyframes notion-fade { from { opacity: 0; } to { opacity: 1; } }

:root[data-theme="notion"] .thinking i,
:root[data-theme="notion"] .typing i,
:root[data-theme="notion"] .td i,
:root[data-theme="notion"] .tk i {
  animation: notion-blink 1s infinite;
  transform: none;
}
@keyframes notion-blink {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 1; }
}

/* ========== 登录页也应用 Notion 化（若 html 挂了 data-theme） ========== */
:root[data-theme="notion"] .auth-card {
  border: 1px solid #e3e1db;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
:root[data-theme="notion"] .auth-tab {
  border: 1px solid #e3e1db;
  border-radius: 6px;
  font-weight: 500;
  text-transform: none;
  background: #fff;
}
:root[data-theme="notion"] .auth-tab.active { background: #efedea; box-shadow: none; }
:root[data-theme="notion"] .auth-err { border: none; border-radius: 6px; }
:root[data-theme="notion"] .auth-ok { border: none; border-radius: 6px; }
/* 背景点阵纹理 → Notion 纯色底 */
:root[data-theme="notion"] .auth-wrap.halftone {
  background-image: none;
  background: var(--paper);
}
/* "POW! 开始对话"黄色标签 → Notion 化 */
:root[data-theme="notion"] .tag {
  background: transparent;
  border: 1px solid #e3e1db;
  color: #6f6e69;
  font-weight: 500;
  padding: 2px 8px;
  transform: none;
}
/* logo 配色去漫画风（红/蓝点缀 → 单色） */
:root[data-theme="notion"] .logo .hl,
:root[data-theme="notion"] .logo .spark { color: var(--ink); }
/* 表单标签大写加粗 → Notion 常规 */
:root[data-theme="notion"] .auth-field label {
  font-weight: 500;
  text-transform: none;
  color: #6f6e69;
}