@extends('layouts.app')

@section('title', isset($product) ? 'Edit Product - ' . ($product->details->first()?->title ?? '') : 'Create Product')

@section('content')
<div class="container-fluid px-4">
    {{-- Page Header --}}
    <div class="d-flex flex-wrap align-items-center justify-content-between mb-4">
        <div>
            <h1 class="h3 mb-1 fw-700">{{ isset($product) ? 'Edit Product' : 'Create New Product' }}</h1>
            <p class="text-muted small mb-0">{{ isset($product) ? 'Update product details and settings' : 'Add a new product to your marketplace' }}</p>
        </div>
        <div>
            <a href="{{ route('admin.products.index') }}" class="btn btn-sm btn-outline-secondary">
                <i class="fas fa-arrow-left me-1"></i> Back to Products
            </a>
        </div>
    </div>

    {{-- Form --}}
    <div class="card border-0 shadow-sm">
        <div class="card-body">
            <form action="{{ isset($product) ? route('admin.products.update', $product) : route('admin.products.store') }}"
                  method="POST" id="productForm">
                @csrf
                @if(isset($product))
                    @method('PUT')
                @endif

                <div class="row g-4">
                    {{-- Basic Information --}}
                    <div class="col-md-8">
                        <div class="card border-0 bg-light">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-info-circle me-2 text-primary"></i>Basic Information</h6>

                                {{-- Title --}}
                                <div class="mb-3">
                                    <label class="form-label fw-600">Product Title <span class="text-danger">*</span></label>
                                    <input type="text" name="title"
                                           class="form-control @error('title') is-invalid @enderror"
                                           value="{{ old('title', $product->details->first()?->title ?? '') }}"
                                           required maxlength="500">
                                    @error('title')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                {{-- Slug --}}
                                <div class="mb-3">
                                    <label class="form-label fw-600">Slug</label>
                                    <div class="input-group">
                                        <span class="input-group-text">/product/</span>
                                        <input type="text" name="slug"
                                               class="form-control @error('slug') is-invalid @enderror"
                                               value="{{ old('slug', $product->slug ?? '') }}"
                                               placeholder="auto-generated from title">
                                    </div>
                                    <small class="text-muted">Leave blank to auto-generate from title</small>
                                    @error('slug')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                {{-- Short Description --}}
                                <div class="mb-3">
                                    <label class="form-label fw-600">Short Description</label>
                                    <input type="text" name="short_description"
                                           class="form-control @error('short_description') is-invalid @enderror"
                                           value="{{ old('short_description', $product->details->first()?->short_description ?? '') }}"
                                           maxlength="500">
                                    @error('short_description')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                {{-- Description --}}
                                <div class="mb-3">
                                    <label class="form-label fw-600">Full Description</label>
                                    <textarea name="description" class="form-control @error('description') is-invalid @enderror"
                                              rows="8">{{ old('description', $product->details->first()?->description ?? '') }}</textarea>
                                    @error('description')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Sidebar Settings --}}
                    <div class="col-md-4">
                        {{-- Product Type --}}
                        <div class="card border-0 bg-light mb-3">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-tag me-2 text-primary"></i>Product Type</h6>
                                <div class="mb-3">
                                    <label class="form-label fw-600">Type <span class="text-danger">*</span></label>
                                    <select name="product_type" class="form-select @error('product_type') is-invalid @enderror" required>
                                        @foreach($productTypes as $type)
                                            <option value="{{ $type }}" {{ old('product_type', $product->product_type ?? '') == $type ? 'selected' : '' }}>
                                                {{ ucfirst($type) }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('product_type')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="form-label fw-600">Listing Type <span class="text-danger">*</span></label>
                                    <select name="listing_type" class="form-select @error('listing_type') is-invalid @enderror" required>
                                        @foreach($listingTypes as $type)
                                            <option value="{{ $type }}" {{ old('listing_type', $product->listing_type ?? '') == $type ? 'selected' : '' }}>
                                                {{ ucfirst(str_replace('_', ' ', $type)) }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('listing_type')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        {{-- Pricing --}}
                        <div class="card border-0 bg-light mb-3">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-money-bill-wave me-2 text-success"></i>Pricing</h6>
                                <div class="mb-3">
                                    <label class="form-label fw-600">Currency <span class="text-danger">*</span></label>
                                    <input type="text" name="currency"
                                           class="form-control @error('currency') is-invalid @enderror"
                                           value="{{ old('currency', $product->currency ?? 'NGN') }}"
                                           required maxlength="20">
                                    @error('currency')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="form-label fw-600">Price <span class="text-danger">*</span></label>
                                    <input type="number" name="price"
                                           class="form-control @error('price') is-invalid @enderror"
                                           value="{{ old('price', $product->price ?? 0) }}"
                                           step="0.01" min="0" required>
                                    @error('price')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="form-label fw-600">Discounted Price</label>
                                    <input type="number" name="price_discounted"
                                           class="form-control @error('price_discounted') is-invalid @enderror"
                                           value="{{ old('price_discounted', $product->price_discounted ?? 0) }}"
                                           step="0.01" min="0">
                                    @error('price_discounted')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="form-label fw-600">Discount Rate (%)</label>
                                    <input type="number" name="discount_rate"
                                           class="form-control @error('discount_rate') is-invalid @enderror"
                                           value="{{ old('discount_rate', $product->discount_rate ?? 0) }}"
                                           min="0" max="100">
                                    @error('discount_rate')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Additional Settings --}}
                    <div class="col-12">
                        <div class="card border-0 bg-light">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-cog me-2 text-primary"></i>Additional Settings</h6>
                                <div class="row g-3">
                                    <div class="col-md-3">
                                        <label class="form-label fw-600">Seller <span class="text-danger">*</span></label>
                                        <select name="user_id" class="form-select @error('user_id') is-invalid @enderror" required>
                                            <option value="">Select Seller</option>
                                            @foreach($sellers as $seller)
                                                <option value="{{ $seller->id }}" {{ old('user_id', $product->user_id ?? '') == $seller->id ? 'selected' : '' }}>
                                                    {{ $seller->username }} ({{ $seller->email }})
                                                </option>
                                            @endforeach
                                        </select>
                                        @error('user_id')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-3">
                                        <label class="form-label fw-600">Category</label>
                                        <select name="category_id" class="form-select @error('category_id') is-invalid @enderror">
                                            <option value="">Uncategorized</option>
                                            @foreach($categories as $category)
                                                <option value="{{ $category->id }}" {{ old('category_id', $product->category_id ?? '') == $category->id ? 'selected' : '' }}>
                                                    {{ $category->translations->first()?->name ?? 'Unnamed' }}
                                                </option>
                                            @endforeach
                                        </select>
                                        @error('category_id')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-2">
                                        <label class="form-label fw-600">SKU</label>
                                        <input type="text" name="sku"
                                               class="form-control @error('sku') is-invalid @enderror"
                                               value="{{ old('sku', $product->sku ?? '') }}"
                                               maxlength="100">
                                        @error('sku')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-2">
                                        <label class="form-label fw-600">Stock</label>
                                        <input type="number" name="stock"
                                               class="form-control @error('stock') is-invalid @enderror"
                                               value="{{ old('stock', $product->stock ?? 0) }}"
                                               min="0">
                                        @error('stock')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-2">
                                        <label class="form-label fw-600">VAT Rate (%)</label>
                                        <input type="number" name="vat_rate"
                                               class="form-control @error('vat_rate') is-invalid @enderror"
                                               value="{{ old('vat_rate', $product->vat_rate ?? 0) }}"
                                               step="0.01" min="0" max="100">
                                        @error('vat_rate')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-2">
                                        <label class="form-label fw-600">Commission (%)</label>
                                        <input type="number" name="commission_rate"
                                               class="form-control @error('commission_rate') is-invalid @enderror"
                                               value="{{ old('commission_rate', $product->commission_rate ?? 0) }}"
                                               step="0.01" min="0" max="100">
                                        @error('commission_rate')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Status & Features --}}
                    <div class="col-12">
                        <div class="card border-0 bg-light">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-toggle-on me-2 text-primary"></i>Status & Features</h6>
                                <div class="row g-3">
                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="status" value="0">
                                            <input type="checkbox" name="status" class="form-check-input" id="status"
                                                   value="1" {{ old('status', $product->status ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="status">Approved</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_active" value="0">
                                            <input type="checkbox" name="is_active" class="form-check-input" id="isActive"
                                                   value="1" {{ old('is_active', $product->is_active ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isActive">Active</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_promoted" value="0">
                                            <input type="checkbox" name="is_promoted" class="form-check-input" id="isPromoted"
                                                   value="1" {{ old('is_promoted', $product->is_promoted ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isPromoted">Promoted</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_special_offer" value="0">
                                            <input type="checkbox" name="is_special_offer" class="form-check-input" id="isSpecialOffer"
                                                   value="1" {{ old('is_special_offer', $product->is_special_offer ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isSpecialOffer">Special Offer</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_free_product" value="0">
                                            <input type="checkbox" name="is_free_product" class="form-check-input" id="isFree"
                                                   value="1" {{ old('is_free_product', $product->is_free_product ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isFree">Free Product</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_affiliate" value="0">
                                            <input type="checkbox" name="is_affiliate" class="form-check-input" id="isAffiliate"
                                                   value="1" {{ old('is_affiliate', $product->is_affiliate ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isAffiliate">Affiliate Product</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="is_draft" value="0">
                                            <input type="checkbox" name="is_draft" class="form-check-input" id="isDraft"
                                                   value="1" {{ old('is_draft', $product->is_draft ?? 0) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="isDraft">Draft</label>
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                        <div class="form-check form-switch">
                                            <input type="hidden" name="visibility" value="0">
                                            <input type="checkbox" name="visibility" class="form-check-input" id="visibility"
                                                   value="1" {{ old('visibility', $product->visibility ?? 1) ? 'checked' : '' }}>
                                            <label class="form-check-label fw-600" for="visibility">Visible</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- External Links --}}
                    <div class="col-12">
                        <div class="card border-0 bg-light">
                            <div class="card-body">
                                <h6 class="fw-700 mb-3"><i class="fas fa-link me-2 text-primary"></i>External Links</h6>
                                <div class="row g-3">
                                    <div class="col-md-4">
                                        <label class="form-label fw-600">Demo URL</label>
                                        <input type="url" name="demo_url"
                                               class="form-control @error('demo_url') is-invalid @enderror"
                                               value="{{ old('demo_url', $product->demo_url ?? '') }}"
                                               placeholder="https://example.com/demo">
                                        @error('demo_url')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-4">
                                        <label class="form-label fw-600">External Link</label>
                                        <input type="url" name="external_link"
                                               class="form-control @error('external_link') is-invalid @enderror"
                                               value="{{ old('external_link', $product->external_link ?? '') }}"
                                               placeholder="https://example.com/product">
                                        @error('external_link')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="col-md-4">
                                        <label class="form-label fw-600">Files Included</label>
                                        <input type="text" name="files_included"
                                               class="form-control @error('files_included') is-invalid @enderror"
                                               value="{{ old('files_included', $product->files_included ?? '') }}"
                                               placeholder="e.g., PDF, ZIP, Source Code">
                                        @error('files_included')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Submit --}}
                    <div class="col-12">
                        <div class="d-flex gap-2">
                            <button type="submit" class="btn btn-primary">
                                <i class="fas fa-save me-1"></i> {{ isset($product) ? 'Update Product' : 'Create Product' }}
                            </button>
                            <a href="{{ route('admin.products.index') }}" class="btn btn-secondary">Cancel</a>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@push('styles')
<style>
    .fw-600 { font-weight: 600; }
    .fw-700 { font-weight: 700; }
    .form-switch .form-check-input {
        width: 2.5rem;
        height: 1.25rem;
        cursor: pointer;
    }
    .form-switch .form-check-label {
        cursor: pointer;
    }
</style>
@endpush