/* AI 在线聊 显示修复 · 运行时样式
   ----------------------------------------------------------------
   修复内容：
   1. 容器高度：原 height:100vh(content-box)+内联 padding-top:88px
      导致总高=视口+88px，底部输入栏被工具栏遮挡。
      → 改 border-box + 动态视口高度(dvh / JS 兜底)。
   2. 消息区底部内边距：原内联 paddingBottom=100px+safeArea，
      造成最后一条消息与输入栏之间出现巨大空白。
      → 用 !important 覆盖内联值，改为合理间距。
   3. 欢迎页垂直居中：原内容从顶部开始堆叠，视觉重心偏低。
      → 令 chat-welcome 撑满并垂直居中。
   4. 输入栏安全区：原内联 paddingBottom=safeAreaBottom(非刘海设备=0)，
      → 用 !important 覆盖，保证底部留有呼吸空间 + 安全区。
   5. 软键盘弹起：JS 监听 visualViewport 动态调整容器高度。
   选择器带 page-chat[scope] 后代，优先级高于原单类 scoped 规则。
   其余 UI / 逻辑不动（其他不变）。 */

/* === 1. 容器高度 === */
.page-chat[data-v-3c53de4c] .chat-container[data-v-3c53de4c]{
  box-sizing: border-box;              /* 高度含 padding-top，消除 88px 溢出 */
  height: 100vh;                       /* 兜底：极旧浏览器 */
  height: 100dvh;                      /* 现代浏览器：排除浏览器 UI */
  height: var(--mh-vh, 100dvh);        /* JS 注入 innerHeight，兼容不支持 dvh 的 webview */
}

/* === 2. 消息区底部内边距（覆盖内联 100px） === */
.page-chat[data-v-3c53de4c] .chat-messages[data-v-3c53de4c]{
  padding-bottom: 1.25rem !important;  /* 覆盖内联 100px，保留合理间距 */
  -webkit-overflow-scrolling: touch;    /* iOS 平滑滚动 */
}

/* === 3. 欢迎页垂直居中 === */
.page-chat[data-v-3c53de4c] .chat-welcome[data-v-3c53de4c]{
  flex: 1;                              /* 撑满可用高度 */
  justify-content: center;              /* 垂直居中（原仅 align-items 水平居中） */
  min-height: 100%;                     /* 确保 flex:1 生效 */
}

/* === 4. 输入栏底部安全区（覆盖内联 safeAreaBottom） === */
.page-chat[data-v-3c53de4c] .chat-input-area[data-v-3c53de4c]{
  padding-bottom: calc(.5rem + env(safe-area-inset-bottom, 0px)) !important;
  padding-top: .5rem !important;        /* 统一顶部间距 */
}

/* === 5. 消息行间距优化 === */
.page-chat[data-v-3c53de4c] .message-row[data-v-3c53de4c]:last-of-type{
  margin-bottom: .5rem;                /* 最后一条消息减小底部间距 */
}

/* === 6. 消息间隔过渡动画 === */
.page-chat[data-v-3c53de4c] .message-bubble[data-v-3c53de4c]{
  animation: mh-msg-in .25s ease;
}
@keyframes mh-msg-in{
  from { opacity: 0; transform: translateY(.375rem); }
  to   { opacity: 1; transform: translateY(0); }
}

/* === 7. 输入框聚焦时输入栏提升（配合键盘） === */
.page-chat[data-v-3c53de4c].mh-keyboard-open .chat-container[data-v-3c53de4c]{
  height: var(--mh-kb-h, 50vh);         /* JS 键盘弹起时注入可视高度 */
}

/* === 8. 隐藏人格设定完整文字 === */
/* 隐藏展开后的完整设定文本容器 + 展开/收起按钮 */
.page-chat .persona-full,
.page-chat .persona-full-text,
.page-chat .persona-toggle{
  display: none !important;
}

/* === 9. 教程文档链接按钮（注入到"点击设置 Token"下方） === */
/* 与 .setup-hint 大小、圆角、边框、字号保持一致 */
.page-chat .mh-tutorial-link{
  display: flex;
  align-items: center;
  gap: .375rem;
  margin: 0 auto .75rem;
  padding: .5rem 1rem;
  background: rgba(248, 180, 200, 0.12);
  border: .03125rem dashed rgba(248, 180, 200, 0.4);
  border-radius: .75rem;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: background .2s ease;
  cursor: pointer;
  width: fit-content;
}
.page-chat .mh-tutorial-link:active{
  background: rgba(248, 180, 200, 0.25);
}
.page-chat .mh-tutorial-icon{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: #F8B4C8;
}
.page-chat .mh-tutorial-icon svg{
  width: 16px;
  height: 16px;
}
.page-chat .mh-tutorial-text{
  font-size: .8125rem;
  color: #f8b4c8;
  font-weight: 500;
  white-space: nowrap;
}
