{% import "_macros.html" as m %}
{% if active_run %}
<a class="run-banner" href="/runs/{{ active_run.id }}">
  <span class="pulse"></span>
  {%- set _kind = {'upgrade': 'Upgrade', 'downgrade': 'Downgrade'}.get(active_run.scope_kind, 'Backup') %}
  <span class="run-banner-text">
    <strong>{{ _kind }} run #{{ active_run.id }} in progress</strong>
    <span class="run-banner-sub">{{ active_run.scope_kind }}{% if active_run.scope_value %}: {{ active_run.scope_value }}{% endif %}{% if active_run.total %} · {{ active_run.total }} device{{ '' if active_run.total == 1 else 's' }}{% endif %}</span>
  </span>
  <span class="go">View live →</span>
</a>
{% endif %}

<section class="cards tight">
  {{ m.dstat('/targets', 'accent', inventory.target_count, 'Devices', 'targets') }}
  {{ m.dstat('/targets', 'ok', inventory.enabled_count, 'Enabled', 'enabled') }}
  {{ m.dstat('/groups', 'violet', inventory.groups|length, 'Groups', 'groups') }}
  {{ m.dstat('/tags', 'info', inventory.tags|length, 'Tags', 'tags') }}
  {{ m.dstat('/schedules', 'warn', schedule_count, 'Schedules', 'schedules') }}
  {{ m.dstat('/backups', 'accent', totals.sets, 'Backup sets', 'sets') }}
  {{ m.dstat('/backups', 'info', totals.files, 'Files', 'files') }}
  {{ m.dstat('/storage', 'ok', totals.size | filesize, 'Backup size', 'size') }}
</section>

