{% extends "admin/base.html" %}

{% block title %}Overview · {{ fleet.name }} — cmdop admin{% endblock %}

{% block content %}
{# Plan 59 — owner / admin overview (3 rows).

   Owners and admins want to know "is MY fleet healthy and what's
   happening in it?" — not a relay-wide pro monitor. Three rows:

     Row 1: Fleet health strip — single-line summary card
     Row 2: KPI cards (3 wide) — machines / sessions / bots-24h
     Row 3: Bot activity chart + recent activity feed

   The Plan 57 system pills, LLM spend cards, llm-volume chart, and
   cross-fleet roll-up stay locked behind the server-admin gate.
#}
<div class="space-y-4" x-data="overviewOwnerPage()" x-init="load()">
  <div class="flex items-center justify-between gap-4 flex-wrap">
    <div>
      <h1 class="text-[22px] font-semibold text-ink-100 tracking-tight">
        Overview <span class="text-ink-500 font-normal">·</span>
        <span class="text-ink-200">{{ fleet.name }}</span>
      </h1>
      <p class="text-[13px] text-ink-500 mt-0.5">
        Signed in as <span class="text-ink-300">{{ member_role or 'member' }}</span>.
      </p>
    </div>
    <div class="flex items-center gap-2">
      <label class="flex items-center gap-1.5 text-[12px] text-ink-400 cursor-pointer select-none">
        <input type="checkbox" x-model="autoRefresh" @change="onAutoRefreshChange()"
               class="rounded bg-ink-900 border-white/[0.12] text-cmdop-500 focus:ring-cmdop-500 focus:ring-offset-0 w-3.5 h-3.5" />
        Auto-refresh 30s
      </label>
      <button @click="load()" class="inline-flex items-center gap-1.5 px-2.5 py-1 text-[12px] text-ink-300 hover:text-ink-100 border border-white/[0.08] hover:border-white/[0.16] rounded-md transition-colors">
        <i data-lucide="refresh-cw" class="w-3 h-3"></i>
        Refresh
      </button>
    </div>
  </div>

  {# Row 1 — single condensed fleet-health strip #}
  {% include 'admin/components/overview/_fleet_health_strip.html' %}

  {# Row 2 — 3 KPI cards (no LLM spend) #}
  {% include 'admin/components/overview/_kpi_row_owner.html' %}

  {# Row 3 — bot activity + recent activity #}
  {% include 'admin/components/overview/_owner_activity_row.html' %}
  {% include 'admin/components/overview/_activity_feed.html' %}

  {# Row 4 — Plan 61/2b W3 — Bots health card (per-channel pills).
     Below existing rows so W2 cards can land above without colliding. #}
  {% include 'admin/components/overview/_bots_health_card.html' %}
</div>

<script src="/static/admin/overview/overview_owner.js?v={{ asset_version() }}"></script>
{% endblock %}