{% extends "base.html" %}
{% block title %}IP Whitelist{% endblock %}
{% block content %}
<div class="bbs-header"><h1><i class="bi bi-shield-check"></i> IP Whitelist</h1></div>
<p class="text-muted small">Whitelisted IPs bypass all ban checks and country blocks.</p>

<form method="post" class="card p-3 mb-3">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <input type="hidden" name="action" value="add">
    <div class="row g-2">
        <div class="col-md-4">
            <label class="form-label small mb-0">IP / CIDR</label>
            <input type="text" name="cidr" class="form-control form-control-sm" placeholder="1.2.3.4 or 1.2.3.0/24" required>
        </div>
        <div class="col-md-6">
            <label class="form-label small mb-0">Note (optional)</label>
            <input type="text" name="note" class="form-control form-control-sm" placeholder="e.g. sysop home IP">
        </div>
        <div class="col-md-2 d-flex align-items-end">
            <button class="btn btn-success btn-sm w-100">Whitelist</button>
        </div>
    </div>
</form>

<table class="table table-sm">
    <thead><tr><th>CIDR</th><th>Note</th><th>Added by</th><th>When</th><th></th></tr></thead>
    <tbody>
    {% for r in rows %}
    <tr>
        <td><code>{{ r.cidr }}</code></td>
        <td><small>{{ r.note or '' }}</small></td>
        <td><small>{{ r.added_by.username if r.added_by else '?' }}</small></td>
        <td><small>{{ r.created_at|eastern('%Y-%m-%d') }}</small></td>
        <td>
            <form method="post" class="d-inline">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <input type="hidden" name="action" value="remove">
                <input type="hidden" name="whitelist_id" value="{{ r.id }}">
                <button class="btn btn-sm btn-outline-secondary">Remove</button>
            </form>
        </td>
    </tr>
    {% else %}
    <tr><td colspan="5" class="text-muted">No whitelist entries.</td></tr>
    {% endfor %}
    </tbody>
</table>
{% endblock %}
