@php
    use App\Models\AdminTask;
    $today = now()->startOfDay();
    $duePill = function (AdminTask $t) use ($today) {
        if ($t->isDone()) return ['success', '<i class="fa-light fa-circle-check"></i> Done'];
        if ($t->due_at === null) return ['neutral', 'No date'];
        $d = $t->due_at->copy()->startOfDay();
        $time = $t->has_time ? ' '.$t->due_at->format('H:i') : '';
        if ($d->lt($today)) return ['coral', '<i class="fa-solid fa-circle-exclamation"></i> '.$t->due_at->format('D j M').$time];
        if ($d->eq($today)) return ['amber', 'Today'.$time];
        if ($d->eq($today->copy()->addDay())) return ['sky', 'Tomorrow'.$time];
        return ['neutral', $t->due_at->format('D j M').$time];
    };
@endphp

<x-admin.panel pad>
    <div style="display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;">
        <x-admin.eyebrow icon="fa-light fa-square-check">Tasks &amp; diary</x-admin.eyebrow>
        <button type="button" class="btn btn-ghost btn-sm" wire:click="toggleAdd"><i class="fa-light {{ $adding ? 'fa-xmark' : 'fa-plus' }}"></i> {{ $adding ? 'Cancel' : 'Add task' }}</button>
    </div>

    {{-- Quick add --}}
    @if ($adding)
        <div class="mt-1" style="border:1px solid var(--line);border-radius:var(--radius-sm);padding:.7rem;">
            <div class="fld">
                <label for="ft-title">Task <span class="req" style="color:var(--coral);">*</span></label>
                <input class="inp @error('title') inp-invalid @enderror" id="ft-title" type="text" wire:model="title" wire:keydown.enter="add" placeholder="e.g. Post jump-day pack to {{ $user->first_name ?: 'fundraiser' }}">
                @error('title')<p class="field-err"><i class="fa-solid fa-circle-xmark"></i> {{ $message }}</p>@enderror
            </div>
            <div style="display:flex;gap:.5rem;flex-wrap:wrap;align-items:flex-end;margin-top:.4rem;">
                <div class="fld" style="width:150px;"><label for="ft-date">Date</label><input class="inp" id="ft-date" type="date" wire:model="date"></div>
                <div class="fld" style="width:120px;"><label for="ft-time">Time</label><input class="inp" id="ft-time" type="time" wire:model="time"></div>
                <div class="fld" style="flex:1;min-width:150px;">
                    <label>Priority</label>
                    <div class="chipset">
                        @foreach (['low' => 'Low', 'normal' => 'Normal', 'high' => 'High'] as $k => $lbl)
                            <button type="button" class="chip-opt {{ $priority === $k ? 'on' : '' }}" wire:click="$set('priority','{{ $k }}')">{{ $lbl }}</button>
                        @endforeach
                    </div>
                </div>
                <x-admin.btn type="button" variant="navy" sm icon="fa-light fa-check" wire:click="add" wire:loading.attr="disabled" wire:target="add">Add</x-admin.btn>
            </div>
        </div>
    @endif

    {{-- Filter --}}
    <div style="display:flex;gap:.35rem;margin:.7rem 0 .2rem;">
        @foreach (['open' => 'Open', 'closed' => 'Closed', 'all' => 'All'] as $key => $label)
            <button type="button" class="fchip {{ $filter === $key ? 'on' : '' }}" wire:click="setFilter('{{ $key }}')">{{ $label }}@if ($key === 'open' && $openCount) ({{ $openCount }})@endif</button>
        @endforeach
        <a class="all" style="margin-left:auto;font-family:'Quicksand',sans-serif;font-weight:600;font-size:.78rem;" href="{{ route('admin.tasks') }}" wire:navigate>Open task board &rarr;</a>
    </div>

    {{-- List --}}
    @forelse ($tasks as $t)
        @php [$pv, $ph] = $duePill($t); @endphp
        <div class="task-row {{ $t->priorityClass() }} {{ $t->isDone() ? 'done' : '' }}" wire:key="ut-{{ $t->id }}">
            <span class="accent"></span>
            <button class="check" wire:click="toggleDone({{ $t->id }})" title="Mark {{ $t->isDone() ? 'not done' : 'done' }}"><i class="fa-solid fa-check"></i></button>
            <div class="body">
                <div class="ttl">{{ $t->title }}
                    @if ($t->isInProgress())<x-admin.pill variant="sky">In progress</x-admin.pill>@endif
                </div>
                @if ($t->details)<div class="meta">{{ \Illuminate\Support\Str::limit($t->details, 70) }}</div>@endif
            </div>
            <div class="right"><x-admin.pill :variant="$pv">{!! $ph !!}</x-admin.pill></div>
        </div>
    @empty
        <div class="skel-note" style="margin-top:.5rem;"><i class="fa-light fa-square-check"></i> No {{ $filter === 'all' ? '' : $filter }} tasks for this fundraiser.</div>
    @endforelse
</x-admin.panel>