@extends('layouts.app')
@section('title', 'Dashboard')

@section('content')
<h1 class="text-2xl font-bold mb-6">Dashboard</h1>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
    <div class="bg-white rounded shadow p-4 flex justify-between items-center">
        <div>
            <h3 class="text-sm text-gray-500">Total Atendimentos</h3>
            <p class="text-2xl font-bold">{{ $total }}</p>
        </div>
        <div class="text-blue-500 text-3xl">📊</div>
    </div>
    <div class="bg-white rounded shadow p-4 flex justify-between items-center">
        <div>
            <h3 class="text-sm text-gray-500">Em Andamento</h3>
            <p class="text-2xl font-bold">{{ $emAndamento }}</p>
        </div>
        <div class="text-yellow-500 text-3xl">⏳</div>
    </div>
    <div class="bg-white rounded shadow p-4 flex justify-between items-center">
        <div>
            <h3 class="text-sm text-gray-500">Concluídos</h3>
            <p class="text-2xl font-bold">{{ $concluidos }}</p>
        </div>
        <div class="text-green-500 text-3xl">✅</div>
    </div>
    <div class="bg-white rounded shadow p-4 flex justify-between items-center">
        <div>
            <h3 class="text-sm text-gray-500">Pendentes</h3>
            <p class="text-2xl font-bold">{{ $pendentes }}</p>
        </div>
        <div class="text-red-500 text-3xl">❗</div>
    </div>
</div>
@endsection