{% extends "base.html" %}
{% block title %}Admin - MikroMon{% endblock %}
{% block content %}
<div class="d-flex align-items-center justify-content-between mb-3 flex-wrap gap-2">
  <div>
    <h1 class="h3 mb-0">Admin panel</h1>
    <div class="text-muted">Administrative tools and system overview.</div>
  </div>
  <div class="d-flex gap-2">
    <a class="btn btn-outline-secondary" href="{{ url_for('admin.users') }}"><i class="fa-solid fa-users me-1"></i>Users</a>
    <a class="btn btn-outline-secondary" href="{{ url_for('admin.audit_logs') }}"><i class="fa-solid fa-list-check me-1"></i>Audit</a>
    <a class="btn btn-outline-secondary" href="{{ url_for('admin.smtp') }}"><i class="fa-solid fa-envelope me-1"></i>SMTP</a>
  </div>
</div>

<div class="row g-3">
  <div class="col-12 col-md-4">
    <div class="card shadow-sm h-100">
      <div class="card-body">
        <div class="text-muted small">Users</div>
        <div class="display-6">{{ user_count }}</div>
      </div>
    </div>
  </div>
  <div class="col-12 col-md-4">
    <div class="card shadow-sm h-100">
      <div class="card-body">
        <div class="text-muted small">Devices</div>
        <div class="display-6">{{ device_count }}</div>
      </div>
    </div>
  </div>
  <div class="col-12 col-md-4">
    <div class="card shadow-sm h-100">
      <div class="card-body">
        <div class="text-muted small">Dashboards</div>
        <div class="display-6">{{ dashboard_count }}</div>
      </div>
    </div>
  </div>
</div>
{% endblock %}