{% extends "superadmin/base.html" %}
{% load humanize %}

{% block superadmin_content %}
<div class="flex justify-between items-center mb-6">
    <div>
        <h2 style="font-size: var(--font-size-xl); font-weight: 700;">All Platform Businesses</h2>
        <p class="text-sm text-secondary">Manage registered sellers, verify trusted businesses, and inspect sales</p>
    </div>
</div>

{% if businesses %}
<div class="grid grid--2 gap-4">
    {% for biz in businesses %}
    <div class="card card--flat">
        <div class="flex justify-between items-start mb-3">
            <div class="flex items-center gap-3">
                {% if biz.logo %}
                <img src="{{ biz.logo.url }}" alt="" style="width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid var(--color-border);">
                {% else %}
                <div style="width:48px;height:48px;border-radius:50%;background:var(--color-primary-50);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--color-primary);">
                    {{ biz.name|first }}
                </div>
                {% endif %}
                <div>
                    <h3 class="font-bold text-base mb-1" style="color:var(--color-text);">{{ biz.name }}</h3>
                    <p class="text-xs text-muted">{{ biz.phone }} &bull; {{ biz.email }}</p>
                </div>
            </div>

            <form method="post" action="{% url 'superadmin:business_toggle_verify' biz.id %}">
                {% csrf_token %}
                {% if biz.is_verified %}
                <button type="submit" class="badge badge--live" style="border:none;cursor:pointer;" title="Toggle Trusted Status">Trusted Business</button>
                {% else %}
                <button type="submit" class="badge badge--ended" style="border:none;cursor:pointer;" title="Click to verify as Trusted">Unverified</button>
                {% endif %}
            </form>
        </div>

        <div class="grid grid--3 gap-2 py-3 px-3 my-2" style="background:var(--color-bg-card);border-radius:var(--radius-md);border:1px solid var(--color-border-light);">
            <div>
                <span class="text-xs text-muted block">Sales Run</span>
                <strong class="text-sm">{{ biz.sales_count }}</strong>
            </div>
            <div>
                <span class="text-xs text-muted block">Paid Orders</span>
                <strong class="text-sm">{{ biz.orders_count }}</strong>
            </div>
            <div>
                <span class="text-xs text-muted block">Revenue</span>
                <strong class="text-sm" style="color:var(--color-primary);">GHS {{ biz.revenue|default:0|floatformat:2|intcomma }}</strong>
            </div>
        </div>

        <div class="flex justify-between items-center text-xs text-muted pt-2" style="border-top:1px solid var(--color-border-light);">
            <span>Joined {{ biz.created_at|date:"M d, Y" }}</span>
            <a href="{% url 'superadmin:business_detail' biz.id %}" class="btn btn--primary btn--sm">View Business Details &rarr;</a>
        </div>
    </div>
    {% endfor %}
</div>
{% else %}
<div class="empty-state">
    <h3 class="empty-state__title">No businesses registered</h3>
</div>
{% endif %}
{% endblock %}