{{define "partials/crew_import_results.html"}}
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 mb-6">
    <div class="stat bg-base-100 shadow-sm rounded-lg">
        <div class="stat-title">Added</div>
        <div class="stat-value text-success">{{.Added}}</div>
    </div>
    <div class="stat bg-base-100 shadow-sm rounded-lg">
        <div class="stat-title">Skipped</div>
        <div class="stat-value text-warning">{{.Skipped}}</div>
    </div>
    <div class="stat bg-base-100 shadow-sm rounded-lg">
        <div class="stat-title">Errors</div>
        <div class="stat-value text-error">{{.Errors}}</div>
    </div>
</div>

<div class="card bg-base-100 shadow-sm">
    <div class="overflow-x-auto">
        <table class="table table-zebra">
            <caption class="sr-only">Crew import results</caption>
            <thead>
                <tr>
                    <th scope="col">DID</th>
                    <th scope="col">Status</th>
                    <th scope="col">Detail</th>
                </tr>
            </thead>
            <tbody>
                {{range .Results}}
                <tr>
                    <td scope="row">
                        <div>
                            {{if .Handle}}<strong class="text-base-content">{{.Handle}}</strong><br>{{end}}
                            <code class="text-xs text-base-content/50 break-all font-mono">{{.DID}}</code>
                        </div>
                    </td>
                    <td>
                        {{if eq .Status "added"}}
                        <span class="badge badge-success badge-sm">Added</span>
                        {{else if eq .Status "skipped"}}
                        <span class="badge badge-warning badge-sm">Skipped</span>
                        {{else}}
                        <span class="badge badge-error badge-sm">Error</span>
                        {{end}}
                    </td>
                    <td class="text-sm text-base-content/70">{{.Reason}}</td>
                </tr>
                {{end}}
            </tbody>
        </table>
    </div>
</div>

<div class="flex gap-3 mt-6">
    <a href="/admin#crew" class="btn btn-primary">Done</a>
    <a href="/admin/crew/import" class="btn btn-ghost">Import another</a>
</div>
{{end}}