{{- $isZH := eq site.Language.Lang "zh" -}}

{{- $teaserTitle    := cond $isZH "不错过每一个信号" "Never Miss a Signal" -}}
{{- $teaserSubtitle := cond $isZH "专为技术人构建。最新文章直接送达：AI 探索、开源实践与游民生活。" "Built for builders. Get new posts on AI, open source & nomad life — direct to your inbox." -}}
{{- $socialProof    := cond $isZH "1,200+ 读者同行" "Join 1,200+ readers" -}}
{{- $rssTitle       := cond $isZH "RSS 订阅" "Subscribe via RSS" -}}
{{- $rssDescription := cond $isZH "第一时间获取最新文章通知，支持所有 RSS 阅读器。" "Get the latest posts delivered right to your RSS reader." -}}
{{- $rssButtonText  := cond $isZH "打开 RSS Feed" "Open RSS Feed" -}}
{{- $rssChannelsLabel := cond $isZH "或按频道订阅" "Or subscribe by channel" -}}
{{- $rssAllLabel      := cond $isZH "全部文章" "All Posts" -}}
{{- $rssOpmlHint      := cond $isZH "OPML 一键导入全部频道" "OPML — import all channels at once" -}}
{{- $emailTitle     := cond $isZH "邮件订阅" "Email Newsletter" -}}
{{- $emailDescription := cond $isZH "新文章和月度思考将通过邮件发送给你。默认双重确认，可随时退订。" "Get new posts and monthly notes by email. Double opt-in by default, unsubscribe anytime." -}}
{{- $emailPlaceholder := "you@example.com" -}}
{{- $emailConsent   := cond $isZH "我同意接收博客更新邮件，并理解可随时取消订阅。" "I agree to receive blog update emails and understand I can unsubscribe anytime." -}}
{{- $emailTopicsLabel := cond $isZH "内容偏好" "Topics" -}}
{{- $emailStatusIdle  := cond $isZH "输入邮箱后即可订阅。" "Enter your email to subscribe." -}}
{{- $emailOpenText  := cond $isZH "打开邮件订阅" "Open email signup" -}}
{{- $backText       := cond $isZH "返回" "Back" -}}
{{- $noSpamText     := cond $isZH "绝不发垃圾邮件，随时退订。" "No spam. Unsubscribe anytime." -}}
{{- $rssAltText     := cond $isZH "RSS 订阅" "RSS" -}}

