@extends('layouts.dashboard')

@section('title', 'Import customers')

@section('content')
    <div class="flex items-center justify-between mb-6 flex-wrap gap-2">
        <h1 class="font-display text-3xl">Import customers</h1>
        <a href="{{ route('dashboard.customers.index') }}" class="underline text-sm">&larr; Back to customers</a>
    </div>

    <div class="card p-6 max-w-xl space-y-4">
        <p class="text-sm text-muted">Upload a CSV or Excel file of existing customers. Nothing is written until you've checked the report on the next screen.</p>

        @error('file')
            <p class="text-sm text-status-danger">{{ $message }}</p>
        @enderror

        <form method="POST" action="{{ route('dashboard.customer-imports.upload') }}" enctype="multipart/form-data" class="space-y-4">
            @csrf
            <div>
                <label for="file" class="label block mb-1">File (CSV or Excel)</label>
                <input id="file" name="file" type="file" accept=".csv,.txt,.xlsx,.xls" class="input" required>
            </div>
            <button type="submit" class="btn btn-primary">Upload and map columns</button>
        </form>
    </div>
@endsection