@extends('layouts.app')

@section('title', __('app.dashboard'))
@section('page_title', __('app.welcome') . ', ' . auth()->user()->name)

@section('content')
<div class="container-fluid">
    <!-- Stats Cards -->
    <div class="row">
        <div class="col-lg-3 col-6">
            <div class="small-box bg-info">
                <div class="inner">
                    <h3>{{ $stats['total_patients'] }}</h3>
                    <p>{{ __('app.patients') }}</p>
                </div>
                <div class="icon">
                    <i class="fas fa-users"></i>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-6">
            <div class="small-box bg-success">
                <div class="inner">
                    <h3>{{ $stats['today_appointments'] }}</h3>
                    <p>{{ __('app.appointments') }} ({{ __('app.today') ?? 'Today' }})</p>
                </div>
                <div class="icon">
                    <i class="fas fa-calendar-check"></i>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-6">
            <div class="small-box bg-warning">
                <div class="inner">
                    <h3>{{ $stats['pending_invoices'] }}</h3>
                    <p>{{ __('app.pending_invoices') ?? 'Pending Invoices' }}</p>
                </div>
                <div class="icon">
                    <i class="fas fa-file-invoice"></i>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-6">
            <div class="small-box bg-danger">
                <div class="inner">
                    <h3>{{ number_format($stats['month_revenue'], 2) }}</h3>
                    <p>{{ __('app.month_revenue') ?? 'Month Revenue' }}</p>
                </div>
                <div class="icon">
                    <i class="fas fa-money-bill-wave"></i>
                </div>
            </div>
        </div>
    </div>

    <!-- Recent Appointments -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">{{ __('app.upcoming_appointments') ?? 'Upcoming Appointments' }}</h3>
                </div>
                <div class="card-body table-responsive p-0">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>{{ __('app.patient') ?? 'Patient' }}</th>
                                <th>{{ __('app.therapist') ?? 'Therapist' }}</th>
                                <th>{{ __('app.date') }}</th>
                                <th>{{ __('app.time') }}</th>
                                <th>{{ __('app.status') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($recent_appointments as $appointment)
                            <tr>
                                <td>{{ $appointment->patient->fullName() }}</td>
                                <td>{{ $appointment->user->name }}</td>
                                <td>{{ $appointment->appointment_date->format('Y-m-d') }}</td>
                                <td>{{ $appointment->appointment_date->format('H:i') }}</td>
                                <td>
                                    <span class="badge badge-{{ $appointment->status === 'completed' ? 'success' : ($appointment->status === 'cancelled' ? 'danger' : 'primary') }}">
                                        {{ $appointment->status }}
                                    </span>
                                </td>
                            </tr>
                            @empty
                            <tr>
                                <td colspan="5" class="text-center">{{ __('app.no_appointments') ?? 'No upcoming appointments' }}</td>
                            </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection