@extends('layouts.app')
@section('title', 'Admin - Activity Log')
@section('breadcrumb')
    <a href="{{ route('admin.index') }}">Admin</a>
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px;"><polyline points="9 18 15 12 9 6"></polyline></svg>
    <span style="font-weight:600;color:var(--text-primary);">Activity Log</span>
@endsection

@section('content')
    <div class="page-header">
        <h1>📋 Activity Log</h1>
    </div>

    {{-- Filters --}}
    <div class="card mb-4">
        <div class="card-body" style="padding:16px 20px;">
            <form method="GET" style="display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;">
                <div class="form-group" style="min-width:160px;">
                    <label class="form-label text-xs">User</label>
                    <select name="user" class="form-control">
                        <option value="">All Users</option>
                        @foreach($users as $user)
                            <option value="{{ $user->id }}" {{ request('user') == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group" style="min-width:140px;">
                    <label class="form-label text-xs">Action</label>
                    <select name="action" class="form-control">
                        <option value="">All Actions</option>
                        @foreach($actionTypes as $action)
                            <option value="{{ $action }}" {{ request('action') == $action ? 'selected' : '' }}>{{ ucfirst(str_replace('_', ' ', $action)) }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group" style="min-width:140px;">
                    <label class="form-label text-xs">From</label>
                    <input type="date" name="from" class="form-control" value="{{ request('from') }}">
                </div>
                <div class="form-group" style="min-width:140px;">
                    <label class="form-label text-xs">To</label>
                    <input type="date" name="to" class="form-control" value="{{ request('to') }}">
                </div>
                <button type="submit" class="btn btn-primary btn-sm">Filter</button>
                <a href="{{ route('admin.activity-log') }}" class="btn btn-ghost btn-sm">Clear</a>
            </form>
        </div>
    </div>

    {{-- Activity Timeline --}}
    <div class="card">
        <div class="card-header">
            <h3 class="card-header-title">Events</h3>
            <span class="badge badge-secondary">{{ $activities->total() }} total</span>
        </div>
        <div class="card-body" style="padding:20px 24px;">
            @if($activities->count())
            <div class="activity-timeline">
                @foreach($activities as $activity)
                    <div class="activity-timeline-item">
                        <div class="activity-timeline-connector">
                            <div class="activity-timeline-dot" style="background:{{ $activity->color }}1a;color:{{ $activity->color }};border-color:{{ $activity->color }}33;">
                                {!! $activity->svg_icon !!}
                            </div>
                            @if(!$loop->last)
                                <div class="activity-timeline-line"></div>
                            @endif
                        </div>
                        <div class="activity-timeline-content">
                            <div class="activity-timeline-text">
                                <strong>{{ $activity->causer->name ?? 'System' }}</strong>
                                <span>{{ $activity->description }}</span>
                            </div>
                            <div class="activity-timeline-meta">
                                <span class="activity-timeline-badge" style="background:{{ $activity->color }}1a;color:{{ $activity->color }};">{{ ucfirst(str_replace('_', ' ', $activity->action)) }}</span>
                                <span class="activity-timeline-time">{{ $activity->created_at->format('M j, Y H:i') }}</span>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
            @else
                <div class="empty-state">
                    <div class="empty-state-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline></svg>
                    </div>
                    <div class="empty-state-title">No activity found</div>
                    <div class="empty-state-text">Try adjusting your filters.</div>
                </div>
            @endif
        </div>
    </div>
    @if($activities->hasPages())
        <div class="pagination">{{ $activities->withQueryString()->links() }}</div>
    @endif
@endsection