{include file="_partials/head.tpl"}

<div class="bz-container">
  <div class="bz-page-head">
    [if {category}]
      <div class="bz-breadcrumbs"><a href="/">Главная</a> · <a href="/news">Новости</a> · <span>{category.title}</span></div>
      <h1>{category.title}</h1>
      [if {category.description}]<p>{category.description}</p>[/if]
    [else]
      <div class="bz-breadcrumbs"><a href="/">Главная</a> · <span>Новости</span></div>
      <h1>{page.title}</h1>
    [/if]
  </div>

  <div class="bz-article-layout">
    <main>
      [if {news}]
        <div class="bz-following-grid">
          [foreach var="news" as="n"]
            <article class="bz-following-card">
              <a href="{n.url}" class="bz-cover">
                [if {n.cover}]<img src="{n.cover|medium}" alt="{n.title}" loading="lazy">[/if]
              </a>
              <div class="bz-body">
                <span class="bz-tag">Article</span>
                <h3 class="bz-card-title"><a href="{n.url}">{n.title}</a></h3>
                <div class="bz-card-meta">
                  {icon name="calendar" size="14"} <span>{n.date}</span>
                </div>
                [if {n.short}]<p class="bz-card-short">{n.short}</p>[/if]
              </div>
            </article>
          [/foreach]
        </div>
        {include file="_partials/pagination.tpl"}
      [else]
        <div class="bz-empty-state">
          <div class="bz-empty-icon">{icon name="news" size="32"}</div>
          <h3>Пока ничего нет</h3>
          <p>Здесь скоро появятся новые статьи.</p>
        </div>
      [/if]
    </main>

    {include file="_partials/sidebar.tpl"}
  </div>
</div>

{include file="_partials/foot.tpl"}
