/**
 * 弹幕页统一 UI（index + zhuotai 通用）
 * 覆盖范围：
 * - 弹幕历史 item（时间/昵称/内容）
 * - 输入区（间距/高度/触控手感，按钮本体仍由 input-button-common.css 控制）
 * - 私信浮窗（字号/间距统一到同一套基准）
 *
 * 注意：
 * - 主题色/背景色来自 theme.js 注入的 CSS 变量：--theme-primary/bg/text
 * - 这个文件应当被两页同时引入，避免两边继续分叉
 */

:root {
  --ui-primary: var(--theme-primary, #ff6699);
  --ui-bg: var(--theme-bg, #0b0b0b);
  --ui-text: var(--theme-text, #e0e0e0);

  --ui-radius: 14px;
  --ui-border: rgba(255, 255, 255, 0.14);
  --ui-surface: rgba(17, 17, 17, 0.86);
  --ui-card: rgba(255, 255, 255, 0.06);

  --ui-fs-12: clamp(12px, 3.2vw, 13px);
  --ui-fs-14: clamp(14px, 3.6vw, 15px);
  --ui-fs-16: clamp(16px, 4.0vw, 17px);
}

/* ========== 输入区（不改按钮，仅统一间距/触控） ========== */
.input-section {
  background: var(--ui-surface);
  border-top: 1px solid var(--ui-border);
  /* 收紧上下留白：包裹 3 个元素即可；底部仅保留必要安全区 */
  padding: 6px 12px;
  /* 安全区由移动端覆盖层用 bottom 处理，避免把 bar 本体“撑高” */
  padding-bottom: 6px;
  /* 键盘弹起时由 JS 注入 transform（通过 __dynCss），这里提供统一过渡 */
  transition: transform 0.18s ease-out;
}

.input-group {
  /* 关键：主站 + 桌台输入区都必须是 flex，否则昵称长时会把输入框挤到“换行” */
  display: flex;
  align-items: stretch;
  width: 100%;
  gap: 8px;
  /* 两端统一：输入区内容居中且有最大宽度（与 7272 模板一致） */
  max-width: 640px;
  margin: 0 auto;
}

/* 主输入区的 input-group 需要定位上下文（给敏感词提示/@联想等绝对定位元素使用） */
.input-group.input-group--relative {
  position: relative;
}

/* 输入区三元素的 flex 约束（主站/login-btn 与 桌台/nickname-btn 通用） */
.input-section .nickname-btn,
.input-section #login-btn,
.input-section .send-btn {
  flex: 0 0 auto;
}

.input-section .content-input {
  flex: 1 1 auto;
  min-width: 0; /* 允许在小屏下收缩，不触发布局换行 */
  resize: none;
}

/* iOS/微信：输入类强制 16px，避免系统放大 */
textarea,
input,
.content-input,
.private-message-input,
.pm-longtext-input {
  font-size: 16px !important;
}

/* 统一主输入框外观（index + zhuotai） */
.content-input {
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color: #fff;
  padding: 10px 14px;
  line-height: 1.4;
  /* 与 --dp-tap-min 对齐：输入框高度减少 2px */
  min-height: 42px;
  max-height: 34vh;
  outline: none;
}

/* 桌台长按弹出 @ 列表：禁止系统“粘贴/复制”浮层遮挡（微信/iOS 常见） */
.content-input.lp-mention-open,
.content-input.lp-mention-hold {
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  /* 不隐藏光标：长按只是弹列表，用户仍可能继续编辑 */
  caret-color: auto;
}

.content-input::placeholder {
  color: rgba(255,255,255,0.65);
}

.content-input:focus {
  border-color: var(--ui-primary);
  box-shadow: 0 0 0 2px rgba(255, 102, 153, 0.22);
}

@media (max-width: 480px) {
  /* 历史 item 的移动端收紧交给 danmu-history-common.css 统一 */
}