<div class="rss-subscribe-card" data-subscribe-card>

  {{/* ── TEASER (default view) ── */}}
  <div class="rss-subscribe-card__teaser" data-subscribe-teaser>

    {{/* Decorative background grid */}}
    <div class="signal-bg" aria-hidden="true"></div>

    {{/* Left column: headline + copy */}}
    <div class="signal-left">
      <div class="signal-icon-wrap" aria-hidden="true">
        <span class="signal-pulse signal-pulse--1"></span>
        <span class="signal-pulse signal-pulse--2"></span>
        <span class="signal-pulse signal-pulse--3"></span>
        <svg class="signal-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
          <path d="M4 11a9 9 0 0 1 9 9"></path>
          <path d="M4 4a16 16 0 0 1 16 16"></path>
          <circle cx="5" cy="19" r="1.5" fill="currentColor" stroke="none"></circle>
        </svg>
      </div>

      <div class="signal-copy">
        <h3 class="signal-headline">{{ $teaserTitle }}</h3>
        <p class="signal-subtitle">{{ $teaserSubtitle }}</p>
        <span class="signal-proof">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" width="12" height="12" aria-hidden="true"><path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/><path fill-rule="evenodd" d="M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216z"/><path d="M4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z"/></svg>
          {{ $socialProof }}
        </span>
      </div>
    </div>

    {{/* Right column: actions */}}
    <div class="signal-right">
      <div class="signal-actions">
        <button type="button" class="rss-subscribe-button" data-subscribe-open="email">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
            <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
            <polyline points="22,6 12,13 2,6"></polyline>
          </svg>
          {{ cond $isZH "邮件订阅" "Subscribe →" }}
        </button>
        <button type="button" class="rss-subscribe-button rss-subscribe-button--ghost" data-subscribe-open="rss">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
            <path d="M4 11a9 9 0 0 1 9 9"></path>
            <path d="M4 4a16 16 0 0 1 16 16"></path>
            <circle cx="5" cy="19" r="1"></circle>
          </svg>
          {{ $rssAltText }}
        </button>
      </div>
      <p class="signal-no-spam">{{ $noSpamText }}</p>
    </div>

  </div>{{/* end teaser */}}

  {{/* ── RSS PANEL ── */}}
  <div class="rss-subscribe-card__panel" data-subscribe-panel="rss" hidden>
    <div class="rss-subscribe-card__section">
      <div class="rss-subscribe-card__panel-head">
        <h3>{{ $rssTitle }}</h3>
        <button type="button" class="rss-subscribe-card__back" data-subscribe-back>{{ $backText }}</button>
      </div>
      <p>{{ $rssDescription }}</p>
      <a href="{{ "/index.xml" | relLangURL }}" class="rss-subscribe-button" target="_blank" rel="noopener noreferrer">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
          <path d="M4 11a9 9 0 0 1 9 9"></path>
          <path d="M4 4a16 16 0 0 1 16 16"></path>
          <circle cx="5" cy="19" r="1"></circle>
        </svg>
        {{ $rssButtonText }}
      </a>

      {{/* ── Channel list: subscribe by section + JSON Feed + OPML ── */}}
      {{- $homeJSON := (site.GetPage "/").OutputFormats.Get "JSONFeed" -}}
      {{- $homeOPML := (site.GetPage "/").OutputFormats.Get "OPML" -}}
      {{- $colors := slice "#3b82f6" "#10b981" "#a855f7" "#ec4899" "#06b6d4" "#eab308" -}}
      <div class="rss-channels" role="list">
        <p class="rss-channels__label">{{ $rssChannelsLabel }}</p>

        <div class="rss-channels__row rss-channels__row--all" role="listitem">
          <span class="rss-channels__dot" style="--ch-color: #f97316" aria-hidden="true"></span>
          <span class="rss-channels__name">{{ $rssAllLabel }}</span>
          <span class="rss-channels__formats">
            <a href="{{ "/index.xml" | relLangURL }}" class="rss-channels__chip rss-channels__chip--rss" target="_blank" rel="noopener noreferrer" aria-label="RSS — {{ $rssAllLabel }}">RSS</a>
            {{- with $homeJSON }}<a href="{{ .RelPermalink }}" class="rss-channels__chip rss-channels__chip--json" target="_blank" rel="noopener noreferrer" aria-label="JSON Feed — {{ $rssAllLabel }}">JSON</a>{{- end }}
            {{- with $homeOPML }}<a href="{{ .RelPermalink }}" class="rss-channels__chip rss-channels__chip--opml" download title="{{ $rssOpmlHint }}" aria-label="{{ $rssOpmlHint }}">OPML</a>{{- end }}
          </span>
        </div>

        {{- range $i, $section := site.Sections -}}
          {{- $rss := $section.OutputFormats.Get "RSS" -}}
          {{- $json := $section.OutputFormats.Get "JSONFeed" -}}
          {{- $title := $section.Title | default $section.Section -}}
          {{- $color := index $colors (mod $i (len $colors)) -}}
          {{- if $rss }}
        <div class="rss-channels__row" role="listitem">
          <span class="rss-channels__dot" style="--ch-color: {{ $color }}" aria-hidden="true"></span>
          <a href="{{ $section.RelPermalink }}" class="rss-channels__name rss-channels__name--link" title="{{ $title }}">{{ $title }}</a>
          <span class="rss-channels__formats">
            <a href="{{ $rss.RelPermalink }}" class="rss-channels__chip rss-channels__chip--rss" target="_blank" rel="noopener noreferrer" aria-label="RSS — {{ $title }}">RSS</a>
            {{- with $json }}<a href="{{ .RelPermalink }}" class="rss-channels__chip rss-channels__chip--json" target="_blank" rel="noopener noreferrer" aria-label="JSON Feed — {{ $title }}">JSON</a>{{- end }}
          </span>
        </div>
          {{- end -}}
        {{- end }}
      </div>
    </div>
  </div>

  {{/* ── EMAIL PANEL ── */}}
  <div class="rss-subscribe-card__panel" data-subscribe-panel="email" hidden>
    <div class="rss-subscribe-card__section">
      <div class="rss-subscribe-card__panel-head">
        <h3>{{ $emailTitle }}</h3>
        <button type="button" class="rss-subscribe-card__back" data-subscribe-back>{{ $backText }}</button>
      </div>
      <p>{{ $emailDescription }}</p>
      <form class="newsletter-form" data-newsletter-form data-language="{{ site.Language.Lang }}" data-source-type="{{ .Kind }}">

        <label class="newsletter-form__field">
          <span class="newsletter-form__label">Email</span>
          <input
            class="newsletter-form__input"
            type="email"
            name="email"
            placeholder="{{ $emailPlaceholder }}"
            autocomplete="email"
            aria-label="Email address"
            required
          >
        </label>

        <label class="newsletter-form__field">
          <span class="newsletter-form__label">{{ $emailTopicsLabel }}</span>
          <select class="newsletter-form__select" name="topic">
            <option value="general">{{ cond $isZH "全部更新" "All updates" }}</option>
            <option value="technology">{{ cond $isZH "技术" "Technology" }}</option>
            <option value="growth">{{ cond $isZH "成长" "Growth" }}</option>
            <option value="travel">{{ cond $isZH "旅行" "Travel" }}</option>
          </select>
        </label>

        <label class="newsletter-form__checkbox">
          <input type="checkbox" name="consent" value="yes" required>
          <span>{{ $emailConsent }}</span>
        </label>

        <input type="text" name="company" class="newsletter-form__honeypot" tabindex="-1" autocomplete="off" aria-hidden="true" aria-label="Do not fill this field">

        <button type="submit" class="rss-subscribe-button newsletter-form__submit">
          {{ $emailOpenText }}
        </button>

        <p class="newsletter-form__status" data-newsletter-status aria-live="polite">{{ $emailStatusIdle }}</p>

      </form>
    </div>
  </div>

</div>{{/* end .rss-subscribe-card */}}