{{define "page-header"}}
<div class="flex justify-between items-center min-h-12 mb-6">
    <h1 class="text-2xl font-bold">Import Crew Members</h1>
    <a href="/admin#crew" class="btn btn-ghost gap-2">
        {{ icon "arrow-left" "size-4" }}
        Back to Crew
    </a>
</div>
{{end}}

{{define "page-content"}}
<div class="card bg-base-100 shadow-sm">
    <div class="card-body">
        <form action="/admin/crew/import" method="POST" enctype="multipart/form-data" class="max-w-lg">
            {{ csrfInput .CSRFToken }}
            <fieldset class="fieldset mb-6">
                <label class="fieldset-label font-medium" for="crew_file">Crew Export File</label>
                <input type="file" id="crew_file" name="crew_file"
                       class="file-input file-input-bordered w-full"
                       accept=".json,application/json" required>
                <span class="fieldset-label text-base-content/50">JSON file exported from a hold admin panel (max 1 MB)</span>
            </fieldset>

            <div class="bg-base-200 rounded-lg p-4 mb-6">
                <p class="text-sm text-base-content/70">
                    {{ icon "info" "size-4 inline-block mr-1" }}
                    Existing crew members (matched by DID) will be skipped.
                    New members will be added with the role, permissions, and tier from the file.
                </p>
            </div>

            <div class="flex gap-3 mt-6">
                <button type="submit" class="btn btn-primary gap-2">
                    {{ icon "upload" "size-4" }}
                    Import
                </button>
                <a href="/admin#crew" class="btn btn-ghost">Cancel</a>
            </div>
        </form>
    </div>
</div>
{{end}}