@extends('layouts.main')
@section('title', 'Products')
@section('content')
<div class="flex justify-between items-center mb-6">
    <h2 class="text-2xl font-bold text-gray-800 dark:text-white"><i class="fas fa-box mr-2 text-indigo-600 dark:text-indigo-400"></i>Products</h2>
    <a href="{{ route('products.create') }}" class="bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg transition"><i class="fas fa-plus mr-2"></i>Add Product</a>
</div>
@if(session('success'))
    <div class="bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-800 text-green-700 dark:text-green-400 px-4 py-3 rounded mb-4">
        {{ session('success') }}
    </div>
@endif
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
    <table class="w-full">
        <thead>
            <tr class="text-left text-gray-500 dark:text-gray-400 text-sm border-b dark:border-gray-700">
                <th class="pb-3"><i class="fas fa-box mr-1"></i>Name</th>
                <th class="pb-3"><i class="fas fa-barcode mr-1"></i>SKU</th>
                <th class="pb-3"><i class="fas fa-dollar-sign mr-1"></i>Cost Price</th>
                <th class="pb-3"><i class="fas fa-tag mr-1"></i>Selling Price</th>
                <th class="pb-3"><i class="fas fa-cubes mr-1"></i>Stock</th>
                <th class="pb-3"><i class="fas fa-cogs mr-1"></i>Actions</th>
            </tr>
        </thead>
        <tbody>
            @forelse($products as $product)
            <tr class="border-b dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-700">
                <td class="py-3 text-gray-800 dark:text-white">{{ $product->name }}</td>
                <td class="py-3 text-gray-600 dark:text-gray-400">{{ $product->sku }}</td>
                <td class="py-3 text-gray-600 dark:text-gray-400">${{ number_format($product->cost_price, 2) }}</td>
                <td class="py-3 text-gray-600 dark:text-gray-400">${{ number_format($product->selling_price, 2) }}</td>
                <td class="py-3 text-gray-800 dark:text-white">{{ $product->stock }}</td>
                <td class="py-3">
                    <a href="{{ route('products.edit', $product) }}" class="text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300 mr-3"><i class="fas fa-edit"></i> Edit</a>
                    <form action="{{ route('products.destroy', $product) }}" method="POST" class="inline">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-300" onclick="return confirm('Are you sure?')"><i class="fas fa-trash"></i> Delete</button>
                    </form>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="6" class="py-3 text-center text-gray-500 dark:text-gray-400">No products found</td>
            </tr>
            @endforelse
        </tbody>
    </table>
</div>
@endsection