@extends('layouts.app')

@section('title', 'Mi Wishlist')

@section('content')
<div class="container">
    <div class="section-header">
        <h1 class="page-title">
            <i class="fas fa-heart text-danger"></i> Mi Wishlist
        </h1>
        <span class="badge badge-primary">
            {{ $wishlists->count() }} juegos
        </span>
    </div>

    @if($wishlists->count() > 0)
        <div class="wishlist-container">
            @foreach($wishlists as $wishlist)
                <article class="wishlist-item card">
                    <div class="wishlist-flex">
                        <div class="wishlist-image-wrapper">
                            <img src="{{ $wishlist->game->thumb }}" alt="{{ $wishlist->game->title }}" class="wishlist-image">
                        </div>

                        <div class="wishlist-content">
                            <div class="wishlist-main-info">
                                <h3 class="wishlist-game-title">{{ $wishlist->game->title }}</h3>

                                <div class="wishlist-grid">
                                    <div class="price-stat">
                                        <span class="stat-label">Precio Actual</span>
                                        @if(isset($wishlist->current_price))
                                            <div class="price-highlight">
                                                <span class="price-sale">${{ number_format($wishlist->current_price, 2) }}</span>
                                                @if(isset($wishlist->current_savings) && $wishlist->current_savings > 0)
                                                    <span class="badge badge-danger">-{{ round($wishlist->current_savings) }}%</span>
                                                @endif
                                            </div>
                                        @else
                                            <p class="text-muted">No disponible</p>
                                        @endif
                                    </div>

                                    <div class="price-stat">
                                        <span class="stat-label">Mínimo Histórico</span>
                                        <p class="price-history">${{ number_format($wishlist->game->cheapest_price, 2) }}</p>
                                    </div>

                                    <div class="price-stat">
                                        <span class="stat-label">Tu Objetivo</span>
                                        <p class="price-target">${{ number_format($wishlist->target_price ?? 0, 2) }}</p>
                                    </div>
                                </div>

                                @if(isset($wishlist->price_alert) && $wishlist->price_alert)
                                    <div class="alert alert-success alert-sm">
                                        <i class="fas fa-bell"></i> <strong>¡Precio alcanzado!</strong> Está al precio que buscabas.
                                    </div>
                                @endif

                                <form action="{{ route('wishlist.update', $wishlist->id) }}" method="POST" class="update-price-form">
                                    @csrf @method('PATCH')
                                    <div class="input-group">
                                        <input type="number" name="target_price" step="0.01" value="{{ $wishlist->target_price }}" placeholder="Nuevo objetivo" class="form-input input-sm">
                                        <button type="submit" class="btn btn-primary btn-sm">Actualizar</button>
                                    </div>
                                </form>
                            </div>

                            <div class="wishlist-actions">
                                <a href="{{ route('games.show', $wishlist->game->external_id) }}" class="btn btn-primary btn-full">
                                    <i class="fas fa-eye"></i> Detalles
                                </a>
                                <form action="{{ route('wishlist.destroy', $wishlist->id) }}" method="POST" onsubmit="return confirm('¿Eliminar de la lista?')">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-danger-outline btn-full">
                                        <i class="fas fa-trash"></i>
                                    </button>
                                </form>
                            </div>
                        </div>
                    </div>
                </article>
            @endforeach
        </div>

        <div class="card summary-card">
            <h2 class="card-title">Resumen de tu Wishlist</h2>
            <div class="summary-grid">
                <div class="summary-item bg-primary-light">
                    <span class="summary-value">{{ $wishlists->count() }}</span>
                    <span class="summary-label">Juegos</span>
                </div>
                <div class="summary-item bg-success-light">
                    <span class="summary-value">{{ $wishlists->where('target_price', '!=', null)->count() }}</span>
                    <span class="summary-label">Con Objetivo</span>
                </div>
                <div class="summary-item bg-info-light">
                    <span class="summary-value">${{ number_format($wishlists->sum(fn($w) => $w->game->cheapest_price ?? 0), 2) }}</span>
                    <span class="summary-label">Valor Histórico</span>
                </div>
            </div>
        </div>
    @else
        <div class="empty-state card">
            <i class="fas fa-heart-broken empty-icon"></i>
            <h2>Tu wishlist está vacía</h2>
            <p>Comienza a buscar juegos y añádelos a tu lista de deseos</p>
            <a href="{{ route('home') }}" class="btn btn-primary">Buscar Juegos</a>
        </div>
    @endif
</div>
@endsection