@extends('layouts.app')

@section('content')
<div class="max-w-4xl mx-auto px-4 py-8">
    <div class="flex justify-between items-center mb-8">
        <h1 class="text-3xl font-bold">Modifier : {{ $product->name }}</h1>
        <a href="{{ route('admin.products.index') }}" class="text-gray-600">Retour</a>
    </div>

    <form action="{{ route('admin.products.update', $product->id) }}" method="POST" enctype="multipart/form-data" class="bg-white p-6 rounded shadow-lg">
        @csrf
        @method('PUT')

        <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
            <div>
                <label class="block text-gray-700 font-bold mb-2">Nom du produit</label>
                <input type="text" name="name" value="{{ $product->name }}" class="w-full border rounded p-2" required>
            </div>
            <div>
                <label class="block text-gray-700 font-bold mb-2">Prix (€)</label>
                <input type="number" step="0.01" name="price" value="{{ $product->price }}" class="w-full border rounded p-2" required>
            </div>
        </div>

        <div class="mb-6">
            <label class="block text-gray-700 font-bold mb-2">Catégorie</label>
            <select name="category_id" class="w-full border rounded p-2">
                <option value="">-- Aucune --</option>
                @foreach(\App\Models\Category::whereIn('type', ['all', 'shop'])->get() as $cat)
                    <option value="{{ $cat->id }}" {{ $product->category_id == $cat->id ? 'selected' : '' }}>{{ $cat->name }}</option>
                @endforeach
            </select>
        </div>

        <div class="mb-6">
            <label class="block text-gray-700 font-bold mb-2">Description</label>
            <textarea name="description" rows="4" class="w-full border rounded p-2">{{ $product->description }}</textarea>
        </div>

        <div class="bg-gray-50 p-4 rounded mb-6 border border-gray-200">
            <h3 class="font-bold text-lg mb-4 text-gray-700">Images</h3>

            <div class="mb-4">
                <label class="block text-sm font-bold mb-1">Image actuelle</label>
                <img src="{{ asset($product->image_path) }}" class="h-20 w-20 object-cover rounded border mb-2">
                <input type="file" name="image" class="w-full">
            </div>

            <div class="mb-4">
                <label class="block text-sm font-bold mb-1">Changer l'image "Vierge"</label>
                @if($product->base_image_path)
                    <p class="text-xs text-green-600 mb-1">✅ Image vierge active</p>
                @endif
                <input type="file" name="base_image" class="w-full">
            </div>
        </div>

        <div class="bg-blue-50 p-4 rounded mb-8 border border-blue-200">
            <h3 class="font-bold text-lg mb-4 text-blue-800"><i class="fas fa-search mr-2"></i>Référencement Google (SEO)</h3>

            <div class="mb-4">
                <label class="block text-sm font-bold text-blue-900 mb-1">Méta Titre</label>
                <input type="text" name="meta_title" value="{{ $product->meta_title }}" class="w-full border rounded p-2 text-sm">
            </div>

            <div class="mb-4">
                <label class="block text-sm font-bold text-blue-900 mb-1">Méta Description</label>
                <textarea name="meta_description" rows="2" class="w-full border rounded p-2 text-sm">{{ $product->meta_description }}</textarea>
            </div>
        </div>

        <button type="submit" class="bg-primary text-white font-bold py-3 px-6 rounded w-full hover:bg-primary-dark">
            Mettre à jour
        </button>
    </form>
</div>
@endsection