@extends('layouts.dental')
@section('title', 'Dashboard')
@section('content')
<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px">
    <div class="card" style="padding:20px">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
            <span style="font-size:13px;color:#64748b;font-weight:500">Consultas Hoje</span>
            <span style="font-size:22px">📅</span>
        </div>
        <div style="font-size:32px;font-weight:700;color:#1a202c">{{ $todayAppointments }}</div>
        <div style="font-size:12px;color:#94a3b8;margin-top:4px">agendadas para hoje</div>
    </div>
    <div class="card" style="padding:20px">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
            <span style="font-size:13px;color:#64748b;font-weight:500">Pacientes</span>
            <span style="font-size:22px">👥</span>
        </div>
        <div style="font-size:32px;font-weight:700;color:#1a202c">{{ $totalPatients }}</div>
        <div style="font-size:12px;color:#94a3b8;margin-top:4px">cadastrados no sistema</div>
    </div>
    <div class="card" style="padding:20px">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
            <span style="font-size:13px;color:#64748b;font-weight:500">Entradas Hoje</span>
            <span style="font-size:22px">💰</span>
        </div>
        <div style="font-size:28px;font-weight:700;color:#1a202c">R$ {{ number_format($todayIncome,2,',','.') }}</div>
        <div style="font-size:12px;color:#94a3b8;margin-top:4px">recebido hoje</div>
    </div>
    <div class="card" style="padding:20px">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
            <span style="font-size:13px;color:#64748b;font-weight:500">Confirmados</span>
            <span style="font-size:22px">✅</span>
        </div>
        <div style="font-size:32px;font-weight:700;color:#1a202c">{{ $confirmedAppointments }}</div>
        <div style="font-size:12px;color:#94a3b8;margin-top:4px">confirmados para hoje</div>
    </div>
</div>
<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px">
    <div class="card">
        <div style="padding:16px 20px;border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;align-items:center">
            <span style="font-weight:600;color:#1a202c">Próximas Consultas</span>
            <a href="{{ route('appointments.index') }}" style="color:#2563eb;font-size:13px;text-decoration:none">Ver agenda →</a>
        </div>
        @forelse($nextAppointments as $apt)
        <div style="padding:12px 20px;border-bottom:1px solid #f8fafc;display:flex;align-items:center;gap:12px">
            <div class="avatar-circle">{{ substr($apt->patient->name,0,1) }}</div>
            <div style="flex:1;min-width:0">
                <div style="font-weight:600;font-size:13px;color:#1a202c">{{ $apt->patient->name }}</div>
                <div style="font-size:12px;color:#64748b">{{ $apt->starts_at->format('H:i') }} — {{ $apt->professional->name }}</div>
            </div>
            <span class="badge badge-blue">{{ ucfirst($apt->status) }}</span>
        </div>
        @empty
        <div style="padding:32px;text-align:center;color:#94a3b8;font-size:14px">Nenhuma consulta hoje</div>
        @endforelse
    </div>
    <div class="card">
        <div style="padding:16px 20px;border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;align-items:center">
            <span style="font-weight:600;color:#1a202c">Últimos Pacientes</span>
            <a href="{{ route('patients.index') }}" style="color:#2563eb;font-size:13px;text-decoration:none">Ver todos →</a>
        </div>
        @forelse($recentPatients as $patient)
        <div style="padding:12px 20px;border-bottom:1px solid #f8fafc;display:flex;align-items:center;gap:12px">
            <div class="avatar-circle">{{ substr($patient->name,0,1) }}</div>
            <div style="flex:1;min-width:0">
                <div style="font-weight:600;font-size:13px;color:#1a202c">{{ $patient->name }}</div>
                <div style="font-size:12px;color:#64748b">{{ $patient->phone ?? 'Sem telefone' }}</div>
            </div>
            <a href="{{ route('patients.show', $patient) }}" style="color:#2563eb;font-size:12px;text-decoration:none">Ver</a>
        </div>
        @empty
        <div style="padding:32px;text-align:center;color:#94a3b8;font-size:14px">Nenhum paciente cadastrado</div>
        @endforelse
    </div>
</div>
@endsection