{% extends "base.html" %}
{% block title %}Dashboard — GEO-SEO CRM{% endblock %}

{% block content %}

<!-- KPI cards -->
<div class="row g-3 mb-4">
  <div class="col-6 col-md-4 col-xl-2">
    <div class="kpi-card">
      <div class="kpi-value text-white">{{ stats.total }}</div>
      <div class="kpi-label"><i class="bi bi-people me-1"></i>Prospect</div>
    </div>
  </div>
  <div class="col-6 col-md-4 col-xl-2">
    <div class="kpi-card">
      <div class="kpi-value" style="color:var(--geo-good)">{{ stats.active }}</div>
      <div class="kpi-label"><i class="bi bi-check-circle me-1"></i>Clienti Attivi</div>
    </div>
  </div>
  <div class="col-6 col-md-4 col-xl-2">
    <div class="kpi-card">
      <div class="kpi-value" style="color:#58a6ff">{{ stats.mrr }}</div>
      <div class="kpi-label"><i class="bi bi-currency-euro me-1"></i>MRR</div>
    </div>
  </div>
  <div class="col-6 col-md-4 col-xl-2">
    <div class="kpi-card">
      <div class="kpi-value" style="color:var(--geo-poor)">{{ stats.pipeline }}</div>
      <div class="kpi-label"><i class="bi bi-funnel me-1"></i>Pipeline</div>
    </div>
  </div>
  <div class="col-6 col-md-4 col-xl-2">
    <div class="kpi-card">
      <div class="kpi-value tier-{{ stats.avg_tier }} score-num" style="font-size:1.9rem">
        {{ stats.avg_score }}<small style="font-size:1rem;color:#8b949e">/100</small>
      </div>
      <div class="kpi-label"><i class="bi bi-graph-up me-1"></i>GEO Score Medio</div>
    </div>
  </div>
</div>

<!-- Filters + sort -->
<div class="d-flex align-items-center gap-2 mb-3 flex-wrap">
  <span class="text-secondary" style="font-size:.8rem">Status:</span>
  <a href="/" class="btn btn-sm {% if not status_filter %}btn-primary{% else %}btn-outline-secondary{% endif %}">Tutti</a>
  {% for s in statuses %}
    {% set meta = s | status_meta %}
    <a href="/?status={{ s }}&sort={{ sort }}"
       class="btn btn-sm {% if status_filter == s %}btn-{{ meta.badge }}{% else %}btn-outline-secondary{% endif %}">
      {{ meta.icon }} {{ meta.label }}
    </a>
  {% endfor %}

  <div class="ms-auto d-flex align-items-center gap-2">
    <span class="text-secondary" style="font-size:.8rem">Ordina:</span>
    <a href="/?status={{ status_filter }}&sort=score"
       class="btn btn-sm {% if sort == 'score' %}btn-primary{% else %}btn-outline-secondary{% endif %}">
       Score
    </a>
    <a href="/?status={{ status_filter }}&sort=company"
       class="btn btn-sm {% if sort == 'company' %}btn-primary{% else %}btn-outline-secondary{% endif %}">
       Azienda
    </a>
    <a href="/?status={{ status_filter }}&sort=mrr"
       class="btn btn-sm {% if sort == 'mrr' %}btn-primary{% else %}btn-outline-secondary{% endif %}">
       MRR
    </a>
  </div>
</div>

<!-- Prospects table -->
{% if prospects %}
<div class="table-responsive">
  <table class="table align-middle">
    <thead>
      <tr>
        <th>Azienda</th>
        <th>Dominio</th>
        <th>Status</th>
        <th>GEO Score</th>
        <th>Audit</th>
        <th class="text-end">MRR</th>
        <th class="text-center">Proposta</th>
        <th class="text-center">PDF</th>
      </tr>
    </thead>
    <tbody>
      {% for p in prospects %}
      {% set meta = p.status | status_meta %}
      {% set tier = p.geo_score | score_tier %}
      <tr onclick="location.href='/prospect/{{ p.id }}'" class="tier-{{ tier }}">
        <td class="fw-semibold text-white">{{ p.company }}</td>
        <td class="text-secondary" style="font-size:.85rem">{{ p.domain }}</td>
        <td>
          <span class="badge bg-{{ meta.badge }}">{{ meta.icon }} {{ meta.label }}</span>
        </td>
        <td>
          <div class="score-bar-wrap tier-{{ tier }}">
            <div class="score-bar">
              <div class="score-bar-fill" style="width:{{ p.geo_score }}%"></div>
            </div>
            <span class="score-num">{{ p.geo_score }}/100</span>
          </div>
        </td>
        <td class="text-secondary" style="font-size:.83rem">{{ p.audit_date or '—' }}</td>
        <td class="text-end fw-semibold">{{ p.monthly_value | format_eur }}</td>
        <td class="text-center">
          {% if p.proposal_file %}
            <i class="bi bi-file-text text-info"></i>
          {% else %}
            <span class="text-secondary">—</span>
          {% endif %}
        </td>
        <td class="text-center" onclick="event.stopPropagation()">
          <a href="/prospect/{{ p.id }}/pdf"
             class="btn btn-sm btn-outline-danger {% if not p.proposal_file %}disabled{% endif %}"
             title="Scarica PDF">
            <i class="bi bi-file-earmark-pdf"></i>
          </a>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% else %}
<div class="text-center py-5 text-secondary">
  <i class="bi bi-inbox display-4 d-block mb-3"></i>
  Nessun prospect trovato.
  {% if status_filter %}
    <a href="/" class="d-block mt-2">Rimuovi filtro</a>
  {% endif %}
</div>
{% endif %}

{% endblock %}