@extends('layouts.app')

@section('title', 'Product Management')

@section('content')
<div class="space-y-6">
    <div class="rounded-3xl bg-white p-8 shadow-sm flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
        <div>
            <h1 class="text-3xl font-semibold">Product Management</h1>
            <p class="mt-2 text-slate-600">Add, edit, or remove products from the store.</p>
        </div>
        <a href="{{ route('admin.products.create') }}" class="rounded-full bg-slate-900 px-6 py-3 text-white hover:bg-slate-800">Upload Product</a>
    </div>

    <div class="overflow-x-auto rounded-3xl bg-white shadow-sm">
        <table class="min-w-full divide-y divide-slate-200 text-sm">
            <thead class="bg-slate-50 text-slate-700">
                <tr>
                    <th class="px-6 py-4 text-left font-semibold">Name</th>
                    <th class="px-6 py-4 text-left font-semibold">Category</th>
                    <th class="px-6 py-4 text-left font-semibold">Price</th>
                    <th class="px-6 py-4 text-left font-semibold">Discount</th>
                    <th class="px-6 py-4 text-left font-semibold">Tags</th>
                    <th class="px-6 py-4 text-left font-semibold">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-200 bg-white">
                @foreach($products as $product)
                    <tr>
                        <td class="px-6 py-4">{{ $product->name }}</td>
                        <td class="px-6 py-4">{{ $product->category->name }}</td>
                        <td class="px-6 py-4">₹{{ number_format($product->display_price, 2) }}</td>
                        <td class="px-6 py-4">{{ $product->discount_percent }}%</td>
                        <td class="px-6 py-4">
                            @if($product->is_special_pick)<span class="rounded-full bg-emerald-50 px-2 py-1 text-xs text-emerald-700">Special</span>@endif
                            @if($product->is_flash_deal)<span class="rounded-full bg-rose-50 px-2 py-1 text-xs text-rose-700">Flash</span>@endif
                            @if($product->is_best_seller)<span class="rounded-full bg-sky-50 px-2 py-1 text-xs text-sky-700">Bestseller</span>@endif
                        </td>
                        <td class="px-6 py-4 space-x-2">
                            <a href="{{ route('admin.products.edit', $product->id) }}" class="text-slate-700 hover:text-slate-900">Edit</a>
                            <form action="{{ route('admin.products.destroy', $product->id) }}" method="POST" class="inline">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="text-rose-600 hover:text-rose-800">Delete</button>
                            </form>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>

    <div>{{ $products->links() }}</div>
</div>
@endsection
