@extends('layouts.admin', ['title' => 'Manage Businesses - Booklio', 'pageTitle' => $pageTitle ?? 'Manage Businesses', 'active' => $active ?? 'settings'])

@section('content')
    <div class="space-y-5">
        <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
            <div>
                <p class="text-sm font-semibold text-booklio-muted">Switch between business workspaces connected to your account.</p>
            </div>
            <x-ui.button href="{{ route('admin.businesses.create') }}">
                <x-ui.icon name="plus" class="h-4 w-4" />
                Add New Business
            </x-ui.button>
        </div>

        <x-ui.card title="Your Businesses" description="These records come from the authenticated user's owned and assigned businesses.">
            @if ($businesses->isEmpty())
                <x-ui.empty-state
                    icon="briefcase"
                    title="No businesses found"
                    description="Create a business workspace to start using Booklio."
                />
            @else
                <div class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
                    @foreach ($businesses as $business)
                        @php
                            $isCurrent = optional($currentBusiness)->is($business);
                            $planName = $business->subscription?->plan?->name ?? 'Trial';
                        @endphp
                        <article @class([
                            'rounded-lg border bg-white p-4 shadow-soft',
                            'border-booklio-primary ring-4 ring-blue-100' => $isCurrent,
                            'border-booklio-border' => ! $isCurrent,
                        ])>
                            <div class="flex items-start gap-3">
                                <span class="flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-booklio-primary text-sm font-extrabold text-white">
                                    {{ collect(explode(' ', $business->name))->filter()->take(2)->map(fn ($part) => strtoupper(substr($part, 0, 1)))->implode('') ?: 'B' }}
                                </span>
                                <div class="min-w-0 flex-1">
                                    <h2 class="truncate text-base font-extrabold text-booklio-dark">{{ $business->name }}</h2>
                                    <p class="mt-1 truncate text-xs font-semibold text-booklio-muted">{{ $business->email ?: 'No email saved' }}</p>
                                    <div class="mt-3 flex flex-wrap gap-2">
                                        <x-ui.badge :variant="$business->status === 'active' ? 'success' : 'warning'">{{ ucfirst($business->status) }}</x-ui.badge>
                                        <x-ui.badge variant="primary">{{ $planName }}</x-ui.badge>
                                        @if ($isCurrent)
                                            <x-ui.badge>Current</x-ui.badge>
                                        @endif
                                    </div>
                                </div>
                            </div>

                            <div class="mt-4 grid gap-2 sm:grid-cols-2">
                                <a href="{{ route('admin.settings.business') }}" class="inline-flex h-10 items-center justify-center rounded-lg border border-booklio-border bg-white px-3 text-sm font-bold text-slate-700 shadow-soft hover:bg-slate-50">
                                    Manage
                                </a>
                                @if ($isCurrent)
                                    <button type="button" disabled class="inline-flex h-10 items-center justify-center rounded-lg bg-blue-50 px-3 text-sm font-bold text-booklio-primary">
                                        Selected
                                    </button>
                                @else
                                    <form method="POST" action="{{ route('admin.businesses.switch', $business) }}">
                                        @csrf
                                        <button type="submit" class="inline-flex h-10 w-full items-center justify-center rounded-lg bg-booklio-primary px-3 text-sm font-bold text-white shadow-card shadow-blue-500/20 hover:bg-blue-700">
                                            Switch
                                        </button>
                                    </form>
                                @endif
                            </div>
                        </article>
                    @endforeach
                </div>
            @endif
        </x-ui.card>
    </div>
@endsection