@extends('layouts.admin')
@section('title', 'Produtos & Serviços')

@section('breadcrumb')
    <a class="breadcrumb-item" href="#">Cadastros</a>
    <span class="breadcrumb-separator">/</span>
    <span class="breadcrumb-current">Produtos & Serviços</span>
@endsection

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">Produtos & Serviços</h1>
        <p class="page-subtitle">Itens que podem ser lançados no consumo das reservas.</p>
    </div>
    <div class="flex gap-sm">
        <a href="{{ route('admin.registers.product-categories.index') }}" class="btn btn-secondary">
            <i data-lucide="tag" style="width:16px;height:16px;"></i> Categorias
        </a>
        <a href="{{ route('admin.registers.products.create') }}" class="btn btn-primary">
            <i data-lucide="plus" style="width:16px;height:16px;"></i> Novo Item
        </a>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success mb-lg">{{ session('success') }}</div>
@endif
@if(session('error'))
    <div class="alert alert-danger mb-lg">{{ session('error') }}</div>
@endif

<div class="card mb-lg">
    <div class="card-header flex-between" style="flex-wrap:wrap;gap:var(--space-md);">
        <form method="GET" action="{{ route('admin.registers.products.index') }}"
              class="flex gap-sm" style="flex:1;min-width:300px;flex-wrap:wrap;">
            <input type="text" name="search" class="form-input" placeholder="Buscar produto ou serviço..."
                   value="{{ request('search') }}" style="flex:1;min-width:200px;">

            <select name="category_id" class="form-select" style="min-width:160px;">
                <option value="">Todas Categorias</option>
                @foreach($categories as $cat)
                    <option value="{{ $cat->id }}" {{ request('category_id') == $cat->id ? 'selected' : '' }}>
                        {{ $cat->name }}
                    </option>
                @endforeach
            </select>

            <select name="type" class="form-select" style="min-width:130px;">
                <option value="">Produto & Serviço</option>
                <option value="product" {{ request('type') == 'product' ? 'selected' : '' }}>📦 Produto</option>
                <option value="service" {{ request('type') == 'service' ? 'selected' : '' }}>✨ Serviço</option>
            </select>

            <select name="active" class="form-select" style="min-width:120px;">
                <option value="">Todos Status</option>
                <option value="1" {{ request('active') === '1' ? 'selected' : '' }}>Ativos</option>
                <option value="0" {{ request('active') === '0' ? 'selected' : '' }}>Inativos</option>
            </select>

            <button type="submit" class="btn btn-secondary">
                <i data-lucide="filter" style="width:16px;height:16px;"></i>
            </button>
            @if(request()->hasAny(['search','category_id','type','active']))
                <a href="{{ route('admin.registers.products.index') }}" class="btn btn-ghost" title="Limpar">
                    <i data-lucide="x" style="width:16px;height:16px;"></i>
                </a>
            @endif
        </form>
    </div>

    <div class="table-wrapper">
        <table class="table">
            <thead>
                <tr>
                    <th>Nome</th>
                    <th>Categoria</th>
                    <th>Tipo</th>
                    <th>Preço Unit.</th>
                    <th>Unidade</th>
                    <th>Status</th>
                    <th class="text-right">Ações</th>
                </tr>
            </thead>
            <tbody>
                @forelse($products as $product)
                <tr>
                    <td>
                        <div style="font-weight:700;">{{ $product->name }}</div>
                        @if($product->description)
                            <div style="font-size:12px;color:var(--color-text-muted);">{{ Str::limit($product->description, 60) }}</div>
                        @endif
                    </td>
                    <td>
                        <span class="badge badge-neutral">{{ $product->category?->name ?? '—' }}</span>
                    </td>
                    <td>
                        @if($product->type === 'service')
                            <span class="badge badge-primary">✨ Serviço</span>
                        @else
                            <span class="badge badge-neutral">📦 Produto</span>
                        @endif
                    </td>
                    <td style="font-weight:700;color:var(--color-primary-dark);">
                        R$ {{ number_format($product->unit_price, 2, ',', '.') }}
                    </td>
                    <td>{{ $product->unit ?: '—' }}</td>
                    <td>
                        @if($product->is_active)
                            <span class="badge badge-success">Ativo</span>
                        @else
                            <span class="badge badge-neutral" style="opacity:.6;">Inativo</span>
                        @endif
                    </td>
                    <td class="text-right">
                        <div class="flex gap-sm" style="justify-content:flex-end;">
                            <a href="{{ route('admin.registers.products.edit', $product) }}" class="btn btn-sm btn-secondary">
                                <i data-lucide="edit-2" style="width:14px;height:14px;"></i>
                            </a>
                            <form action="{{ route('admin.registers.products.destroy', $product) }}" method="POST"
                                  onsubmit="return confirm('Excluir este produto?');" style="display:inline;">
                                @csrf @method('DELETE')
                                <button type="submit" class="btn btn-sm btn-danger">
                                    <i data-lucide="trash-2" style="width:14px;height:14px;"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="7" class="text-center" style="padding:var(--space-2xl);">
                        <div style="color:var(--color-text-muted);margin-bottom:var(--space-md);">
                            <i data-lucide="package" style="width:48px;height:48px;opacity:0.4;"></i>
                        </div>
                        <p>Nenhum produto ou serviço cadastrado.</p>
                        @if(!request()->hasAny(['search','category_id','type','active']))
                            <a href="{{ route('admin.registers.products.create') }}" class="btn btn-primary mt-md">Cadastrar Primeiro Item</a>
                        @endif
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    @if($products->hasPages())
    <div class="card-footer">{{ $products->links() }}</div>
    @endif
</div>
@endsection