<?php

use App\Models\Crew;
use Livewire\Component;

new class extends Component {
    public Crew $crew;

    public function mount(Crew $crew): void
    {
        $this->crew = $crew;
    }
};
?>

<div
    class="card bg-card flex items-center gap-4 rounded-xl transition-colors hover:bg-secondary/50 active:scale-[0.98]  p-4">
    <div class="grid h-10 w-10 place-items-center rounded-xl bg-primary/15 text-primary-foreground mb-2">
        <x-bi-people class="h-6 w-6 text-primary"/>
    </div>
    <div class="flex-1 overflow-hidden">
        <h3 class="truncate text-sm font-semibold">{{ $crew->name }}</h3>
        <p>{{ $crew->description }}</p>
        <div class="mt-1 flex items-center gap-3 text-xs text-muted-foreground">
            <span class="flex items-center gap-1">
                <x-bi-people class="h-3 w-3"/>
                {{ $crew->users_count }}
            </span>
            <span>
                {{ $crew->patches_count }} patches
            </span>
            <span class="text-primary font-medium">
                {{ $crew->patches_count }} earned
            </span>
        </div>
    </div>
</div>
