@extends('layouts.app')

@section('title', 'Checklist de Matrimonio')

@section('content')
@php
    $isPlanner = auth()->check() && auth()->user()->role === 'planner';

    // Si es planner, vuelves al detalle del matrimonio (o cámbialo a plannerpro.dashboard si prefieres)
    $routeDashboard = $isPlanner
        ? route('plannerpro.matrimonios.show', $matrimonio)
        : route('planner.dashboard');

    $routeToggle = function($task) use ($isPlanner, $matrimonio) {
        return $isPlanner
            ? route('plannerpro.tareas.toggle', [$matrimonio, $task])
            : route('planner.tareas.toggle', $task);
    };

    $routeDestroy = function($task) use ($isPlanner, $matrimonio) {
        return $isPlanner
            ? route('plannerpro.tareas.destroy', [$matrimonio, $task])
            : route('planner.tareas.destroy', $task);
    };

    $routeStore = $isPlanner
        ? route('plannerpro.tareas.store', $matrimonio)
        : route('planner.tareas.store');
@endphp


<div class="container py-4">

    <div class="d-flex justify-content-between align-items-center mb-3">
        <div>
            <h1 class="h3 mb-1">Checklist de tu matrimonio</h1>
            <p class="text-muted mb-0">
                Marca lo que ya tienen listo y agrega tareas personalizadas según sus necesidades.
            </p>
            @if($isPlanner)
                <div class="small text-muted mt-1">
                    <strong>Modo Wedding Planner:</strong> gestionando el matrimonio de
                    <span class="fw-semibold">{{ $matrimonio->nombre_pareja ?? 'Pareja' }}</span>
                </div>
            @endif
        </div>

        <a href="{{ $routeDashboard }}" class="btn btn-outline-secondary">
            Volver
        </a>
    </div>

    @if(session('success'))
        <div class="alert alert-success mb-3">
            {{ session('success') }}
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger mb-3">
            {{ session('error') }}
        </div>
    @endif

    {{-- Listado de tareas agrupadas por meses_antes --}}
    @forelse($tasks as $mesesAntes => $grupo)
        <div class="mb-4">
            <h2 class="h5 mb-3">
                @if($mesesAntes === 0)
                    Semana del matrimonio
                @elseif($mesesAntes === 1)
                    1 mes antes
                @elseif($mesesAntes > 1)
                    {{ $mesesAntes }} meses antes
                @else
                    Checklist general
                @endif
            </h2>

            <div class="list-group">
                @foreach($grupo as $task)
                    <div class="list-group-item d-flex justify-content-between align-items-start">
                        <div class="d-flex">
                            <form action="{{ $routeToggle($task) }}" method="POST" class="me-3">
                                @csrf
                                <button type="submit"
                                        class="btn btn-sm {{ $task->esta_completada ? 'btn-success' : 'btn-outline-secondary' }}">
                                    ✓
                                </button>
                            </form>

                            <div>
                                <div class="{{ $task->esta_completada ? 'text-decoration-line-through text-muted' : '' }}">
                                    <strong>{{ $task->titulo }}</strong>

                                    @if($task->categoria)
                                        <span class="badge bg-light text-muted border ms-1">
                                            {{ ucfirst($task->categoria) }}
                                        </span>
                                    @endif

                                    @if($task->es_personalizada)
                                        <span class="badge bg-primary ms-1">Personalizada</span>
                                    @endif
                                </div>

                                @if($task->descripcion)
                                    <div class="small text-muted mt-1">
                                        {{ $task->descripcion }}
                                    </div>
                                @endif

                                @if($task->fecha_limite)
                                    <div class="small text-muted mt-1">
                                        Fecha límite: {{ $task->fecha_limite->format('d/m/Y') }}
                                    </div>
                                @endif
                            </div>
                        </div>

                        {{-- Botón eliminar (solo personalizadas) --}}
                        @if($task->es_personalizada)
                            <form action="{{ $routeDestroy($task) }}" method="POST"
                                  onsubmit="return confirm('¿Seguro que quieres eliminar esta tarea?');">
                                @csrf
                                @method('DELETE')
                                <button class="btn btn-sm btn-outline-danger">
                                    Eliminar
                                </button>
                            </form>
                        @endif
                    </div>
                @endforeach
            </div>
        </div>
    @empty
        <p class="text-muted">Aún no tienes tareas cargadas.</p>
    @endforelse

    {{-- Formulario para agregar tarea personalizada --}}
    <div class="card mt-4 shadow-sm">
        <div class="card-body">
            <h2 class="h5 mb-3">Agregar tarea personalizada</h2>

            <form action="{{ $routeStore }}" method="POST">
                @csrf

                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label">Título de la tarea</label>
                        <input type="text"
                               name="titulo"
                               class="form-control @error('titulo') is-invalid @enderror"
                               value="{{ old('titulo') }}"
                               placeholder="Ej: Reunión con la mamá para revisar detalles">
                        @error('titulo')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-3">
                        <label class="form-label">Meses antes</label>
                        <input type="number"
                               name="meses_antes"
                               class="form-control @error('meses_antes') is-invalid @enderror"
                               value="{{ old('meses_antes') }}"
                               placeholder="Ej: 3">
                        @error('meses_antes')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                        <small class="text-muted">Usa 0 para semana del matrimonio.</small>
                    </div>

                    <div class="col-md-3">
                        <label class="form-label">Fecha límite (opcional)</label>
                        <input type="date"
                               name="fecha_limite"
                               class="form-control @error('fecha_limite') is-invalid @enderror"
                               value="{{ old('fecha_limite') }}">
                        @error('fecha_limite')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="row g-3 mt-2">
                    <div class="col-md-6">
                        <label class="form-label">Categoría (opcional)</label>
                        <input type="text"
                               name="categoria"
                               class="form-control @error('categoria') is-invalid @enderror"
                               value="{{ old('categoria') }}"
                               placeholder="Ej: proveedores, decoración, invitados...">
                        @error('categoria')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-12">
                        <label class="form-label">Descripción (opcional)</label>
                        <textarea name="descripcion"
                                  rows="2"
                                  class="form-control @error('descripcion') is-invalid @enderror"
                                  placeholder="Notas extra para recordar detalles de esta tarea">{{ old('descripcion') }}</textarea>
                        @error('descripcion')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="d-flex justify-content-end mt-3">
                    <button type="submit" class="btn btn-primary">
                        Agregar tarea
                    </button>
                </div>
            </form>
        </div>
    </div>

</div>
@endsection