@extends('layouts.admin')

@section('title', 'Modifier - ' . $book->title)

@section('page-title', 'Modifier le livre')
@section('page-subtitle', $book->title)

@section('content')
<div class="max-w-4xl mx-auto">
    <div class="bg-white rounded-3xl shadow-xl border border-gray-100 overflow-hidden">
        <form action="{{ route('admin.library.books.update', $book) }}" method="POST" enctype="multipart/form-data" class="p-8 lg:p-12 space-y-8">
            @csrf
            @method('PUT')

            @if($errors->any())
                <div class="bg-red-50 text-red-600 p-4 rounded-2xl text-sm font-medium border border-red-100">
                    <ul class="list-disc list-inside space-y-1">
                        @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif

            <div>
                <h3 class="text-lg font-black text-gray-900 mb-6 flex items-center gap-2">
                    <span class="w-8 h-8 bg-blue-100 text-blue-600 rounded-lg flex items-center justify-center text-sm">1</span>
                    Informations principales
                </h3>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <div class="md:col-span-2">
                        <label class="block text-sm font-bold text-gray-700 mb-2">Titre du livre <span class="text-red-500">*</span></label>
                        <input type="text" name="title" value="{{ old('title', $book->title) }}" required
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Auteur <span class="text-red-500">*</span></label>
                        <input type="text" name="author" value="{{ old('author', $book->author) }}" required
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">ISBN</label>
                        <input type="text" name="isbn" value="{{ old('isbn', $book->isbn) }}"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Éditeur</label>
                        <input type="text" name="publisher" value="{{ old('publisher', $book->publisher) }}"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Année de publication</label>
                        <input type="number" name="publication_year" value="{{ old('publication_year', $book->publication_year) }}" min="1000" max="{{ date('Y') }}"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Catégorie</label>
                        <input type="text" name="category" value="{{ old('category', $book->category) }}" list="categories-list"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                        <datalist id="categories-list">
                            <option value="Informatique"><option value="Mathématiques"><option value="Physique">
                            <option value="Chimie"><option value="Biologie"><option value="Économie">
                            <option value="Droit"><option value="Littérature"><option value="Histoire"><option value="Philosophie">
                        </datalist>
                    </div>
                </div>
            </div>

            <hr class="border-gray-100">

            <div>
                <h3 class="text-lg font-black text-gray-900 mb-6 flex items-center gap-2">
                    <span class="w-8 h-8 bg-blue-100 text-blue-600 rounded-lg flex items-center justify-center text-sm">2</span>
                    Description
                </h3>
                <textarea name="description" rows="4"
                    class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50 resize-none">{{ old('description', $book->description) }}</textarea>
            </div>

            <hr class="border-gray-100">

            <div>
                <h3 class="text-lg font-black text-gray-900 mb-6 flex items-center gap-2">
                    <span class="w-8 h-8 bg-blue-100 text-blue-600 rounded-lg flex items-center justify-center text-sm">3</span>
                    Gestion des exemplaires
                </h3>
                <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Total exemplaires <span class="text-red-500">*</span></label>
                        <input type="number" name="total_copies" value="{{ old('total_copies', $book->total_copies) }}" min="1" required
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Disponibles</label>
                        <input type="text" disabled value="{{ $book->available_copies }}"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl bg-gray-100 text-gray-500">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Statut</label>
                        <select name="status" class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50">
                            <option value="available" {{ old('status', $book->status) === 'available' ? 'selected' : '' }}>Disponible</option>
                            <option value="borrowed" {{ old('status', $book->status) === 'borrowed' ? 'selected' : '' }}>Emprunté</option>
                            <option value="maintenance" {{ old('status', $book->status) === 'maintenance' ? 'selected' : '' }}>Maintenance</option>
                        </select>
                    </div>
                </div>
            </div>

            <hr class="border-gray-100">

            <div>
                <h3 class="text-lg font-black text-gray-900 mb-6 flex items-center gap-2">
                    <span class="w-8 h-8 bg-blue-100 text-blue-600 rounded-lg flex items-center justify-center text-sm">4</span>
                    Fichiers
                </h3>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Image de couverture</label>
                        @if($book->cover_image)
                            <div class="mb-3">
                                <img src="{{ asset('storage/' . $book->cover_image) }}" alt="Cover" class="w-20 h-28 object-cover rounded-lg shadow-sm">
                                <p class="text-xs text-gray-400 mt-1">Image actuelle</p>
                            </div>
                        @endif
                        <input type="file" name="cover_image" accept="image/*"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100">
                        <p class="text-xs text-gray-400 mt-2">JPG, PNG, WebP (max 2MB)</p>
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-gray-700 mb-2">Fichier PDF</label>
                        @if($book->file_path)
                            <div class="mb-3 flex items-center gap-2">
                                <i class="fa-solid fa-file-pdf text-red-500"></i>
                                <span class="text-sm text-gray-600">PDF actuel</span>
                                <a href="{{ route('admin.library.books.download', $book) }}" class="text-blue-600 text-xs font-bold hover:underline">Télécharger</a>
                            </div>
                        @endif
                        <input type="file" name="file_path" accept=".pdf"
                            class="w-full px-4 py-3 border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100">
                        <p class="text-xs text-gray-400 mt-2">PDF uniquement (max 50MB) - remplace l'existant</p>
                    </div>
                </div>
            </div>

            <div class="pt-4 flex items-center gap-4">
                <a href="{{ route('admin.library.books.index') }}"
                    class="px-8 py-3 bg-gray-100 text-gray-700 font-bold rounded-xl hover:bg-gray-200 transition-all">
                    Annuler
                </a>
                <button type="submit"
                    class="px-8 py-3 bg-blue-600 text-white font-bold rounded-xl hover:bg-blue-700 transition-all shadow-lg shadow-blue-500/20">
                    Enregistrer les modifications
                </button>
            </div>
        </form>
    </div>
</div>
@endsection