{% extends "layouts/app.html" %}
{% from "components/card.html" import stat_card %}

{% block title %}Teams - ClaudeSavvy{% endblock %}

{% block main_content %}
<div class="space-y-8">
    <!-- Page Title and Time Filter -->
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
        <div>
            <h1 class="text-3xl font-bold text-gray-900">Teams</h1>
            <p class="mt-2 text-gray-600">Token usage analytics for Claude Code Teams feature</p>
        </div>

        {% with current_url='/api/teams', target_id='teams-content', storage_key='cs_period_teams', default_period=period|default('all') %}
            {% include 'partials/time_filter.html' %}
        {% endwith %}
    </div>

    <!-- Teams Content (HTMX Target) -->
    <div id="teams-content">
        {% include 'partials/teams_content.html' %}
    </div>
</div>
{% endblock %}