@extends('layouts.admin')
@section('title', $product->exists ? 'Edit Product' : 'New Product')
@section('content')
<h1 class="text-2xl font-bold mb-6">{{ $product->exists ? 'Edit' : 'New' }} Product</h1>
<form method="POST" action="{{ $product->exists ? route('admin.products.update', $product) : route('admin.products.store') }}" enctype="multipart/form-data" class="bg-white rounded-xl shadow-sm p-6 space-y-4 max-w-3xl" x-data="{ variantCount: {{ $product->variants->count() ?: 1 }} }">
    @csrf
    @if($product->exists) @method('PUT') @endif

    <div>
        <label class="text-sm font-medium">Title</label>
        <input name="title" value="{{ old('title', $product->title) }}" required class="w-full border rounded-lg px-3 py-2 mt-1">
    </div>

    <div class="grid grid-cols-2 gap-4">
        <div><label class="text-sm font-medium">Price</label><input type="number" step="0.01" name="price" value="{{ old('price', $product->price) }}" required class="w-full border rounded-lg px-3 py-2 mt-1"></div>
        <div><label class="text-sm font-medium">Discount Price</label><input type="number" step="0.01" name="discount_price" value="{{ old('discount_price', $product->discount_price) }}" class="w-full border rounded-lg px-3 py-2 mt-1"></div>
    </div>

    <div>
        <label class="text-sm font-medium">Categories</label>
        <select name="categories[]" multiple class="w-full border rounded-lg px-3 py-2 mt-1 h-28">
            @foreach($categories as $cat)
                <option value="{{ $cat->id }}" {{ $product->categories->contains($cat->id) ? 'selected' : '' }}>{{ $cat->name }}</option>
            @endforeach
        </select>
    </div>

    <div>
        <label class="text-sm font-medium">Description</label>
        <textarea name="description" rows="5" class="w-full border rounded-lg px-3 py-2 mt-1">{{ old('description', $product->description) }}</textarea>
    </div>

    <div class="grid grid-cols-2 gap-4">
        <div>
            <label class="text-sm font-medium">SEO Tag</label>
            <input name="seo_tag" value="{{ old('seo_tag', $product->seo_tag) }}" class="w-full border rounded-lg px-3 py-2 mt-1">
        </div>
        <div>
            <label class="text-sm font-medium">AI Tag Suggestion</label>
            <div class="flex gap-2 mt-1">
                <input name="ai_tag_suggestion" value="{{ old('ai_tag_suggestion', $product->ai_tag_suggestion) }}" class="w-full border rounded-lg px-3 py-2" readonly>
                @if($product->exists)
                <button type="button" onclick="document.getElementById('seo-form-{{ $product->id }}').submit()" class="border rounded-lg px-3 text-sm whitespace-nowrap">Suggest</button>
                @endif
            </div>
        </div>
    </div>

    <div>
        <label class="text-sm font-medium">Main Image</label>
        <input type="file" name="main_image" class="w-full border rounded-lg px-3 py-2 mt-1">
    </div>
    <div>
        <label class="text-sm font-medium">Gallery Images</label>
        <input type="file" name="images[]" multiple class="w-full border rounded-lg px-3 py-2 mt-1">
    </div>
    <div>
        <label class="text-sm font-medium">External Image URLs (one per line)</label>
        <textarea name="image_urls" rows="2" class="w-full border rounded-lg px-3 py-2 mt-1">{{ old('image_urls', implode("\n", $product->image_urls ?? [])) }}</textarea>
    </div>
    <div>
        <label class="text-sm font-medium">YouTube Video Link</label>
        <input name="youtube_link" value="{{ old('youtube_link', $product->youtube_link) }}" class="w-full border rounded-lg px-3 py-2 mt-1">
    </div>

    <div>
        <label class="text-sm font-medium">Variants (colour, weight, material, custom)</label>
        <div class="space-y-2 mt-1">
            <template x-for="i in variantCount" :key="i">
                <div class="grid grid-cols-5 gap-2">
                    <select :name="'variant_type[]'" class="border rounded-lg px-2 py-1 text-sm">
                        <option value="">-</option><option>colour</option><option>weight</option><option>material</option><option>custom</option>
                    </select>
                    <input name="variant_name[]" placeholder="name" class="border rounded-lg px-2 py-1 text-sm">
                    <input name="variant_value[]" placeholder="value" class="border rounded-lg px-2 py-1 text-sm">
                    <input name="variant_price[]" placeholder="price +/-" type="number" step="0.01" class="border rounded-lg px-2 py-1 text-sm">
                    <input name="variant_stock[]" placeholder="stock" type="number" class="border rounded-lg px-2 py-1 text-sm">
                </div>
            </template>
        </div>
        <button type="button" @click="variantCount++" class="text-brand text-sm mt-2">+ Add variant row</button>
    </div>

    <div class="grid grid-cols-3 gap-4 items-center">
        <div><label class="text-sm font-medium">Stock Qty</label><input type="number" name="stock_qty" value="{{ old('stock_qty', $product->stock_qty ?? 0) }}" required class="w-full border rounded-lg px-3 py-2 mt-1"></div>
        <label class="flex items-center gap-2 text-sm mt-6"><input type="checkbox" name="is_featured" value="1" {{ old('is_featured', $product->is_featured) ? 'checked' : '' }}> Featured</label>
        <label class="flex items-center gap-2 text-sm mt-6"><input type="checkbox" name="is_active" value="1" {{ old('is_active', $product->id ? $product->is_active : true) ? 'checked' : '' }}> Active (in stock)</label>
    </div>

    <button class="bg-brand text-white px-6 py-2 rounded-lg font-semibold">Save Product</button>
</form>

@if($product->exists)
<form id="seo-form-{{ $product->id }}" method="POST" action="{{ route('admin.products.suggest-seo', $product) }}" class="hidden">@csrf</form>
@endif
@endsection