@extends('layouts.admin')

@section('title', 'Brands')

@section('content')
@php
    $sortKey = $sortKey ?? 'name_asc';
    $stats = $stats ?? ['total' => 0, 'active' => 0, 'unused' => 0, 'products' => 0];
@endphp

<div class="ci-page">
    <nav class="ci-crumb" aria-label="Breadcrumb">
        <span>Catalogue</span>
        <span class="ci-crumb__sep">/</span>
        <span class="ci-crumb__current">Brands</span>
    </nav>

    <div class="ci-header">
        <div>
            <h1>Brands</h1>
            <p class="ci-header__sub">Manage brand logos, status, and linked product counts.</p>
        </div>
        <div class="ci-header__actions">
            @can('brands.create')
                <a href="{{ route('admin.brands.create') }}" class="ci-btn ci-btn--primary">
                    <i class="bi bi-plus-lg"></i> Add Brand
                </a>
            @endcan
        </div>
    </div>

    <div class="ci-stats">
        <div class="ci-stat">
            <div>
                <p class="ci-stat__label">Total</p>
                <p class="ci-stat__value">{{ number_format($stats['total']) }}</p>
            </div>
            <span class="ci-stat__icon"><i class="bi bi-tags"></i></span>
        </div>
        <div class="ci-stat">
            <div>
                <p class="ci-stat__label">Active</p>
                <p class="ci-stat__value ci-stat__value--success">{{ number_format($stats['active']) }}</p>
            </div>
            <span class="ci-stat__icon"><i class="bi bi-check-circle"></i></span>
        </div>
        <div class="ci-stat">
            <div>
                <p class="ci-stat__label">Unused</p>
                <p class="ci-stat__value ci-stat__value--warning">{{ number_format($stats['unused']) }}</p>
            </div>
            <span class="ci-stat__icon"><i class="bi bi-dash-circle"></i></span>
        </div>
        <div class="ci-stat">
            <div>
                <p class="ci-stat__label">Linked products</p>
                <p class="ci-stat__value">{{ number_format($stats['products']) }}</p>
            </div>
            <span class="ci-stat__icon"><i class="bi bi-box-seam"></i></span>
        </div>
    </div>

    <form method="GET" action="{{ route('admin.brands.index') }}" class="ci-filters">
        <div class="row g-2 align-items-center justify-content-end flex-nowrap">
            <div class="col-lg-2">
                <div class="products-search-wrap">
                    <i class="bi bi-search"></i>
                    <input type="text"
                           name="search"
                           class="admin-form-control form-control"
                           placeholder="Search brand or slug…"
                           value="{{ request('search') }}">
                </div>
            </div>
            <div class="col-lg-2">
                <select name="status" onchange="this.form.submit()">
                    <option value="">All status</option>
                    <option value="active" {{ request('status') === 'active' ? 'selected' : '' }}>Active</option>
                    <option value="inactive" {{ request('status') === 'inactive' ? 'selected' : '' }}>Inactive</option>
                </select>
            </div>
            <div class="col-lg-2">
                <select name="sort" onchange="this.form.submit()">
                    <option value="name_asc" {{ $sortKey === 'name_asc' ? 'selected' : '' }}>Name A–Z</option>
                    <option value="name_desc" {{ $sortKey === 'name_desc' ? 'selected' : '' }}>Name Z–A</option>
                    <option value="products_count_desc" {{ $sortKey === 'products_count_desc' ? 'selected' : '' }}>Most products</option>
                    <option value="products_count_asc" {{ $sortKey === 'products_count_asc' ? 'selected' : '' }}>Fewest products</option>
                    <option value="updated_at_desc" {{ $sortKey === 'updated_at_desc' ? 'selected' : '' }}>Recently updated</option>
                </select>
            </div>
            <div class="ci-filters__actions col-lg-2">
                <button type="submit" class="ci-btn ci-btn--primary">Filter</button>
                @if(request()->hasAny(['search','status','sort']))
                    <a href="{{ route('admin.brands.index') }}" class="ci-btn ci-btn--ghost ci-btn--icon" title="Clear filters">
                        <i class="bi bi-arrow-clockwise"></i>
                    </a>
                @endif
            </div>
            <div class="ci-filters__count col-auto text-end">
                Showing <strong>{{ $brands->count() }}</strong> of <strong>{{ $brands->total() }}</strong> brands
            </div>
        </div>
    </form>

    <div class="ci-table-card">
        <div class="ci-table-wrap">
            <table class="ci-table">
                <thead>
                    <tr>
                        <th>Brand</th>
                        <th>Slug</th>
                        <th>Products</th>
                        <th>Status</th>
                        <th>Updated</th>
                        <th style="text-align:right;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($brands as $brand)
                        @php
                            $initials = strtoupper(mb_substr($brand->name, 0, 2));
                        @endphp
                        <tr>
                            <td>
                                <div class="ci-entity">
                                    @if($brand->logo_path)
                                        <img src="{{ asset('storage/' . $brand->logo_path) }}"
                                             alt="{{ $brand->name }}"
                                             class="ci-avatar ci-avatar--logo"
                                             onerror="this.onerror=null;this.outerHTML='<span class=&quot;ci-avatar&quot;>{{ $initials }}</span>';">
                                    @else
                                        <span class="ci-avatar">{{ $initials }}</span>
                                    @endif
                                    <div class="ci-entity__meta">
                                        <p class="ci-entity__name">{{ $brand->name }}</p>
                                    </div>
                                </div>
                            </td>
                            <td><code class="ci-code">{{ $brand->slug }}</code></td>
                            <td>
                                <span class="ci-pill ci-pill--count">{{ $brand->products_count ?? 0 }}</span>
                            </td>
                            <td>
                                <span class="ci-pill {{ $brand->is_active ? 'ci-pill--active' : 'ci-pill--inactive' }}">
                                    {{ $brand->is_active ? 'Active' : 'Inactive' }}
                                </span>
                            </td>
                            <td class="ci-muted">
                                {{ optional($brand->updated_at)->format('M d, Y') ?? '—' }}
                            </td>
                            <td>
                                <div class="ci-actions">
                                    @can('brands.update')
                                        <a href="{{ route('admin.brands.edit', $brand->id) }}"
                                           class="ci-btn ci-btn--ghost ci-btn--icon"
                                           title="Edit">
                                            <i class="bi bi-pencil"></i>
                                        </a>
                                    @endcan
                                    @can('brands.delete')
                                        <form action="{{ route('admin.brands.destroy', $brand->id) }}"
                                              method="POST"
                                              class="d-inline"
                                              onsubmit="return confirm('Are you sure you want to delete this brand?')">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="ci-btn ci-btn--danger-outline ci-btn--icon" title="Delete">
                                                <i class="bi bi-trash"></i>
                                            </button>
                                        </form>
                                    @endcan
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6">
                                <div class="ci-empty">
                                    <i class="bi bi-tag"></i>
                                    <h3>No Brands Found</h3>
                                    @can('brands.create')
                                        <p>Get started by creating your first brand.</p>
                                        <a href="{{ route('admin.brands.create') }}" class="ci-btn ci-btn--primary">
                                            <i class="bi bi-plus-lg"></i> Add Brand
                                        </a>
                                    @endcan
                                </div>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if($brands->total() > 0)
        <div class="ci-pagination">
            <div class="ci-pagination__info">
                Showing <strong>{{ $brands->firstItem() ?? 0 }}</strong>–<strong>{{ $brands->lastItem() ?? 0 }}</strong>
                of <strong>{{ $brands->total() }}</strong>
            </div>
            @if($brands->hasPages())
            <div>
                {{ $brands->links('vendor.pagination.admin-categories') }}
            </div>
            @endif
        </div>
        @endif
    </div>
</div>
@endsection