@extends('layouts.franchise', ['heading' => 'Security Logs'])

@section('content')
    <div class="grid grid-cols-1 gap-4 lg:grid-cols-2">
        <div class="user-card p-4">
            <div class="mb-3 text-sm font-semibold">Active Devices</div>
            <div class="space-y-3">
                @forelse($devices as $device)
                    <div class="rounded-xl border border-[var(--user-border)] p-3">
                        <div class="flex items-center justify-between gap-3">
                            <div>
                                <div class="text-sm font-semibold">{{ $device->device_name ?: 'Browser' }}</div>
                                <div class="text-xs text-[var(--user-muted)]">
                                    {{ strtoupper((string) $device->platform) }} • {{ $device->ip_address ?: 'N/A' }}
                                </div>
                            </div>
                            @if($device->is_active)
                                <span class="user-badge success">Active</span>
                            @else
                                <span class="user-badge warning">Closed</span>
                            @endif
                        </div>
                        <div class="mt-2 text-xs text-[var(--user-muted)]">
                            Last seen: {{ optional($device->last_seen_at)->format('d M Y h:i A') ?: '-' }}
                        </div>
                        @if($device->is_active)
                            <form method="POST" action="{{ route('franchise.security.devices.terminate', $device) }}" class="mt-3">
                                @csrf
                                <button class="rounded-lg border border-rose-200 px-3 py-1 text-xs text-rose-700">Terminate Session</button>
                            </form>
                        @endif
                    </div>
                @empty
                    <div class="rounded-xl border border-[var(--user-border)] p-4 text-center text-sm text-[var(--user-muted)]">No device logs found.</div>
                @endforelse
            </div>
            <div class="mt-4">{{ $devices->appends(request()->except('devices'))->links() }}</div>
        </div>

        <div class="user-card p-4">
            <div class="mb-3 text-sm font-semibold">IP Activity</div>
            <div class="space-y-3">
                @forelse($ipLogs as $log)
                    <div class="rounded-xl border border-[var(--user-border)] p-3">
                        <div class="flex items-center justify-between">
                            <div class="text-sm font-semibold">{{ str_replace('_', ' ', strtoupper($log->action)) }}</div>
                            <div class="text-xs text-[var(--user-muted)]">{{ optional($log->created_at)->format('d M Y h:i A') }}</div>
                        </div>
                        <div class="mt-1 text-xs text-[var(--user-muted)]">IP: {{ $log->ip_address }}</div>
                    </div>
                @empty
                    <div class="rounded-xl border border-[var(--user-border)] p-4 text-center text-sm text-[var(--user-muted)]">No security activity found.</div>
                @endforelse
            </div>
            <div class="mt-4">{{ $ipLogs->appends(request()->except('logs'))->links() }}</div>
        </div>
    </div>
@endsection