/**
 * 社区壳 · composer（由 wpforo-align Phase2 发帖区拆出）
 */

/* —— 发帖区（2026-07-24 晚间彻底重做）——
   用户看了上一版截图直接否掉，原话"乱七八糟，还什么选择文件""就是一个
   白框"。上一版虽然把 TinyMCE 换成了纯 textarea，但仍然摆着"标题"输入框
   + 浏览器原生"选择文件 / 未选择任何文件 / 不超过10MB"，两眼一扫全是杂讯。
   这版目标：整个 composer 视觉上只剩"一个白框 + 占位文字 + 底下一排小图标
   + 一个发布键"，跟参考截图一致。落地方式：
   1. 标题输入框整段隐藏（不删）——wpForo 建话题服务端要求 title 必填，
      正文内容会通过 wpf-composer.js 实时镜像进这个隐藏字段；即使 JS 没
      跑，wpforo-community.php 里的 mytheme_wpforo_fill_missing_title()
      也会在服务端兜底用正文前 60 字回填 title，双保险不会发帖失败。
   2. 原生 "选择文件" label/hint 文案隐藏，只留 <input type=file> 本身
      （视觉隐藏，不是 display:none，避免部分浏览器对隐藏 file input 触发
      点击时行为不一致）；wpf-composer.js 把这个原生 <label for="wpf_file">
      节点搬进底部工具条，套上跟其它图标一样的样式，点它 = 原生标签自带的
      "打开文件选择"效果，不需要额外 JS 转发点击。
   3. 底部新增一排图标（链接 / 图片 / 数据图 / 标签），全部用内联 SVG
      （不用图标字体）——本仓库有过图标字体加载失败变乱码的教训
      （见 .cursor/rules/tinymce-wp-init-strings.mdc 同类坑），composer 里
      不能再犯。"数据图"图标先做成禁用态（wpForo 没有投票/图表能力，禁止
      装作能点却没反应）。
   4. 发布按钮默认灰底（未禁用，只是配色浅），正文有内容后 JS 加
      .is-ready 类切换成主题红——不是"预禁用不能点"，是纯视觉状态，
      真正拦截空提交靠 textarea 自带的 required/minlength 原生校验。 */
/* 整块发帖区只保留外层 section 这一道边框。
   注意：wpforo-unify.css 给 .wpf-topic-create 又画了一圈边框+内边距，
   工具条又挂在这层外面 → 视觉上就是「框中框」。这里把内层边框/间距全部扒掉。 */
#wpforo #wpforo-wrap .mytheme-wpf-composer {
  border: 1px solid var(--myt-wpf-color-line) !important;
  border-radius: 16px;
  background: #ffffff;
  padding: 14px 16px 12px !important;
  box-sizing: border-box !important;
}

/* 扒掉 unify / 插件给内层表单套的第二道框 */
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-topic-create,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-form-wrapper,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-form-wrapper.wpf-topic-create,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-topic-form-ajax-wrap,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-topic-form-extra-wrap,
#wpforo #wpforo-wrap .mytheme-wpf-composer .mytheme-wpf-composer__form,
#wpforo #wpforo-wrap .mytheme-wpf-composer form.wpforoeditor {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* 「选择论坛」——默认藏；「全部」tab 下由 wpf-composer.js 把 select 挪到
   底部工具条「发布」左侧，原顶栏整段隐藏（含已搬迁标记），不再占一行 */
.mytheme-wpf-composer .wpf-topic-forum-field,
.mytheme-wpf-composer--choose-forum .wpf-topic-forum-field,
.mytheme-wpf-composer--choose-forum .wpf-topic-forum-field.mytheme-wpf-forum-field--relocated {
  display: none !important;
}
.mytheme-wpf-composer--choose-forum .wpf-choose-forum {
  display: none !important;
}

.mytheme-wpf-composer .wpf-topic-form-wrap {
  display: flex;
  flex-direction: column;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 标题——彻底不展示，正文会实时镜像进来（见 wpf-composer.js） */
.mytheme-wpf-composer .wpf-field-name-title {
  display: none !important;
}

/* 正文：无边框无底，字直接写在外层白框里 */
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field-name-body,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field-name-body .wpf-field-wrap,
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field.wpf-field-name-body {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field-name-body textarea,
#wpforo #wpforo-wrap .mytheme-wpf-composer textarea[name="thread[body]"] {
  display: block !important;
  width: 100% !important;
  min-height: 72px !important;
  padding: 2px 0 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--myt-wpf-color-ink);
  resize: none;
  overflow: hidden;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field-name-body textarea:focus,
#wpforo #wpforo-wrap .mytheme-wpf-composer textarea[name="thread[body]"]:focus {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-field-name-body textarea::placeholder {
  color: var(--myt-wpf-color-ink-tertiary);
}

