@php
    $prefix = $editing ? 'edit' : 'capture';
    $restore = old('_form') === $prefix;
    $value = fn ($key, $default = '') => $restore ? old($key, $default) : ($editing ? ($selected->$key ?? $default) : $default);
@endphp
<input type="hidden" name="_form" value="{{ $prefix }}">
<label for="{{ $prefix }}-title">Título</label>
<input id="{{ $prefix }}-title" name="title" class="form-control" placeholder="¿Qué quieres anotar?" required maxlength="200" value="{{ $value('title') }}" @unless($editing) autofocus @endunless>
<div class="description-heading mt-3"><label for="{{ $prefix }}-description">Descripción <span class="muted">(opcional)</span></label></div>
@include('partials.markdown-toolbar', ['withDictation' => true])
<textarea id="{{ $prefix }}-description" class="form-control" name="description" rows="4" maxlength="20000" inputmode="text" autocapitalize="sentences" spellcheck="true" data-description>{{ $value('description') }}</textarea>
<p class="dictation-status muted" data-dictation-status role="status" aria-live="polite"></p>
<div class="fields task-fields">
    <div><label for="{{ $prefix }}-project">Tablero</label><select id="{{ $prefix }}-project" class="form-select" name="project_id">
        <option value="">Bandeja de entrada</option>
        @foreach($projects as $p)<option value="{{ $p->id }}" @selected($value('project_id', $editing ? '' : $project?->id) == $p->id)>{{ $p->name }}</option>@endforeach
    </select></div>
    <div><label for="{{ $prefix }}-type">Tipo</label><select id="{{ $prefix }}-type" class="form-select" name="type">
        @foreach(['idea' => 'Idea', 'error' => 'Error', 'mejora' => 'Mejora', 'solicitud' => 'Solicitud'] as $key => $label)<option value="{{ $key }}" @selected($value('type', 'idea') === $key)>{{ $label }}</option>@endforeach
    </select></div>
    <div><label for="{{ $prefix }}-priority">Prioridad</label><select id="{{ $prefix }}-priority" class="form-select" name="priority">
        @foreach(['normal' => 'Normal', 'baja' => 'Baja', 'alta' => 'Alta', 'urgente' => 'Urgente'] as $key => $label)<option value="{{ $key }}" @selected($value('priority', 'normal') === $key)>{{ $label }}</option>@endforeach
    </select></div>
    <div><label for="{{ $prefix }}-list">Lista</label><select id="{{ $prefix }}-list" class="form-select" name="list_id" required data-list-select>
        <option value="">Selecciona una lista</option>
        @foreach($allLists as $list)<option value="{{ $list->id }}" data-project="{{ $list->project_id }}" @selected($value('list_id') == $list->id)>{{ $list->name }}</option>@endforeach
    </select></div>
    <div><label for="{{ $prefix }}-start">Fecha de inicio</label><input id="{{ $prefix }}-start" type="date" class="form-control" name="start_date" value="{{ $value('start_date') }}"></div>
    <div><label for="{{ $prefix }}-due">Fecha límite</label><input id="{{ $prefix }}-due" type="date" class="form-control" name="due_date" value="{{ $value('due_date') }}"></div>
    <div><label for="{{ $prefix }}-time">Hora límite ({{ config('app.timezone') }})</label><input id="{{ $prefix }}-time" type="time" class="form-control" name="due_time" value="{{ $value('due_time') }}"></div>
    <div><label for="{{ $prefix }}-repeat">Repetir al completar</label><select id="{{ $prefix }}-repeat" class="form-select" name="recurrence">@foreach(['never'=>'Nunca','daily'=>'Cada día','weekly'=>'Cada semana','monthly'=>'Cada mes'] as $key=>$label)<option value="{{ $key }}" @selected($value('recurrence','never')===$key)>{{ $label }}</option>@endforeach</select></div>
    <div><label for="{{ $prefix }}-reminder">Recordatorio en Taks</label><select id="{{ $prefix }}-reminder" class="form-select" name="reminder_minutes"><option value="">Sin recordatorio</option>@foreach([0=>'A la hora límite',15=>'15 minutos antes',60=>'1 hora antes',1440=>'1 día antes',2880=>'2 días antes'] as $key=>$label)<option value="{{ $key }}" @selected($value('reminder_minutes') !== '' && $value('reminder_minutes') !== null && (string)$value('reminder_minutes') === (string)$key)>{{ $label }}</option>@endforeach</select></div>
</div>

<section class="attachment-section" data-attachments data-ready="{{ $uploadsReady ? 'true' : 'false' }}" data-existing="{{ $editing ? $attachments->count() : 0 }}" data-max-files="{{ config('attachments.max_files') }}" data-max-bytes="{{ config('attachments.max_file_kb') * 1024 }}" data-total-bytes="{{ config('attachments.max_request_kb') * 1024 }}">
    <label id="{{ $prefix }}-attachments-label">Adjuntos <span class="muted">(opcional)</span></label>
    <div class="attachment-dropzone" data-dropzone aria-labelledby="{{ $prefix }}-attachments-label">
        <div class="attachment-actions">
            <button type="button" class="btn btn-outline-secondary" data-pick-files><i class="ti tabler-paperclip" aria-hidden="true"></i> Añadir archivos</button>
            <button type="button" class="btn btn-outline-secondary camera-button" data-pick-camera><i class="ti tabler-camera" aria-hidden="true"></i> Cámara</button>
        </div>
        <input type="file" name="attachments[]" multiple accept="image/png,image/jpeg,image/webp,image/gif,application/pdf" data-file-input hidden aria-label="Seleccionar adjuntos">
        <input type="file" accept="image/png,image/jpeg,image/webp,image/gif" capture="environment" data-camera-input hidden aria-label="Tomar foto">
        <p class="muted attachment-hint">Pega una captura con <span data-paste-shortcut>Ctrl+V</span> o arrástrala aquí.</p>
        <p class="muted attachment-limits">PNG, JPG, WebP, GIF o PDF · Hasta {{ config('attachments.max_files') }} archivos por tarjeta · 10 MB por archivo</p>
    </div>
    @unless($uploadsReady)<p class="muted attachment-pending">Las subidas estarán disponibles cuando conectemos el almacenamiento.</p>@endunless
    <div class="attachment-previews" data-previews aria-live="polite"></div>
    @if($editing && $attachments->isNotEmpty())
    <div class="saved-attachments" data-saved-attachments>
        @foreach($attachments as $attachment)
        <div class="saved-attachment" data-saved-attachment data-attachment-id="{{ $attachment->id }}">
            <a href="{{ route('attachments.show', $attachment->id) }}" target="_blank" rel="noopener noreferrer" class="saved-attachment-link" title="Abrir {{ $attachment->original_name }}">
                @if(str_starts_with($attachment->mime_type, 'image/'))<img src="{{ route('attachments.show', $attachment->id) }}" alt="{{ $attachment->original_name }}" loading="lazy" data-saved-image>@else<i class="ti tabler-file-type-pdf" aria-hidden="true"></i>@endif
                <span>{{ $attachment->original_name }}<small>{{ number_format($attachment->size / 1024, 0) }} KB</small></span>
            </a>
            <button type="button" class="icon-button" data-file-name="{{ $attachment->original_name }}" data-delete-attachment="{{ url('/attachments/'.$attachment->id) }}" aria-label="Eliminar {{ $attachment->original_name }}"><i class="ti tabler-x" aria-hidden="true"></i></button>
        </div>
        @endforeach
    </div>
    @endif
</section>