{{ define "main" }}
<article class="max-w-3xl mx-auto px-4 py-8">
  <!-- Header -->
  <header class="mb-8">
    <!-- Breadcrumbs -->
    {{ if .Params.categories }}
    <div class="flex items-center gap-2 text-sm text-tertiary mb-4">
      {{ range .Params.categories }}
      {{ if eq . "journey" }}
      <a href="/journey/" class="hover:text-accent">旅程</a>
      {{ else if eq . "sketch" }}
      <a href="/sketch/" class="hover:text-accent">速记</a>
      {{ else if eq . "gallery" }}
      <a href="/gallery/" class="hover:text-accent">图志</a>
      {{ else if eq . "essay" }}
      <a href="/essay/" class="hover:text-accent">随笔</a>
      {{ end }}
      {{ end }}
      <span>/</span>
    </div>
    {{ end }}
    
    <!-- Title -->
    <h1 class="text-3xl md:text-4xl font-serif font-bold text-primary mb-4">
      {{ .Title }}
    </h1>
    
    {{ with .Params.subtitle }}
    <p class="text-xl text-secondary font-serif italic mb-4">{{ . }}</p>
    {{ end }}
    
    <!-- Meta -->
    <div class="flex flex-wrap items-center gap-4 text-sm text-tertiary">
      <time>📝 {{ .Date.Format "2006年1月2日" }}</time>
      {{ with .Params.reading_time }}
      <span>📖 {{ $.ReadingTime }} 分钟阅读</span>
      {{ end }}
      {{ with .Params.location }}
      <span>📍 {{ . }}</span>
      {{ end }}
      {{ with .Params.world }}
      <span>🌌 {{ . }}</span>
      {{ end }}
    </div>
    
    <!-- Tags -->
    {{ with .Params.tags }}
    <div class="flex flex-wrap gap-2 mt-4">
      {{ range . }}
      <a href="/tags/{{ . | urlize }}" class="tag">{{ . }}</a>
      {{ end }}
    </div>
    {{ end }}
  </header>
  
  <!-- Cover Image -->
  {{ with .Params.cover.image }}
  <figure class="mb-8">
    <img src="{{ . }}" alt="{{ $.Params.cover.alt }}" class="w-full rounded-lg">
    {{ with $.Params.cover.caption }}
    <figcaption class="text-center text-sm text-tertiary mt-2 italic">{{ . }}</figcaption>
    {{ end }}
  </figure>
  {{ end }}
  
  <!-- Table of Contents -->
  {{ if and .Params.toc (gt .WordCount 400) }}
  <div class="toc">
    <div class="toc-title">目录</div>
    {{ .TableOfContents }}
  </div>
  {{ end }}
  
  <!-- Content -->
  <div class="article-content">
    {{ .Content }}
  </div>
  
  <!-- Series Navigation -->
  {{ with .Params.series }}
  <div class="mt-12 p-6 bg-secondary rounded-lg border border-border">
    <h3 class="font-serif font-semibold text-primary mb-4">系列文章：{{ . }}</h3>
    {{ $series := . }}
    {{ $pages := where $.Site.RegularPages "Params.series" $series }}
    <ol class="space-y-2">
      {{ range $pages.ByParam "series_order" }}
      <li class="{{ if eq .RelPermalink $.RelPermalink }}text-accent font-medium{{ else }}text-secondary{{ end }}">
        {{ if eq .RelPermalink $.RelPermalink }}
        → {{ .Title }}
        {{ else }}
        <a href="{{ .RelPermalink }}" class="hover:text-accent">{{ .Title }}</a>
        {{ end }}
      </li>
      {{ end }}
    </ol>
  </div>
  {{ end }}
  
  <!-- Post Navigation -->
  {{ if .Site.Params.ShowPostNavLinks }}
  <nav class="mt-12 pt-8 border-t border-border">
    <div class="flex flex-col md:flex-row justify-between gap-4">
      {{ with .NextInSection }}
      <a href="{{ .RelPermalink }}" class="flex-1 p-4 bg-secondary rounded-lg hover:bg-tertiary transition-colors">
        <div class="text-xs text-tertiary mb-1">← 上一篇</div>
        <div class="font-medium text-primary">{{ .Title }}</div>
      </a>
      {{ else }}
      <div class="flex-1"></div>
      {{ end }}
      
      {{ with .PrevInSection }}
      <a href="{{ .RelPermalink }}" class="flex-1 p-4 bg-secondary rounded-lg hover:bg-tertiary transition-colors text-right">
        <div class="text-xs text-tertiary mb-1">下一篇 →</div>
        <div class="font-medium text-primary">{{ .Title }}</div>
      </a>
      {{ end }}
    </div>
  </nav>
  {{ end }}
</article>
{{ end }}