{% extends 'admin/layout.html.twig' %}
{% block page_title %}Zones — {{ map.name }}{% endblock %}
{% block breadcrumb %}
  <span class="sep">/</span><a href="{{ path('admin_csiwo_index') }}" class="breadcrumb-link">CSIWO</a>
  <span class="sep">/</span><a href="{{ path('admin_map_index') }}" class="breadcrumb-link">Cartes</a>
  <span class="sep">/</span><a href="{{ path('admin_map_edit', {id: map.id}) }}" class="breadcrumb-link">{{ map.name }}</a>
  <span class="sep">/</span><span class="breadcrumb-text">Zones</span>
{% endblock %}
{% block header_action %}
  <a href="{{ path('admin_map_zone_new', {mapId: map.id}) }}" class="btn btn-primary">+ Nouvelle zone</a>
{% endblock %}

{% block content %}
<div class="toolbar">
  <span class="toolbar-count">{{ zones|length }} zone{{ zones|length != 1 ? 's' }}</span>
</div>

{% set typeColors = {
  town:    '#58a6ff',
  dungeon: '#f85149',
  field:   '#3fb950',
  raid:    '#f0883e',
  event:   '#d2a53a',
  shop:    '#a371f7'
} %}

{% if zones is empty %}
  <p class="empty">Aucune zone. <a href="{{ path('admin_map_zone_new', {mapId: map.id}) }}">Créer la première →</a></p>
{% else %}
<table>
  <thead><tr>
    <th data-sort="id" data-sort-type="num">ID</th>
    <th data-sort="name">Nom</th>
    <th data-sort="slug">Slug</th>
    <th>Type</th>
    <th>Coordonnées</th>
    <th>Niveau req.</th>
    <th>Ordre</th>
    <th>Active</th>
    <th></th>
  </tr></thead>
  <tbody>
  {% for zone in zones %}
  <tr>
    <td>{{ zone.id }}</td>
    <td>{{ zone.name }}</td>
    <td><code style="font-size:.8em;color:var(--muted)">{{ zone.slug }}</code></td>
    <td>
      {% set color = typeColors[zone.type] ?? '#8b949e' %}
      <span class="badge" style="background:{{ color }}22;color:{{ color }};border:1px solid {{ color }}55">
        {{ zone.type }}
      </span>
    </td>
    <td style="font-size:.8em;color:var(--muted);white-space:nowrap">
      ({{ zone.x }}, {{ zone.y }}) {{ zone.width }}×{{ zone.height }}
    </td>
    <td>
      {% if zone.requiredLevel %}
        <span style="color:var(--accent)">Niv. {{ zone.requiredLevel }}</span>
      {% else %}
        <span class="dash">—</span>
      {% endif %}
    </td>
    <td>{{ zone.sortOrder }}</td>
    <td>
      {% if zone.active %}
        <span class="check">✓</span>
      {% else %}
        <span class="dash">—</span>
      {% endif %}
    </td>
    <td>
      <div class="actions">
        <a href="{{ path('admin_map_zone_edit', {mapId: map.id, id: zone.id}) }}" class="btn btn-sm btn-edit">Modifier</a>
        <form method="post" action="{{ path('admin_map_zone_delete', {mapId: map.id, id: zone.id}) }}"
              onsubmit="return confirm('Supprimer la zone « {{ zone.name }} » ?')">
          <button type="submit" class="btn btn-sm btn-delete">Supprimer</button>
        </form>
      </div>
    </td>
  </tr>
  {% endfor %}
  </tbody>
</table>
{% endif %}
{% endblock %}