<section class="dash-grid">
  <div class="card reach-card">
    <h2>{{ m.hicon('reach') }}Reachability</h2>
    <div class="reach-body{% if not (uptime and uptime.down_hosts) %} reach-centered{% endif %}">
    {% if latency_on %}
    <div class="up-head">
      <span class="up-stat up-ok">
        <svg viewBox="0 0 16 16" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="8" cy="8" r="6.4"/><path d="M5.2 8.2 7.1 10 10.9 5.9"/></svg>
        <span class="num">{{ uptime.up }}</span><span class="lbl">up</span>
      </span>
      <span class="up-stat {{ 'up-bad' if uptime.down else 'up-mut' }}">
        <svg viewBox="0 0 16 16" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="8" cy="8" r="6.4"/><path d="M5.8 5.8 10.2 10.2M10.2 5.8 5.8 10.2"/></svg>
        <span class="num">{{ uptime.down }}</span><span class="lbl">down</span>
      </span>
      {% if uptime.unknown %}<span class="up-stat up-mut"><span class="num">{{ uptime.unknown }}</span><span class="lbl">pending</span></span>{% endif %}
    </div>
    {% if uptime.down_hosts %}
    <ol class="down-list">
      {% for h in uptime.down_hosts %}
      <li><a class="mono" href="/targets/{{ h.name|urlencode }}">{{ h.name }}</a><span class="muted mono">{{ h.host }}</span></li>
      {% endfor %}
    </ol>
    {% if uptime.down_more %}<a class="muted down-more" href="/targets?enabled=offline">+{{ uptime.down_more }} more down →</a>{% endif %}
    {% else %}
    <div class="up-allgood">
      <svg viewBox="0 0 16 16" width="34" height="34" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="8" cy="8" r="6.6"/><path d="M5 8.2 7.1 10.3 11 5.7"/></svg>
      <span>All {{ uptime.up }} hosts reachable</span>
    </div>
    {% endif %}
    {% else %}<p class="muted">Latency monitoring is off — enable it under <a href="/settings">Settings</a>.</p>{% endif %}
    </div>
  </div>

  <div class="card">
    <h2>{{ m.hicon('system') }}System</h2>
    {% if metrics.disk %}{% set d = metrics.disk %}
    <div class="sys-row">
      <span class="sys-lbl">Backup volume</span>
      <meter class="usage" min="0" max="100" value="{{ d.pct }}" low="75" high="90" optimum="0"></meter>
      <span class="sys-val">{{ d.free | filesize }} free <span class="muted">/ {{ d.total | filesize }}</span></span>
    </div>
    {% endif %}
    {% if metrics.memory %}{% set mem = metrics.memory %}
    <div class="sys-row">
      <span class="sys-lbl">Memory</span>
      <meter class="usage" min="0" max="100" value="{{ mem.pct }}" low="75" high="90" optimum="0"></meter>
      <span class="sys-val">{{ mem.available | filesize }} free <span class="muted">/ {{ mem.total | filesize }}</span></span>
    </div>
    {% endif %}
    <div class="sys-row simple"><span class="sys-lbl">Load</span><span class="sys-val">{% if metrics.load %}{{ metrics.load['1'] }} · {{ metrics.load['5'] }} · {{ metrics.load['15'] }}{% else %}—{% endif %}{% if metrics.cpu_count %} <span class="muted">· {{ metrics.cpu_count }} CPU</span>{% endif %}</span></div>
    <div class="sys-row simple"><span class="sys-lbl">Destinations</span><span class="sys-val">{% for dn in destinations %}<span class="chip{% if dn.type == 'local' %} group{% endif %}" title="{{ dn.type }}">{{ dn.name }}</span>{% endfor %}</span></div>
    <div class="sys-row simple"><span class="sys-lbl">Latest backup</span><span class="sys-val">{% if totals.newest %}{{ totals.newest | datetime }}{% else %}—{% endif %}</span></div>
    {% if metrics.time %}
    <div class="sys-row simple"><span class="sys-lbl">Platform time</span><span class="sys-val"><time data-clock data-epoch="{{ metrics.time.epoch }}" data-offset="{{ metrics.time.offset }}" data-format="{{ datetime_format }}">{{ metrics.time.epoch | datetime }}</time></span></div>
    <div class="sys-row simple"><span class="sys-lbl">Timezone</span><span class="sys-val">{{ timezone_name or metrics.time.tz }}{% if metrics.time.offset %} <span class="muted">(UTC{{ metrics.time.offset }})</span>{% endif %}</span></div>
    {% endif %}
  </div>

  <div class="card">
    <h2>{{ m.hicon('health') }}Backup health</h2>
    {% if health.pips %}
    <div class="health-head">
      {% set rate = (health.ok_runs / health.total * 100) if health.total else 0 %}
      <span class="num {{ 'ok' if rate == 100 else ('bad' if rate < 80 else 'warn-fg') }}">{{ health.ok_runs }}/{{ health.total }}</span>
      <span class="lbl">recent runs fully succeeded</span>
    </div>
    <div class="pips" title="Each square is a run — newest on the right">
      {% for p in health.pips %}
      <a class="pip {{ 'pip-run' if p.running else ('pip-ok' if p.ok else 'pip-bad') }}"
         href="/runs/{{ p.id }}" title="#{{ p.id }} · {{ p.dur }}s{{ ' · running' if p.running }}{{ '' if p.ok else ' · had failures' }}"></a>
      {% endfor %}
    </div>
    <dl class="health-stats">
      <dt>Avg duration</dt><dd>{{ health.avg_dur }}s</dd>
      <dt>Last failure</dt>
      <dd>{% if health.last_fail %}<a href="/runs/{{ health.last_fail.id }}">#{{ health.last_fail.id }}</a> · {{ health.last_fail.started_at | datetime }}{% else %}<span class="ok">none</span>{% endif %}</dd>
    </dl>
    {% else %}
    <p class="muted">No runs yet.</p>
    {% endif %}
  </div>

  <div class="card">
    <h2>{{ m.hicon('latency') }}Latency</h2>
    {% if latency_on %}
    <div class="lat-cols">
      <div>
        <h3>Lowest</h3>
        {% if lat_best %}
        <ol class="lat-list">
          {% for r in lat_best %}
          <li><a class="mono" href="/targets/{{ r.name|urlencode }}">{{ r.name }}</a><span class="ok">{{ "%.1f"|format(r.rtt) }}</span></li>
          {% endfor %}
        </ol>
        {% else %}<p class="muted">No data yet.</p>{% endif %}
      </div>
      <div>
        <h3>Highest</h3>
        {% if lat_worst %}
        <ol class="lat-list">
          {% for r in lat_worst %}
          <li><a class="mono" href="/targets/{{ r.name|urlencode }}">{{ r.name }}</a><span class="{{ 'bad' if r.rtt >= 100 else 'ok' }}">{{ "%.1f"|format(r.rtt) }}</span></li>
          {% endfor %}
        </ol>
        {% else %}<p class="muted">No data yet.</p>{% endif %}
      </div>
    </div>
    {% else %}<p class="muted">Latency monitoring is off — enable it under <a href="/settings">Settings</a>.</p>{% endif %}
  </div>
</section>

<div class="card">
  <h2>{{ m.hicon('runs') }}Recent runs</h2>
  {% if recent_runs %}
  <table>
    <thead><tr><th>#</th><th>Scope</th><th>Trigger</th><th>Started</th><th>Result</th><th>Duration</th></tr></thead>
    <tbody>
    {% for run in recent_runs %}
      <tr data-href="/runs/{{ run.id }}" class="clickable">
        <td>#{{ run.id }}</td>
        <td>{{ run.scope_kind }}{% if run.scope_value %}: <span class="mono">{{ run.scope_value }}</span>{% endif %}{% if run.dry_run %} <span class="chip">dry-run</span>{% endif %}</td>
        <td>{{ run.trigger }}</td>
        <td class="mono muted">{{ run.started_at | datetime }}</td>
        <td>
          {% if run.status == 'running' %}<span class="chip running">running</span>
          {% elif run.failed and run.failed > 0 %}<span class="chip bad">{{ run.success }}/{{ run.total }}</span>
          {% else %}<span class="chip ok">{{ run.success }}/{{ run.total }}</span>{% endif %}
        </td>
        <td>{{ run.duration_s | duration }}</td>
      </tr>
    {% endfor %}
    </tbody>
  </table>
  {% else %}
  <p class="muted">There are no runs yet.</p>
  {% endif %}
</div>