@extends('layouts.app')

@section('title', 'Invitados del Matrimonio')

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

    $routeDashboard = $isPlanner
        ? route('plannerpro.matrimonios.show', $matrimonio)  
        : route('planner.dashboard');

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

    $routeUpdate = function($inv) use ($isPlanner, $matrimonio) {
        return $isPlanner
            ? route('plannerpro.invitados.update', [$matrimonio, $inv])
            : route('planner.invitados.update', $inv);
    };

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

<div class="container py-4">

    <div class="d-flex justify-content-between align-items-center mb-3">
        <div>
            <h1 class="h3 mb-1">Invitados</h1>
            <p class="text-muted mb-0">
                Lleva el control de quién está invitado, si confirmó y detalles importantes (dieta, grupo, etc.).
            </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

    {{-- Resumen de conteos --}}
    <div class="row g-3 mb-4">
        <div class="col-md-3">
            <div class="card h-100 shadow-sm">
                <div class="card-body">
                    <h6 class="card-title mb-1">Total invitados</h6>
                    <p class="h5 mb-0">{{ $total }}</p>
                    <small class="text-muted">Incluye todos los estados.</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card h-100 shadow-sm">
                <div class="card-body">
                    <h6 class="card-title mb-1">Confirmados</h6>
                    <p class="h5 mb-0">{{ $confirmados }}</p>
                    <small class="text-muted">
                        {{ $total > 0 ? round(($confirmados / $total) * 100) : 0 }}% del total.
                    </small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card h-100 shadow-sm">
                <div class="card-body">
                    <h6 class="card-title mb-1">Pendientes</h6>
                    <p class="h5 mb-0">{{ $pendientes }}</p>
                    <small class="text-muted">Aún no responden.</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card h-100 shadow-sm">
                <div class="card-body">
                    <h6 class="card-title mb-1">Rechazaron</h6>
                    <p class="h5 mb-0">{{ $rechazados }}</p>
                    <small class="text-muted">No asistirán.</small>
                </div>
            </div>
        </div>
    </div>

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

            <form action="{{ $routeStore }}" method="POST">
                @csrf
                <div class="row g-3">
                    <div class="col-md-3">
                        <label class="form-label">Nombre</label>
                        <input type="text"
                               name="nombre"
                               class="form-control @error('nombre') is-invalid @enderror"
                               value="{{ old('nombre') }}"
                               required>
                        @error('nombre')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Apellido</label>
                        <input type="text"
                               name="apellido"
                               class="form-control @error('apellido') is-invalid @enderror"
                               value="{{ old('apellido') }}">
                        @error('apellido')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Grupo</label>
                        <input type="text"
                               name="grupo"
                               class="form-control @error('grupo') is-invalid @enderror"
                               value="{{ old('grupo') }}"
                               placeholder="Familia novia, amigos, trabajo...">
                        @error('grupo')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Estado</label>
                        <select name="rsvp_estado"
                                class="form-select @error('rsvp_estado') is-invalid @enderror">
                            <option value="pendiente" {{ old('rsvp_estado') == 'pendiente' ? 'selected' : '' }}>Pendiente</option>
                            <option value="confirmado" {{ old('rsvp_estado') == 'confirmado' ? 'selected' : '' }}>Confirmado</option>
                            <option value="rechazado" {{ old('rsvp_estado') == 'rechazado' ? 'selected' : '' }}>Rechazado</option>
                        </select>
                        @error('rsvp_estado')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="row g-3 mt-2">
                    <div class="col-md-3">
                        <label class="form-label">Email</label>
                        <input type="email"
                               name="email"
                               class="form-control @error('email') is-invalid @enderror"
                               value="{{ old('email') }}">
                        @error('email')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Teléfono</label>
                        <input type="text"
                               name="telefono"
                               class="form-control @error('telefono') is-invalid @enderror"
                               value="{{ old('telefono') }}">
                        @error('telefono')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Dieta / Restricción</label>
                        <input type="text"
                               name="dieta"
                               class="form-control @error('dieta') is-invalid @enderror"
                               value="{{ old('dieta') }}"
                               placeholder="Vegano, celíaco, etc.">
                        @error('dieta')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="mt-3">
                    <label class="form-label">Notas (opcional)</label>
                    <textarea name="notas"
                              rows="2"
                              class="form-control @error('notas') is-invalid @enderror"
                              placeholder="Detalles importantes sobre este invitado">{{ old('notas') }}</textarea>
                    @error('notas')
                    <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

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

            </form>
        </div>
    </div>

    {{-- Tabla de invitados --}}
    <div class="card shadow-sm">
        <div class="card-body">
            <h2 class="h5 mb-3">Lista completa de invitados</h2>

            @if($invitados->isEmpty())
                <p class="text-muted mb-0">
                    Aún no has agregado invitados. Empieza por los más cercanos y luego completa el resto.
                </p>
            @else
                <div class="table-responsive">
                    <table class="table table-sm align-middle">
                        <thead>
                        <tr>
                            <th>Nombre</th>
                            <th>Grupo</th>
                            <th>Email</th>
                            <th>Teléfono</th>
                            <th>Dieta</th>
                            <th>Estado</th>
                            <th>Notas</th>
                            <th class="text-end">Acciones</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($invitados as $inv)
                            <tr>
                                <form action="{{ $routeUpdate($inv) }}" method="POST">
                                    @csrf
                                    @method('PUT')
                                    <td style="min-width: 160px;">
                                        <div class="d-flex gap-1">
                                            <input type="text"
                                                   name="nombre"
                                                   class="form-control form-control-sm"
                                                   value="{{ old('nombre', $inv->nombre) }}"
                                                   placeholder="Nombre">
                                            <input type="text"
                                                   name="apellido"
                                                   class="form-control form-control-sm"
                                                   value="{{ old('apellido', $inv->apellido) }}"
                                                   placeholder="Apellido">
                                        </div>
                                    </td>
                                    <td style="min-width: 130px;">
                                        <input type="text"
                                               name="grupo"
                                               class="form-control form-control-sm"
                                               value="{{ old('grupo', $inv->grupo) }}">
                                    </td>
                                    <td style="min-width: 160px;">
                                        <input type="email"
                                               name="email"
                                               class="form-control form-control-sm"
                                               value="{{ old('email', $inv->email) }}">
                                    </td>
                                    <td style="min-width: 120px;">
                                        <input type="text"
                                               name="telefono"
                                               class="form-control form-control-sm"
                                               value="{{ old('telefono', $inv->telefono) }}">
                                    </td>
                                    <td style="min-width: 120px;">
                                        <input type="text"
                                               name="dieta"
                                               class="form-control form-control-sm"
                                               value="{{ old('dieta', $inv->dieta) }}">
                                    </td>
                                    <td style="min-width: 130px;">
                                        <select name="rsvp_estado"
                                                class="form-select form-select-sm">
                                            <option value="pendiente" {{ $inv->rsvp_estado == 'pendiente' ? 'selected' : '' }}>Pendiente</option>
                                            <option value="confirmado" {{ $inv->rsvp_estado == 'confirmado' ? 'selected' : '' }}>Confirmado</option>
                                            <option value="rechazado" {{ $inv->rsvp_estado == 'rechazado' ? 'selected' : '' }}>Rechazado</option>
                                        </select>
                                    </td>
                                    <td style="min-width: 200px;">
                                        <textarea name="notas"
                                                  rows="1"
                                                  class="form-control form-control-sm">{{ old('notas', $inv->notas) }}</textarea>
                                    </td>
                                    <td class="text-end">
                                        <div class="d-flex justify-content-end gap-1">
                                            <button type="submit" class="btn btn-sm btn-outline-primary">
                                                Guardar
                                            </button>
                                </form>
                                            <form action="{{ $routeDestroy($inv) }}"
                                                  method="POST"
                                                  onsubmit="return confirm('¿Eliminar este invitado?');">
                                                @csrf
                                                @method('DELETE')
                                                <button class="btn btn-sm btn-outline-danger">
                                                    Eliminar
                                                </button>
                                            </form>
                                        </div>
                                    </td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            @endif

        </div>
    </div>

</div>
@endsection