/* 附件——原生"添加文件："文案 + "不超过10MB"提示全部视觉隐藏，只留
   <input type=file> 本身（视觉隐藏而非 display:none，避免个别浏览器对
   隐藏 file input 触发选择框不生效）。真正露出来的图标按钮由
   wpf-composer.js 把原生 <label for="wpf_file"> 搬到底部工具条里生成。 */
.mytheme-wpf-composer .wpf-default-attachment {
  margin: 0 !important;
  padding: 0 !important;
}
.mytheme-wpf-composer .wpf-default-attachment > p,
.mytheme-wpf-composer .wpf-default-attachment .wpf-clear {
  display: none !important;
}
.mytheme-wpf-composer .wpf-default-attachment input[type="file"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* JS 没跑时的兜底：原生 label 还留在正文下面，至少是个能点的小字链接 */
.mytheme-wpf-composer .wpf-default-attachment label {
  display: inline-block !important;
  margin-top: 8px !important;
  font-size: 13px !important;
  color: var(--myt-wpf-color-ink-tertiary);
  cursor: pointer;
}

/* 置顶/私密/订阅——快速发帖用不上，一律不显示（正式新建话题页、
   编辑帖子等其它入口不受影响，仍完整可用）。
   注意：`.wpf-extra-fields` 这个 class 被插件复用了两处——这里精确用
   `.wpf-topic-form-wrap > .wpf-extra-fields` 只打「置顶/私密」那一份，
   不要用不带 `>` 的宽泛写法，否则会连带打掉正文框里嵌套的同名
   `.wpf-extra-fields`（那个装的是"Attach file"上传附件，是要保留的）。 */
.mytheme-wpf-composer .wpf-topic-form-wrap > .wpf-extra-fields,
.mytheme-wpf-composer .wpf-topic-sbs {
  display: none !important;
}
.mytheme-wpf-composer .wpforo-revisions-wrap {
  display: none !important;
}

/* 主题标签——默认收起，点底部「#」图标才展开（wpf-composer.js 切
   .mytheme-wpf-tags-open）。标签图标原本是图标字体 <i class="fas fa-tag">，
   一律隐藏，避免字体加载失败变乱码那个老坑再犯一次。 */
.mytheme-wpf-composer .wpf-topic-tags {
  display: none !important;
}
.mytheme-wpf-composer.mytheme-wpf-tags-open .wpf-topic-tags {
  display: block !important;
  margin: 10px 0 0 !important;
  padding-top: 10px !important;
  border-top: 1px dashed var(--myt-wpf-color-line-soft) !important;
}
.mytheme-wpf-composer .wpf-topic-tags-label {
  margin: 0 0 6px !important;
  font-size: 13px !important;
  color: var(--myt-wpf-color-ink-tertiary) !important;
}
.mytheme-wpf-composer .wpf-topic-tags-label i {
  display: none !important;
}
.mytheme-wpf-composer .wpf-tags {
  width: 100% !important;
  height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid var(--myt-wpf-color-line) !important;
  border-radius: 9999px !important;
  font-size: 13px !important;
}

/* 底部工具条挂在 .wpf-topic-form-extra-wrap 末尾（不在 ajax-wrap 里）：
   左图标 / 右「版块下拉 + 发布」。无 JS 时退回 .wpf-buttons-wrap 右对齐。 */
#wpforo #wpforo-wrap .mytheme-wpf-composer .wpf-topic-form-extra-wrap {
  display: flex !important;
  flex-direction: column !important;
}
.mytheme-wpf-composer .wpf-buttons-wrap {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--myt-wpf-color-line-soft) !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .mytheme-wpf-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin: 4px 0 0 !important;
  padding: 8px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--myt-wpf-color-line-soft) !important;
  box-sizing: border-box !important;
  min-height: 44px;
  background: transparent !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .mytheme-wpf-toolbar__icons {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .mytheme-wpf-toolbar__actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 0 !important;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer .mytheme-wpf-toolbar__forum {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* 极简版块下拉：跟「发布」同高同左右内边距；宽度由 JS 按当前选项文字收紧
   （原生 select 的 width:auto 会按最长 option 撑开，所以不能只靠 CSS）。 */
#wpforo #wpforo-wrap .mytheme-wpf-composer select.mytheme-wpf-forum-select,
#wpforo #wpforo-wrap .mytheme-wpf-composer select.wpf-topic-form-forumid {
  display: inline-block !important;
  width: auto !important;
  max-width: 160px !important;
  height: 36px !important;
  margin: 0 !important;
  /* 左 20 与发布键一致；右 20+箭头位 ≈ 发布键视觉密度 */
  padding: 0 32px 0 20px !important;
  border: 0 !important;
  border-radius: 9999px !important;
  background-color: var(--myt-wpf-color-surface-muted) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2.2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 12px 12px !important;
  color: var(--myt-wpf-color-ink-secondary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 36px !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  cursor: pointer;
  field-sizing: content;
}
.mytheme-wpf-composer .mytheme-wpf-tool {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9999px;
  background: transparent !important;
  color: var(--myt-wpf-color-ink-tertiary);
  cursor: pointer;
  line-height: 1 !important;
  vertical-align: middle;
  box-sizing: border-box !important;
}
.mytheme-wpf-composer .mytheme-wpf-tool svg {
  width: 19px;
  height: 19px;
  display: block;
}
.mytheme-wpf-composer .mytheme-wpf-tool:hover {
  background: var(--myt-wpf-color-primary-soft) !important;
  color: var(--myt-wpf-color-primary);
}
.mytheme-wpf-composer .mytheme-wpf-tool:focus-visible {
  outline: 2px solid #111111;
  outline-offset: 2px;
}
.mytheme-wpf-composer .mytheme-wpf-tool[disabled] {
  color: var(--myt-wpf-color-ink-disabled);
  cursor: not-allowed;
}
.mytheme-wpf-composer .mytheme-wpf-tool[disabled]:hover {
  background: transparent !important;
  color: var(--myt-wpf-color-ink-disabled);
}
.mytheme-wpf-composer .mytheme-wpf-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.mytheme-wpf-composer .mytheme-wpf-file-chip {
  font-size: 13px;
  color: var(--myt-wpf-color-ink-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 120px;
}
/* 发布键：固定高度 + 等同行高，彻底居中，别再贴底 */
#wpforo #wpforo-wrap .mytheme-wpf-composer input[type="submit"].wpf-button {
  display: inline-block !important;
  width: auto !important;
  min-width: 72px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 9999px !important;
  background: var(--myt-wpf-color-surface-muted) !important;
  color: var(--myt-wpf-color-ink-tertiary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 36px !important;
  text-align: center !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  cursor: pointer;
}
#wpforo #wpforo-wrap .mytheme-wpf-composer input[type="submit"].wpf-button.is-ready {
  background: var(--myt-wpf-color-primary) !important;
  color: #ffffff !important;
}
@media (prefers-reduced-motion: no-preference) {
  .mytheme-wpf-composer .mytheme-wpf-tool,
  .mytheme-wpf-composer input[type="submit"].wpf-button,
  .mytheme-wpf-composer select.mytheme-wpf-forum-select {
    transition: background-color 0.15s ease, color 0.15s ease;
  }
}
@media (max-width: 640px) {
  .mytheme-wpf-composer .mytheme-wpf-tool,
  .mytheme-wpf-composer .wpf-default-attachment label.mytheme-wpf-tool {
    width: 44px;
    height: 44px;
  }
  #wpforo #wpforo-wrap .mytheme-wpf-composer select.mytheme-wpf-forum-select,
  #wpforo #wpforo-wrap .mytheme-wpf-composer select.wpf-topic-form-forumid {
    max-width: 140px !important;
    font-size: 13px !important;
  }
}

.mytheme-wpf-composer__guest {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.mytheme-wpf-composer__guest-text {
  margin: 0;
  color: var(--myt-wpf-color-ink-secondary);
  font-size: 15px;
}
.mytheme-wpf-composer__login-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 20px;
  border-radius: 9999px;
  background: var(--myt-wpf-color-primary) !important;
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none !important;
}
.mytheme-wpf-composer__login-btn:hover {
  background: var(--myt-wpf-color-primary-hover) !important;
  color: #ffffff !important;
}

/* 插件默认把发帖表单藏了；在我们的 composer 里强制展开 */
.mytheme-wpf-composer .wpf-topic-form-extra-wrap,
.mytheme-wpf-composer .wpf-topic-create,
.mytheme-wpf-composer .wpf-form-wrapper.wpf-topic-create {
  display: block !important;
}

/* —— 信息流 —— */
/* 2026-07-24 改版（用户明确否掉「每条各自一个卡片框、卡片间留白」的样子，
   说"乱七八糟""不匹配"）：改成推特那种一条一条纯文本信息流——不再逐条画框，
   靠一条分割线把上下两条内容隔开，跟同文件里 .wpfl-4 .wpf-thread-list 用的
   是同一个模式（D7 同页 UI 统一），不要另起一套卡片视觉 */
/* 2026-07-24 补丁（真正原因）：调了三轮 padding/间距用户反馈"跟没调一样"，
   查出来是插件自带的通用重置规则 `#wpforo #wpforo-wrap li{margin:0;padding:0;border:0}`
   `#wpforo #wpforo-wrap div/a{margin:0;padding:0;border:0}`（2026 主题 style.css 里的
   经典 CSS reset，双 ID 选择器）——优先级比裸的 .mytheme-wpf-card 这种单 class 选择器高，
   不管我把 padding/border 改成多少，都会被这条 reset 悄悄压成 0，改了等于白改。
   本文件最上面 Phase2 的注释其实早就点过这个坑（wpForo 用双 ID 选择器），这里之前漏做了。
   修法：所有涉及 margin/padding/border 的规则都补上 `#wpforo #wpforo-wrap` 前缀
   + !important，跟同文件 .wpfl-4 .wpf-thread 那组的处理方式完全一致，不留死角。 */