{% extends 'generic/_base.html' %}

{% block title %}Sync Configuration — {{ runner.name }}{% endblock %}

{% block content %}
<div class="row">
  <div class="col col-md-12">
    <div class="card">
      <div class="card-header d-flex justify-content-between align-items-center">
        <strong>Sync Configuration</strong>
        <a href="{% url 'plugins:netbox_zabbix_sync_plugin:sync_config_edit' pk=runner.pk %}" class="btn btn-sm btn-warning">
          <i class="mdi mdi-pencil"></i> Edit
        </a>
      </div>
      <div class="card-body">
        {% for category, items in categorized.items %}
          <h5 class="card-title mt-3">{{ category }}</h5>
          <table class="table table-hover attr-table">
            <tbody>
              {% for item in items %}
                <tr>
                  <th scope="row">{{ item.name }}</th>
                  <td>{{ item.value }}</td>
                </tr>
              {% endfor %}
            </tbody>
          </table>
          {% if not forloop.last %}<hr class="my-2">{% endif %}
        {% endfor %}

        {% if not categorized %}
          <p class="text-muted">No sync configuration found.</p>
        {% endif %}
      </div>
    </div>

    <div class="text-end my-3">
      <a href="{{ runner.get_absolute_url }}" class="btn btn-outline-secondary">
        Back to Runner
      </a>
    </div>
  </div>
</div>
{% endblock content %}