{{-- Shared form fields for create/edit product --}}
<div class="grid sm:grid-cols-2 gap-5 bg-white rounded-2xl shadow-sm border border-gray-100 p-6">

    <div class="sm:col-span-2">
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Nom du produit <span class="text-red-500">*</span></label>
        <input type="text" name="name" value="{{ old('name', $product->name ?? '') }}" required
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none @error('name') border-red-400 @enderror"
               placeholder="Ex: Coque iPhone 15 Pro Max silicone">
        @error('name')<p class="text-red-500 text-xs mt-1">{{ $message }}</p>@enderror
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Catégorie <span class="text-red-500">*</span></label>
        <select name="category_id" required class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none @error('category_id') border-red-400 @enderror">
            <option value="">-- Sélectionner --</option>
            @foreach($categories as $cat)
                <option value="{{ $cat->id }}" {{ old('category_id', $product->category_id ?? '') == $cat->id ? 'selected' : '' }}>{{ $cat->name }}</option>
            @endforeach
        </select>
        @error('category_id')<p class="text-red-500 text-xs mt-1">{{ $message }}</p>@enderror
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Marque</label>
        <input type="text" name="brand" value="{{ old('brand', $product->brand ?? '') }}"
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none"
               placeholder="Apple, Samsung, Xiaomi…">
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Prix (DA) <span class="text-red-500">*</span></label>
        <input type="number" name="price" value="{{ old('price', $product->price ?? '') }}" step="0.01" min="0" required
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none @error('price') border-red-400 @enderror"
               placeholder="1500.00">
        @error('price')<p class="text-red-500 text-xs mt-1">{{ $message }}</p>@enderror
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Ancien prix (DA)</label>
        <input type="number" name="old_price" value="{{ old('old_price', $product->old_price ?? '') }}" step="0.01" min="0"
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none"
               placeholder="2000.00">
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Stock <span class="text-red-500">*</span></label>
        <input type="number" name="stock" value="{{ old('stock', $product->stock ?? 0) }}" min="0" required
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none @error('stock') border-red-400 @enderror">
        @error('stock')<p class="text-red-500 text-xs mt-1">{{ $message }}</p>@enderror
    </div>

    <div>
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">SKU (Référence)</label>
        <input type="text" name="sku" value="{{ old('sku', $product->sku ?? '') }}"
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none"
               placeholder="PROD-001">
    </div>

    <div class="sm:col-span-2">
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Résumé court</label>
        <input type="text" name="short_description" value="{{ old('short_description', $product->short_description ?? '') }}"
               class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none"
               placeholder="Brève description affichée sur la fiche produit…" maxlength="500">
    </div>

    <div class="sm:col-span-2">
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Description complète</label>
        <textarea name="description" rows="5"
                  class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:ring-2 focus:ring-blue-500 outline-none resize-none"
                  placeholder="Description détaillée du produit, compatibilité, caractéristiques…">{{ old('description', $product->description ?? '') }}</textarea>
    </div>

    <div class="sm:col-span-2">
        <label class="block text-sm font-semibold text-gray-700 mb-1.5">Image du produit</label>
        @if(isset($product) && $product->image)
            <div class="mb-3">
                <img src="{{ $product->image_url }}" alt="{{ $product->name }}" class="w-24 h-24 object-cover rounded-xl border border-gray-200">
                <p class="text-xs text-gray-400 mt-1">Image actuelle. Téléversez une nouvelle image pour la remplacer.</p>
            </div>
        @endif
        <input type="file" name="image" accept="image/*"
               class="block w-full text-sm text-gray-500 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 transition-colors">
        @error('image')<p class="text-red-500 text-xs mt-1">{{ $message }}</p>@enderror
    </div>

    <div class="flex items-center gap-6">
        <label class="flex items-center gap-2 cursor-pointer">
            <input type="hidden" name="is_active" value="0">
            <input type="checkbox" name="is_active" value="1" {{ old('is_active', $product->is_active ?? true) ? 'checked' : '' }}
                   class="w-4 h-4 accent-blue-600 rounded">
            <span class="text-sm font-medium text-gray-700">Produit actif</span>
        </label>
        <label class="flex items-center gap-2 cursor-pointer">
            <input type="hidden" name="is_featured" value="0">
            <input type="checkbox" name="is_featured" value="1" {{ old('is_featured', $product->is_featured ?? false) ? 'checked' : '' }}
                   class="w-4 h-4 accent-amber-500 rounded">
            <span class="text-sm font-medium text-gray-700">Produit vedette ⭐</span>
        </label>
    </div>
</div>