{% extends "base.html" %}
{% block content %}
<div class="max-w-4xl">
<div class="card" style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;">
<div>
<h1 style="margin:0;">My Teams</h1>
<p class="text-muted" style="margin:0.25rem 0 0;">Collaborate with your team on shared forms.</p>
</div>
<a href="{{ url_for('teams.create_team_view') }}" class="btn">+ New Team</a>
</div>
{% if teams %}
<div class="grid md:grid-cols-2 gap-4">
{% for team in teams %}
<div class="card">
<div style="display:flex;justify-content:space-between;align-items:start;">
<div>
<h2 style="margin:0 0 0.25rem;">{{ team.name }}</h2>
<p class="text-muted" style="margin:0;">
<span class="badge">{{ team.role }}</span>
{% if team.tier == 'teams_plus' %}
<span class="badge badge-warning">Teams Plus</span>
{% elif team.tier == 'teams' %}
<span class="badge badge-secondary">Teams</span>
{% endif %}
</p>
</div>
<a href="{{ url_for('teams.manage_team', team_id=team.id) }}" class="btn btn-sm btn-outline">Manage</a>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="card" style="text-align:center;padding:3rem;">
<h2>No teams yet</h2>
<p class="text-muted">Create a team to collaborate on shared forms with your team members.</p>
<a href="{{ url_for('teams.create_team_view') }}" class="btn">+ Create Your First Team</a>
</div>
{% endif %}
</div>
{% endblock %}