@extends('layouts.app')
@section('title', 'Attendance Log')
@section('content')
<h4 class="mb-3">Staff Attendance Log</h4>
<form class="mb-3">
    <input type="date" name="date" value="{{ $date }}" class="form-control" style="max-width:200px;" onchange="this.form.submit()">
</form>
<table class="table bg-white">
    <thead><tr><th>Staff</th><th>Clock In</th><th>Location</th><th>Clock Out</th><th>Hours</th></tr></thead>
    <tbody>
    @forelse ($records as $r)
    <tr class="{{ $r->outside_geofence ? 'table-warning' : '' }}">
        <td>{{ $r->user->name }}</td>
        <td>{{ $r->clock_in?->format('h:i A') ?? '-' }}</td>
        <td>
            @if ($r->allowedLocation)
                {{ $r->allowedLocation->name }}
            @elseif ($r->outside_geofence)
                <span class="text-danger">⚠ Outside registered location</span>
            @else
                -
            @endif
        </td>
        <td>{{ $r->clock_out?->format('h:i A') ?? '-' }}</td>
        <td>{{ $r->hoursWorked() ?? '-' }}</td>
    </tr>
    @empty
    <tr><td colspan="5" class="text-muted">No attendance recorded for this date.</td></tr>
    @endforelse
    </tbody>
</table>
@endsection