{% extends "xeolux_securitykit/base.html" %}
{% block title %}Whitelist IP{% endblock %}

{% block content %}
<div class="page-header">
  <h1>Whitelist IP</h1>
  <p>IPs et plages CIDR autorisées.</p>
</div>

<div style="display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start;">
  <div class="card">
    <table>
      <thead><tr><th>IP / CIDR</th><th>Label</th><th>Route</th><th>SecurityKit</th><th>Statut</th><th></th></tr></thead>
      <tbody>
        {% for entry in entries %}
        <tr>
          <td><code>{{ entry.ip_or_cidr }}</code></td>
          <td>{{ entry.label|default:"—" }}</td>
          <td>{{ entry.route|default:"Globale" }}</td>
          <td>{% if entry.is_securitykit_access %}<span class="badge badge-info">Oui</span>{% else %}—{% endif %}</td>
          <td>{% if entry.enabled %}<span class="badge badge-ok">Actif</span>{% else %}<span class="badge badge-warn">Inactif</span>{% endif %}</td>
          <td>
            <form method="post" action="{% url 'xeolux_securitykit:whitelist_delete' entry.pk %}">
              {% csrf_token %}
              <button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('Supprimer ?')">✕</button>
            </form>
          </td>
        </tr>
        {% empty %}
        <tr><td colspan="6" style="color: var(--text-muted);">Aucune entrée. Ajoutez une IP ci-contre.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <div class="card">
    <div class="card-title">Ajouter une IP</div>
    <form method="post">
      {% csrf_token %}
      {% for field in form %}
        <div class="form-group">
          <label>{{ field.label }}</label>
          {{ field }}
          {% if field.errors %}<ul class="errorlist">{% for e in field.errors %}<li>{{ e }}</li>{% endfor %}</ul>{% endif %}
        </div>
      {% endfor %}
      <button type="submit" class="btn btn-primary" style="width: 100%;">Ajouter</button>
    </form>
  </div>
</div>
{% endblock %}