@extends('layouts.app')

@section('title', "Today's Attendance")
@section('header', "Today's Attendance")
@section('subheader', now()->format('l, M d Y'))

@section('header-actions')
    <a href="{{ route('attendances.index') }}" class="btn btn-outline-secondary"><i class="bi bi-list-ul me-1"></i>All Records</a>
@endsection

@section('content')
    @can('recordOwn', App\Models\AttendanceSummary::class)
        @include('attendances._punch-widget', ['todaySummary' => $todaySummary])
    @endcan

    <div class="card table-wrapper">
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        @if ($canViewAll)<th>Employee</th>@endif
                        <th>In</th><th>Out</th><th>Hours</th><th>Late</th><th>Overtime</th><th>Status</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($summaries as $row)
                        <tr>
                            @if ($canViewAll)<td>{{ $row->employee?->full_name ?? '—' }}</td>@endif
                            <td>{{ $row->first_in?->format('H:i') ?? '—' }}
                                @if ($row->is_missing_punch)<i class="bi bi-exclamation-triangle text-warning ms-1" title="Missing punch"></i>@endif
                            </td>
                            <td>{{ $row->last_out?->format('H:i') ?? '—' }}</td>
                            <td>{{ $row->worked_hours }}</td>
                            <td>{{ $row->late_minutes ? $row->late_minutes.'m' : '—' }}</td>
                            <td>{{ $row->overtime_minutes ? $row->overtime_minutes.'m' : '—' }}</td>
                            <td><x-status-badge :status="$row->status" /></td>
                        </tr>
                    @empty
                        <tr><td colspan="{{ $canViewAll ? 7 : 6 }}" class="text-center text-muted py-4">No attendance recorded today yet.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
@endsection