@extends('layouts.admin')

@section('title', 'Activity Logs')

@section('content')
<div class="dashboard-header" style="margin-bottom: 24px; display: flex; justify-content: space-between; align-items: center;">
    <div>
        <h1 style="font-family:'Oswald',sans-serif; font-size:2rem; color:var(--primary); margin:0;">Activity Logs</h1>
        <p style="color:var(--text-muted); font-size:0.88rem; margin:4px 0 0;">Recent admin actions and system events.</p>
    </div>
</div>

<div class="admin-card">
    <div class="admin-card-body" style="padding:0;">
        @if($logs->count())
        <div class="table-responsive">
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>User</th>
                        <th>Action</th>
                        <th>Details</th>
                        <th>IP Address</th>
                        <th style="text-align:right;">When</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($logs as $log)
                    <tr>
                        <td style="color:var(--text-muted);">{{ $log->id }}</td>
                        <td>
                            <div style="font-weight:600; color:var(--primary);">{{ $log->user->name ?? 'System' }}</div>
                        </td>
                        <td>
                            <span class="badge badge-info" style="font-size:0.75rem; text-transform:none; letter-spacing:0;">{{ $log->action }}</span>
                        </td>
                        <td style="color:var(--text-muted); font-size:0.85rem; max-width:300px;">{{ $log->details }}</td>
                        <td style="color:var(--text-muted); font-size:0.82rem; font-family:monospace;">{{ $log->ip_address ?? '-' }}</td>
                        <td style="text-align:right; color:var(--text-muted); font-size:0.82rem; white-space:nowrap;">
                            {{ $log->created_at->diffForHumans() }}
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        <div style="padding: 20px;">
            {{ $logs->links() }}
        </div>
        @else
        <div style="padding: 60px; text-align: center; color: var(--text-muted);">
            <i class="fas fa-history" style="font-size: 3rem; opacity: 0.5; margin-bottom: 16px; display:block;"></i>
            <p>No activity logs found.</p>
        </div>
        @endif
    </div>
</div>
@endsection
