@extends('layouts.app')

@section('title', 'Import Opening Leave Balances')
@section('heading', 'Import Opening Leave Balances')

@section('content')
    @include('leaves.top-submenu')

    <x-card>
        <p class="mb-4 text-sm text-slate-600">
            Upload a CSV to set opening balances for <strong>{{ $year }}</strong>.
            Columns: <code>employee_number</code> or <code>email</code>, <code>leave_type</code> (short code or name), <code>opening_balance</code>.
        </p>
        @if(empty($allowMonthlyOpeningOverride))
            <p class="mb-4 rounded-lg border border-amber-200 bg-amber-50 px-3 py-2 text-sm text-amber-800">
                Monthly accrual governance is active: opening balance cannot exceed annual entitlement for monthly leave types.
            </p>
        @endif

        <form action="{{ route('leaves.opening-balances.import.store') }}" method="POST" enctype="multipart/form-data" class="max-w-lg space-y-4">
            @csrf
            <div>
                <label class="block text-sm font-medium text-slate-700">Year</label>
                <input type="number" name="year" value="{{ old('year', $year) }}" min="2000" max="2100" class="mt-1 block w-full rounded-lg border border-slate-300 px-3 py-2" required>
                @error('year')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div>
                <label class="block text-sm font-medium text-slate-700">CSV file</label>
                <input type="file" name="file" accept=".csv,text/csv" class="mt-1 block w-full text-sm text-slate-500 file:mr-4 file:rounded-lg file:border-0 file:bg-slate-100 file:px-4 file:py-2 file:text-sm file:font-medium file:text-slate-700 hover:file:bg-slate-200" required>
                @error('file')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
            </div>
            <div class="flex gap-2">
                <x-button type="submit" variant="primary">Import</x-button>
                <a href="{{ route('leaves.opening-balances.template') }}" class="inline-flex items-center rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-200">Download template</a>
                <a href="{{ route('leaves.dashboard') }}" class="inline-flex items-center rounded-lg bg-slate-100 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-200">Cancel</a>
            </div>
        </form>
    </x-card>
@endsection