/*!
 * tutor-mode.css — 「🆘 卡住了 / 陪做模式」的界面（2026-10-21）
 *
 * 只有一样东西：输入框上方那一行提示
 *   「🆘 陪做模式：我不会直接给答案，会一步步提示你 [退出]」
 * 开关本身是 coach-chat-buttons.css 里的第 5 个胶囊（.coach-quick-tutor）。
 *
 * 约定（和仓库其它模块一致）：
 *   · 颜色全走 chat.css 的 CSS 变量（深色主题自动生效），变量缺失时有浅色兜底
 *   · 375 宽必须不横向滚动：flex + min-width:0 + 文字允许换行
 *   · 不做 sticky / fixed：它就在输入框上面，跟着输入区一起走
 *   · [hidden] 兜底必须带 !important（.dsh-tools/check-hidden-css.mjs 会查）
 */

.tutor-mode-hint {
  max-width: 820px;
  margin: 0 auto 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--warn, #e2683c);
  border-radius: 10px;
  background: var(--warn-soft, #fff3ec);
  color: var(--warn-strong, #c14a22);
  font-size: 12.5px;
  line-height: 1.5;
}

.tutor-mode-hint-icon {
  flex: 0 0 auto;
  font-size: 13px;
  line-height: 1;
}

.tutor-mode-hint-text {
  flex: 1 1 auto;
  min-width: 0;
  /* 窄屏时允许折行（这句是承诺，不能截成半句） */
  overflow-wrap: anywhere;
}

.tutor-mode-off {
  flex: 0 0 auto;
  padding: 2px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-family: inherit;
  font-size: 11.5px;
  line-height: 1.5;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.tutor-mode-off:hover { background: rgba(226, 104, 60, .1); }
.tutor-mode-off:focus-visible {
  outline: 2px solid var(--warn, #e2683c);
  outline-offset: 2px;
}

/* 手机上字号不再缩小（iOS 输入区附近小于 12px 会显得像失效了），
   只减内边距，保证一行放得下 */
@media (max-width: 380px) {
  .tutor-mode-hint { padding: 5px 8px; font-size: 12px; gap: 5px; }
  .tutor-mode-off { font-size: 11px; padding: 2px 7px; }
}

/* 深色主题：站点用的是 html[data-theme="dark"]（chat.css 在那里换变量），
   **不要**用 prefers-color-scheme —— 浅色模式下系统是深色会把这块弄花。
   暖色在深底上要压暗一点才不刺眼。 */
html[data-theme="dark"] .tutor-mode-hint {
  background: #3a231b;
  color: #ffb59b;
  border-color: #a4553a;
}

/* [hidden] 兜底：作者样式的 display:flex 会覆盖浏览器默认规则 */
[hidden] { display: none !important; }