{{define "csv_upload"}}
<div class="content">
    <h3 class="submenu-header">Step 1: Upload CSV file with Job IDs</h3>
    <div>
        <label>Select CSV file with job IDs:</label>
        <input class="card-input" type="file" id="csv-file" name="csvFile" accept=".csv" required>

        <button type="button" class="btn-primary" hx-post="/process-csv" hx-target="#job-ids-container"
            hx-encoding="multipart/form-data" hx-include="#csv-file" hx-indicator="#csv-loading-indicator">
            Upload CSV
        </button>

        <div id="csv-loading-indicator" class="htmx-indicator" style="display: none;">
            <span>Processing CSV...</span>
            <div class="loading-indicator"></div>
        </div>
    </div>

    <div id="csv-preview" class="fade-me-out" style="display: none; margin-top: 1rem;">
        <h4>Detected Jobs</h4>
        <div id="csv-preview-content" class="job-list">
            <!-- Job numbers will be displayed here -->
            <p>No jobs loaded yet</p>
        </div>
    </div>
</div>
{{end}}