@extends('admin.layouts.app')

@section('title','Produse')

@push('styles')
    <style>
        .page-hero{background:radial-gradient(900px 400px at 0% -10%,rgba(13,110,253,.08),transparent 60%),radial-gradient(500px 300px at 100% 0%,rgba(32,201,151,.12),transparent 60%);border-radius:1rem}
        .card.fancy{border:1px solid var(--bs-border-color);transition:transform .18s ease,box-shadow .18s ease}
        .card.fancy:hover{transform:translateY(-2px);box-shadow:0 .75rem 1.5rem rgba(0,0,0,.06)}
        .avatar-thumb{width:48px;height:48px;object-fit:cover;border-radius:.5rem;border:1px solid var(--bs-border-color)}
        .badge-soft{background:rgba(13,110,253,.1);color:#0d6efd}
        .fade-in{animation:fadeIn .25s ease}
        @keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
        .search-wrap{position:relative}
        .search-wrap .bi-search{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);opacity:.6}
        .search-wrap input{padding-left:2.25rem}
    </style>
@endpush

@section('content')
    <div class="container-fluid">

        @if(session('success'))
            <div class="alert alert-success fade-in mt-3"><i class="bi bi-check2-circle me-1"></i>{{ session('success') }}</div>
        @endif

            @if ($errors->any())
                <div class="alert alert-danger">
                    <strong>Verifică erorile:</strong>
                    <ul class="mb-0">
                        @foreach ($errors->all() as $e) <li>{{ $e }}</li> @endforeach
                    </ul>
                </div>
            @endif

        <div class="page-hero p-4 mb-4 mt-4">
            <div class="d-flex align-items-center justify-content-between">
                <div class="d-flex align-items-center gap-3">
                    <span class="badge rounded-pill badge-soft px-3 py-2"><i class="bi bi-box-seam me-1"></i> Produse</span>
                    <h3 class="mb-0">Administrare produse</h3>
                </div>
                <a href="{{ route('admin.products.create') }}" class="btn btn-primary">
                    <i class="bi bi-plus-circle me-1"></i> Adaugă produs
                </a>
            </div>
            <div class="text-secondary mt-2">Total: <span class="badge text-bg-primary">{{ $countAll }}</span></div>
        </div>

        <div class="card fancy fade-in">
            <div class="card-body">
                <form method="get" class="row g-3 align-items-center mb-3">
                    <div class="col-md-6">
                        <div class="search-wrap">
                            <i class="bi bi-search"></i>
                            <input type="text" class="form-control" name="q" value="{{ $q }}" placeholder="Caută după nume, slug sau #id…">
                        </div>
                    </div>
                    <div class="col-md-6 text-md-end">
                        <button class="btn btn-outline-secondary me-2"><i class="bi bi-filter me-1"></i>Filtrează</button>
                        <a href="{{ route('admin.products.index') }}" class="btn btn-outline-secondary"><i class="bi bi-x-circle me-1"></i>Reset</a>
                    </div>
                </form>

                <div class="table-responsive">
                    <table class="table align-middle">
                        <thead class="table-light">
                        <tr>
                            <th>Produs</th>
                            <th>Brand</th>
                            <th>Preț</th>
                            <th>Activ</th>
                            <th>Categorie implicită</th>
                            <th>Creat</th>
                            <th class="text-end">Acțiuni</th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($products as $p)
                            @php
                                $img = $p->mainImage;
                                $disk = $img->disk ?? 'public';
                                $thumb = $img ? (data_get($img->meta,'thumb_312x340') ?? $img->path) : null;
                                $src = $img ? Storage::disk($disk)->url($thumb) : asset('assets/img/product/default.webp');
                            @endphp
                            <tr>
                                <td>
                                    <div class="d-flex align-items-center gap-3">
                                        <img class="avatar-thumb" src="{{ $src }}" alt="{{ $p->name }}">
                                        <div>
                                            <div class="fw-semibold">{{ $p->name }}</div>
                                            <div class="small text-secondary">#{{ $p->id }} · <code>{{ $p->slug }}</code></div>
                                        </div>
                                    </div>
                                </td>
                                <td>{{ $p->brand?->name ?? '—' }}</td>
                                <td><span class="fw-semibold">{{ number_format((float)$p->price,2) }}</span></td>
                                <td>
                                    @if($p->active)
                                        <span class="badge text-bg-success">activ</span>
                                    @else
                                        <span class="badge text-bg-secondary">inactiv</span>
                                    @endif
                                </td>
                                <td>{{ $p->defaultCategory?->name ?? '—' }}</td>
                                <td class="text-secondary">{{ $p->created_at?->format('d.m.Y H:i') }}</td>
                                <td class="text-end">
                                    <div class="btn-group">
                                        <a class="btn btn-sm btn-outline-primary" href="{{ route('admin.products.edit',$p) }}"><i class="bi bi-pencil-square"></i> Editează</a>
                                        <form class="d-inline" action="{{ route('admin.products.destroy',$p) }}" method="post" onsubmit="return confirm('Ștergi produsul?');">
                                            @csrf @method('DELETE')
                                            <button class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="7" class="text-center text-secondary py-4">Nu există produse.</td></tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>

                @if($products->hasPages())
                    <div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2 mt-3">
                        <small class="text-muted">
                            Afișate
                            {{ $products->firstItem() }}–{{ $products->lastItem() }}
                            din {{ $products->total() }} produse
                        </small>

                        {{ $products->onEachSide(1)->links('pagination::bootstrap-5') }}
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection