@extends('layouts.app')
@section('content')
<div>
    <div class="mb-4 text-sm text-gray-500">{{ $project?->name }} › Unit Categories</div>
    <div class="flex items-center justify-between mb-4">
        <h1 class="text-2xl font-semibold">Unit Categories</h1>
        <a href="{{ route('unit-categories.create') }}" class="px-4 py-2 rounded-xl bg-[var(--primary)] text-white">Add Category</a>
    </div>
    <div class="bg-white rounded-2xl border shadow">
        <table class="min-w-full text-sm">
            <thead class="bg-gray-50">
            <tr>
                <th class="px-4 py-2 text-left">Type</th>
                <th class="px-4 py-2 text-left"><a href="{{ route('unit-categories.index', ['sort'=>'name','order'=>$order==='asc'?'desc':'asc']) }}">Name</a></th>
                <th class="px-4 py-2 text-left"><a href="{{ route('unit-categories.index', ['sort'=>'size_sqft','order'=>$order==='asc'?'desc':'asc']) }}">Size Sqft</a></th>
                <th class="px-4 py-2 text-left">Base Rate/Sqft</th>
                <th class="px-4 py-2 text-left">Actions</th>
            </tr>
            </thead>
            <tbody>
            @forelse($categories as $c)
                <tr class="border-t">
                    <td class="px-4 py-2">{{ $c->propertyType?->name }}</td>
                    <td class="px-4 py-2">{{ $c->name }}</td>
                    <td class="px-4 py-2">{{ $c->size_sqft }}</td>
                    <td class="px-4 py-2">{{ number_format($c->base_rate_sqft, 2) }}</td>
                    <td class="px-4 py-2 space-x-2">
                        <a href="{{ route('unit-categories.edit', $c) }}" class="text-[var(--primary)]">Edit</a>
                        <form method="POST" action="{{ route('unit-categories.destroy', $c) }}" style="display:inline" onsubmit="return confirm('Are you sure?')">
                            @csrf @method('DELETE')
                            <button class="text-red-600">Delete</button>
                        </form>
                    </td>
                </tr>
            @empty
                <tr><td colspan="5" class="px-4 py-8 text-center text-gray-500">No unit categories</td></tr>
            @endforelse
            </tbody>
        </table>
        <div class="p-4">{{ $categories->links() }}</div>
    </div>
</div>
@endsection