{{define "circleplus_tieba"}}
  <div class="thm-circles">
  <div class="mod-back"><a href="/circles/{{.Data.Circle.Slug}}">← 返回 {{.Data.Circle.Name}}</a>
    {{if .Data.IsManager}}
    <a class="btn btn-ghost btn-sm" style="margin-left:10px;" href="/circles/{{.Data.Circle.Slug}}/mod">{{ico "shield"}} 吧务</a>
    {{end}}
    <a class="btn btn-ghost btn-sm" style="margin-left:10px;" href="/circles/{{.Data.Circle.Slug}}">{{ico "layout"}} 圈模式</a>
  </div>

  <header class="mod-detail-head" style="padding-bottom:14px;">
    <div class="mod-card-top" style="margin-bottom:6px;">
      <a href="/circles/{{.Data.Circle.Slug}}" class="mod-chip" style="text-decoration:none;">{{ico "compass"}} {{.Data.Circle.Name}}</a>
      <span class="pt-chip">{{ico "sliders"}} 吧模式</span>
      <span class="pt-chip">{{ico "sort"}} {{if eq .Data.Sort "hot"}}热门{{else if eq .Data.Sort "featured"}}精华{{else}}最新{{end}}</span>
      {{if .Data.MemberRole}}<span class="pt-chip">{{ico "badge"}} {{.Data.MemberRole}}</span>{{end}}
    </div>
    <h1 class="mod-detail-title" style="font-size:22px;">{{.Data.Circle.Name}} · 贴吧</h1>
    <p style="color:var(--muted);font-size:13px;margin:6px 0 0;">{{.Data.Circle.Intro}}</p>
    <div class="mod-detail-meta">
      <span>{{ico "users"}} {{.Data.Circle.Members}} 成员</span>
      <span>{{ico "file"}} {{.Data.Circle.PostCount}} 帖</span>
      {{if .Data.IsMember}}<span class="pt-chip">{{ico "check"}} 已加入</span>{{end}}
    </div>
  </header>

  {{/* 吧内搜索 + 排序切换 */}}
  <div class="mod-panel" style="padding:16px 20px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;">
    <form method="get" action="/circles/{{.Data.Circle.Slug}}/tieba" style="display:flex;gap:8px;flex:1;min-width:220px;">
      {{if .Data.Q}}<input type="hidden" name="sort" value="{{.Data.Sort}}">{{end}}
      <input type="text" name="q" value="{{.Data.Q}}" placeholder="吧内搜索：标题 / 正文关键词…" maxlength="60" style="flex:1;">
      <button class="btn btn-ghost btn-sm" type="submit">{{ico "search"}} 搜索</button>
      {{if .Data.Q}}<a class="btn btn-ghost btn-sm" href="/circles/{{.Data.Circle.Slug}}/tieba?sort={{.Data.Sort}}">{{ico "close"}} 清除</a>{{end}}
    </form>
    <div style="display:flex;gap:8px;">
      <a class="btn btn-sm {{if eq .Data.Sort "latest"}}btn-primary{{else}}btn-ghost{{end}}" href="/circles/{{.Data.Circle.Slug}}/tieba?sort=latest{{if .Data.Q}}&q={{.Data.Q}}{{end}}">最新</a>
      <a class="btn btn-sm {{if eq .Data.Sort "hot"}}btn-primary{{else}}btn-ghost{{end}}" href="/circles/{{.Data.Circle.Slug}}/tieba?sort=hot{{if .Data.Q}}&q={{.Data.Q}}{{end}}">热门</a>
      <a class="btn btn-sm {{if eq .Data.Sort "featured"}}btn-primary{{else}}btn-ghost{{end}}" href="/circles/{{.Data.Circle.Slug}}/tieba?sort=featured{{if .Data.Q}}&q={{.Data.Q}}{{end}}">精华</a>
    </div>
  </div>

  {{if .Data.Q}}
  <p style="color:var(--muted);font-size:13px;padding:10px 2px 0;">搜索「{{.Data.Q}}」共命中 {{len .Data.Posts}} 个帖子</p>
  {{end}}

  {{/* 帖子列表：置顶在最前，精华/热帖带徽标 */}}
  {{range .Data.Posts}}
  <article class="echo-card" style="margin:10px 0;">
    <div class="echo-card-body">
      <h4 class="echo-card-title">
        {{if eq .Sticky 1}}<span class="echo-pin">置顶</span>{{end}}
        {{if eq .Featured 1}}<span class="pt-chip">{{ico "spark"}} 精华</span>{{end}}
        {{if ne .Type "text"}}
        <span class="pt-chip">
          {{if eq .Type "poll"}}{{ico "check"}} 投票
          {{else if eq .Type "gallery"}}{{ico "image"}} 多图
          {{else if eq .Type "debate"}}{{ico "sliders"}} 辩论
          {{else if eq .Type "product"}}{{ico "bag"}} 商品
          {{else if eq .Type "longform"}}{{ico "file"}} 长文
          {{else if eq .Type "video"}}{{ico "camera"}} 视频
          {{end}}
        </span>
        {{end}}
        <a href="/circles/{{$.Data.Circle.Slug}}/post/{{.ID}}/tieba">{{.Title}}</a>
      </h4>
      <p style="color:var(--muted);font-size:13px;margin:6px 0;">{{.Content}}</p>
      <div class="echo-card-meta">
        <span>{{.Author}}</span>
        <span>{{dateTime .CreatedAt}}</span>
        <span>{{.ReplyCount}} 回复</span>
        <a class="btn btn-ghost btn-sm" href="/circles/{{$.Data.Circle.Slug}}/post/{{.ID}}/tieba">{{ico "chat"}} 进楼</a>
      </div>
    </div>
  </article>
  {{else}}
  <div class="empty" style="padding:40px 20px;">
    <h3>{{if .Data.Q}}没有搜到相关帖子{{else}}这里还很安静{{end}}</h3>
    <p>{{if .Data.Q}}换个关键词试试，或者看看「最新」列表。{{else}}还没有人发帖，第一个话题由你来开。{{end}}</p>
    <p><a class="btn btn-primary btn-sm" href="/circles/{{.Data.Circle.Slug}}">{{ico "edit"}} 去发一帖</a></p>
  </div>
  {{end}}

  <p style="text-align:center;color:var(--muted);font-size:12.5px;margin-top:16px;">
    楼层流由「圈吧模式」插件提供 · 圈子与贴吧共享同一份数据
  </p>
  {{template "module_meta" .}}
  </div>
{{end}}