@extends('layouts.cabinet')

@section('title', 'Виджеты — Placeo')

@section('cabinet')
<div>
    <div class="mb-6 flex items-center justify-between">
        <h1 class="text-2xl font-bold">Виджеты для сайта</h1>
        <a href="{{ route('cabinet.widgets.create') }}" class="btn-brand">Создать виджет</a>
    </div>

    @if (session('status'))
        <div class="mb-4 rounded-lg bg-brand-50 px-4 py-3 text-sm text-brand-800">{{ session('status') }}</div>
    @endif

    <p class="mb-4 text-sm text-muted">Встраивайте ленту объявлений Placeo на свой сайт. Виджет подстраивается под контейнер, не ломает вёрстку и позволяет подавать объявления прямо с вашего сайта.</p>

    @forelse ($widgets as $widget)
        <div class="card mb-3 flex items-center justify-between p-4">
            <div>
                <div class="font-semibold text-gray-900">{{ $widget->name }}</div>
                <div class="text-xs text-muted">Ключ: {{ $widget->public_key }} · категорий: {{ count($widget->categoryIds()) }}</div>
            </div>
            <a href="{{ route('cabinet.widgets.edit', $widget) }}" class="btn-ghost px-4 py-2 text-sm">Настроить</a>
        </div>
    @empty
        <div class="card grid place-items-center p-12 text-center text-muted">
            <div><div class="mb-2 text-4xl">🧩</div>У вас пока нет виджетов.</div>
        </div>
    @endforelse
</div>
@endsection