{% extends "base.html" %}
{% block title %}Dashboard — {{ app_name }}{% endblock %}
{% block content %}
<div class="page-header">
  <h1>Welcome back, {{ current_user.first_name }}</h1>
</div>

<div class="row g-3 mb-4">
  <div class="col-6 col-md-3">
    <a href="/staff" class="stat-card">
      <i class="fa-solid fa-users stat-icon"></i>
      <div class="stat-value">{{ total_staff }}</div>
      <div class="stat-label">Staff ({{ active_staff }} active)</div>
    </a>
  </div>
  <div class="col-6 col-md-3">
    <a href="/servers" class="stat-card">
      <i class="fa-solid fa-server stat-icon"></i>
      <div class="stat-value">{{ total_servers }}</div>
      <div class="stat-label">Servers ({{ online_servers }} online)</div>
    </a>
  </div>
  <div class="col-6 col-md-3">
    <a href="/kb" class="stat-card">
      <i class="fa-solid fa-book stat-icon"></i>
      <div class="stat-value">{{ doc_count }}</div>
      <div class="stat-label">Documentation Pages</div>
    </a>
  </div>
  <div class="col-6 col-md-3">
    <a href="/incidents" class="stat-card">
      <i class="fa-solid fa-triangle-exclamation stat-icon"></i>
      <div class="stat-value">{{ open_incidents }}</div>
      <div class="stat-label">Open Incidents ({{ critical_incidents }} P1)</div>
    </a>
  </div>
  <div class="col-6 col-md-3">
    <a href="/troubleshooting" class="stat-card">
      <i class="fa-solid fa-screwdriver-wrench stat-icon"></i>
      <div class="stat-value">{{ ts_count }}</div>
      <div class="stat-label">Troubleshooting Articles</div>
    </a>
  </div>
  <div class="col-6 col-md-3">
    <a href="/sops" class="stat-card">
      <i class="fa-solid fa-list-check stat-icon"></i>
      <div class="stat-value">{{ sop_count }}</div>
      <div class="stat-label">SOPs</div>
    </a>
  </div>
</div>

<div class="row g-3">
  <div class="col-lg-4">
    <div class="card-panel mb-3">
      <h2 class="h6 mb-3">Recently Updated Documentation</h2>
      {% if recent_pages %}
        {% for p in recent_pages %}
          <div class="d-flex justify-content-between border-bottom py-2">
            <a href="/kb/books/{{ p.book.slug }}/pages/{{ p.slug }}" class="small fw-semibold text-decoration-none">{{ p.title }}</a>
            <span class="text-muted small">{{ p.updated_at.strftime('%d %b') }}</span>
          </div>
        {% endfor %}
      {% else %}<p class="text-muted small mb-0">No documentation yet.</p>{% endif %}
    </div>

    <div class="card-panel">
      <h2 class="h6 mb-3">Recently Added Servers</h2>
      {% if recent_servers %}
        {% for s in recent_servers %}
          <div class="d-flex justify-content-between border-bottom py-2">
            <a href="/servers/{{ s.id }}" class="small fw-semibold text-decoration-none">{{ s.hostname }}</a>
            <span class="status-pill badge-status-{{ s.status.value }}">{{ s.status.value }}</span>
          </div>
        {% endfor %}
      {% else %}<p class="text-muted small mb-0">No servers yet.</p>{% endif %}
    </div>
  </div>

  <div class="col-lg-4">
    <div class="card-panel">
      <h2 class="h6 mb-3">Recent Incidents</h2>
      {% if recent_incidents %}
        {% for i in recent_incidents %}
          <div class="border-bottom py-2">
            <a href="/incidents/{{ i.id }}" class="small fw-semibold text-decoration-none d-block">{{ i.incident_number }} — {{ i.title }}</a>
            <span class="status-pill badge-severity-{{ i.severity.value[:2] | lower }}">{{ i.severity.value }}</span>
            <span class="text-muted small ms-2">{{ i.status.value }}</span>
          </div>
        {% endfor %}
      {% else %}<p class="text-muted small mb-0">No incidents logged.</p>{% endif %}
    </div>
  </div>

  <div class="col-lg-4">
    <div class="card-panel">
      <h2 class="h6 mb-3">Recent Staff Activity</h2>
      {% if recent_activity %}
        {% for a in recent_activity %}
          <div class="border-bottom py-2 small">
            <strong>{{ a.username }}</strong> {{ a.action }} <span class="text-muted">{{ a.entity_type }}</span>
            <div class="text-muted" style="font-size:.72rem">{{ a.created_at.strftime('%d %b %H:%M') }}</div>
          </div>
        {% endfor %}
      {% else %}<p class="text-muted small mb-0">No activity recorded yet.</p>{% endif %}
    </div>
  </div>
</div>
{% endblock %}