{% extends "base.html" %}

{% block title %}{{ service }} — Terms Cockpit{% endblock %}

{% block breadcrumb %}
<span class="breadcrumb">
  <span class="bc-sep">›</span>
  <a href="{{ url_for('views.index', repo=repo) }}">Services</a>
  <span class="bc-sep">›</span>
  <span class="bc-current">{{ service }}</span>
</span>
{% endblock %}

{% block content %}
<section class="page-header">
  <div class="page-header-row">
    <div>
      <h1>{{ service }}</h1>
      <p class="subtitle"><span id="doc-count">…</span> documents available.</p>
    </div>
    <div class="toolbar">
      <a class="btn btn-secondary btn-sm" href="{{ url_for('views.evolution', repo=repo, service=service) }}">
        📈 Evolution
      </a>
    </div>
  </div>
</section>

<div class="doc-list" id="doc-list">
  <p class="loading">Loading documents…</p>
</div>
{% endblock %}

{% block scripts %}
<script>
  document.addEventListener("DOMContentLoaded", () => {
    App.documents.init("{{ service }}", "doc-list", "doc-count");
  });
</script>
{% endblock %}