{% extends "ui/templates/base/layout.html" %}
{% block content %}
<div class="space-y-6"><div class="flex items-center justify-between"><h1 class="text-2xl font-semibold">Platform Billing Accounts</h1>{% if can_create %}<a href="/platform-billing/accounts/new" class="rounded-xl bg-brand-600 px-4 py-2 text-sm font-semibold text-white">New Account</a>{% endif %}</div>
<form method="get" class="grid gap-3 rounded-2xl border bg-white p-4 shadow-soft md:grid-cols-[1fr_220px_auto]"><input name="q" value="{{ q or '' }}" placeholder="Search account" class="rounded-xl border px-3 py-2 text-sm" /><select name="account_type" class="rounded-xl border px-3 py-2 text-sm"><option value="">All Types</option>{% for x in account_types %}<option value="{{ x }}" {% if selected_account_type==x %}selected{% endif %}>{{ x }}</option>{% endfor %}</select><button class="rounded-xl bg-slate-900 px-4 py-2 text-sm font-semibold text-white">Search</button></form>
<div class="overflow-hidden rounded-2xl border bg-white shadow-soft"><table class="min-w-full text-sm"><thead class="bg-slate-50 text-left"><tr><th class="px-4 py-3">Code</th><th class="px-4 py-3">Name</th><th class="px-4 py-3">Type</th><th class="px-4 py-3">Email</th><th class="px-4 py-3">Status</th></tr></thead><tbody class="divide-y">{% for row in rows %}<tr><td class="px-4 py-3 font-medium">{{ row.account_code }}</td><td class="px-4 py-3">{{ row.display_name }}</td><td class="px-4 py-3">{{ row.account_type }}</td><td class="px-4 py-3">{{ row.email or '-' }}</td><td class="px-4 py-3">{{ row.status }}</td></tr>{% else %}<tr><td colspan="5" class="px-4 py-8 text-center text-slate-500">No billing accounts found.</td></tr>{% endfor %}</tbody></table></div></div>
{% endblock %}