@extends('layouts.app')

@section('title', 'User Management')

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="row mb-2">
        <div class="col-12">
            <div class="custom-card">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h4 class="mb-0">
                                <i class="fas fa-users me-1"></i>
                                User Management
                            </h4>
                            <small class="text-muted">Manage system users and their permissions</small>
                        </div>
                        <div class="d-flex gap-1">
                            @if($isCurrentUserSuperAdmin)
                                <a href="{{ route('users.create') }}" class="btn btn-success btn-sm">
                                    <i class="fas fa-plus me-1"></i>Add User
                                </a>
                            @endif
                            @if(auth()->user()->childUsers()->count() > 0)
                                <button class="btn btn-primary btn-sm" onclick="showMyChildUsers()" title="View My Child Users">
                                    <i class="fas fa-users me-1"></i>My Child Users ({{ auth()->user()->childUsers()->count() }})
                                </button>
                            @endif
                            <button class="btn btn-info btn-sm" onclick="refreshStats()">
                                <i class="fas fa-sync-alt me-1"></i>Refresh
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Impersonation Indicator -->
    @if(session('original_user_id'))
    <div class="row mb-3">
        <div class="col-12">
            <div class="alert alert-warning d-flex justify-content-between align-items-center">
                <div>
                    <i class="fas fa-user-secret me-2"></i>
                    <strong>Currently logged in as:</strong> {{ auth()->user()->name }} ({{ auth()->user()->email }})
                    <br>
                    <small>Original user: {{ session('original_user_name') }}</small>
                </div>
                <form method="POST" action="{{ route('users.logout-as') }}" class="d-inline">
                    @csrf
                    <button type="submit" class="btn btn-sm btn-outline-danger">
                        <i class="fas fa-sign-out-alt me-1"></i>Return to Original Account
                    </button>
                </form>
            </div>
        </div>
    </div>
    @endif

    <!-- MAC Resellers Table (Only for Reseller Users) -->
    @if(auth()->user()->role === 'reseller' && $macResellers->count() > 0)
    <div class="row mb-4">
        <div class="col-12">
            <div class="custom-card">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h5 class="mb-0">
                                <i class="fas fa-ethernet me-1"></i>
                                My MAC Resellers
                            </h5>
                            <small class="text-muted">Clients with MAC addresses created by you and your child users</small>
                        </div>
                        <div class="d-flex gap-1">
                            <span class="badge bg-primary">{{ $macResellers->count() }} MAC Resellers</span>
                        </div>
                    </div>
                </div>
                <div class="custom-card-body">
                    <div class="table-responsive">
                        <table class="table table-hover">
                            <thead class="table-dark">
                                <tr>
                                    <th>#</th>
                                    <th>Client Name</th>
                                    <th>Username</th>
                                    <th>MAC Address</th>
                                    <th>IP Address</th>
                                    <th>Package</th>
                                    <th>Status</th>
                                    <th>Online</th>
                                    <th>Zone</th>
                                    <th>Branch</th>
                                    <th>Created By</th>
                                    <th>Connection Date</th>
                                    <th>Expiry Date</th>
                                    <th>Balance</th>
                                    <th>Due</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($macResellers as $index => $client)
                                <tr>
                                    <td>
                                        <span class="badge bg-secondary">{{ $index + 1 }}</span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <div class="avatar me-2">
                                                <div class="bg-info rounded-circle d-flex align-items-center justify-content-center text-white" 
                                                     style="width: 32px; height: 32px;">
                                                    <i class="fas fa-user"></i>
                                                </div>
                                            </div>
                                            <div>
                                                <div class="fw-bold">{{ $client['name'] }}</div>
                                                <small class="text-muted">{{ $client['phone'] }}</small>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <code>{{ $client['username'] }}</code>
                                    </td>
                                    <td>
                                        <code class="text-primary">{{ $client['mac_address'] }}</code>
                                    </td>
                                    <td>
                                        @if($client['ip_address'])
                                            <code>{{ $client['ip_address'] }}</code>
                                        @else
                                            <span class="text-muted">-</span>
                                        @endif
                                    </td>
                                    <td>
                                        <div>
                                            <div class="fw-bold">{{ $client['package_name'] }}</div>
                                            <small class="text-success">BDT {{ number_format($client['package_price']) }}</small>
                                        </div>
                                    </td>
                                    <td>
                                        @php
                                            $statusClass = match($client['status']) {
                                                'active' => 'success',
                                                'inactive' => 'secondary',
                                                'suspended' => 'warning',
                                                'expired' => 'danger',
                                                default => 'secondary'
                                            };
                                        @endphp
                                        <span class="badge bg-{{ $statusClass }}">
                                            {{ ucfirst($client['status']) }}
                                        </span>
                                    </td>
                                    <td>
                                        @if($client['is_online'])
                                            <span class="badge bg-success">
                                                <i class="fas fa-circle me-1"></i>Online
                                            </span>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-circle me-1"></i>Offline
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <div>
                                            <div class="fw-bold">{{ $client['zone'] ?? '-' }}</div>
                                            @if($client['sub_zone'])
                                                <small class="text-muted">{{ $client['sub_zone'] }}</small>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        <span class="text-muted">{{ $client['branch_name'] }}</span>
                                    </td>
                                    <td>
                                        @php
                                            $createdByUser = \App\Models\User::find($client['created_by_user']);
                                        @endphp
                                        @if($createdByUser)
                                            <div>
                                                <div class="fw-bold">{{ $createdByUser->name }}</div>
                                                <small class="text-muted">{{ ucfirst($createdByUser->role) }}</small>
                                            </div>
                                        @else
                                            <span class="text-muted">Unknown</span>
                                        @endif
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $client['connection_date'] ? \Carbon\Carbon::parse($client['connection_date'])->format('M d, Y') : '-' }}</small>
                                    </td>
                                    <td>
                                        @php
                                            $expiryDate = $client['expiry_date'] ? \Carbon\Carbon::parse($client['expiry_date']) : null;
                                            $isExpired = $expiryDate && $expiryDate->isPast();
                                            $expiresSoon = $expiryDate && $expiryDate->diffInDays(now()) <= 7;
                                        @endphp
                                        @if($expiryDate)
                                            <small class="{{ $isExpired ? 'text-danger' : ($expiresSoon ? 'text-warning' : 'text-muted') }}">
                                                {{ $expiryDate->format('M d, Y') }}
                                            </small>
                                        @else
                                            <span class="text-muted">-</span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="text-success fw-bold">BDT {{ number_format($client['balance']) }}</span>
                                    </td>
                                    <td>
                                        @if($client['total_due'] > 0)
                                            <span class="text-danger fw-bold">BDT {{ number_format($client['total_due']) }}</span>
                                        @else
                                            <span class="text-muted">BDT 0</span>
                                        @endif
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Statistics Cards -->
    <div class="row mb-2">
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-users text-primary fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-primary" id="totalUsers">{{ $stats['total'] }}</h5>
                            <small class="text-muted">Total Users</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-check-circle text-success fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-success" id="activeUsers">{{ $stats['active'] }}</h5>
                            <small class="text-muted">Active Users</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-exclamation-triangle text-warning fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-warning" id="inactiveUsers">{{ $stats['inactive'] }}</h5>
                            <small class="text-muted">Inactive Users</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-user-shield text-info fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-info" id="adminUsers">{{ $stats['admin'] }}</h5>
                            <small class="text-muted">Admins</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-user-tie text-secondary fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-secondary" id="managerUsers">{{ $stats['manager'] }}</h5>
                            <small class="text-muted">Managers</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-tools text-dark fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-dark" id="technicianUsers">{{ $stats['technician'] }}</h5>
                            <small class="text-muted">Technicians</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        @if($isCurrentUserSuperAdmin)
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-crown text-danger fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-danger" id="superAdminUsers">{{ $stats['super_admin'] }}</h5>
                            <small class="text-muted">Super Admins</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-xl-2 col-md-4 col-sm-6 mb-2">
            <div class="custom-card">
                <div class="custom-card-body text-center py-2">
                    <div class="d-flex align-items-center justify-content-center">
                        <i class="fas fa-store text-purple fa-lg me-2"></i>
                        <div>
                            <h5 class="mb-0 text-purple" id="resellerUsers">{{ $stats['reseller'] }}</h5>
                            <small class="text-muted">Resellers</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @endif
    </div>



    <!-- Users Table -->
    <div class="row">
        <div class="col-12">
            @php
                $currentUser = auth()->user();
                $isAdmin = $currentUser->role === 'admin';
            @endphp
            
            @if(!$isCurrentUserSuperAdmin && !$isAdmin)
                <div class="alert alert-info mb-3">
                    <i class="fas fa-info-circle me-2"></i>
                    <strong>Note:</strong> You can only view your own user information. Contact your administrator for access to other users.
                </div>
            @elseif($isAdmin && !$isCurrentUserSuperAdmin)
                <div class="alert alert-info mb-3">
                    <i class="fas fa-info-circle me-2"></i>
                    <strong>Note:</strong> You can only view your own user information. Contact super admin for access to all users.
                </div>
            @endif
            
            <!-- Super Admin Users Block -->
            @if($isCurrentUserSuperAdmin && $superAdminUsers->count() > 0)
            <div class="custom-card mb-3">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-crown me-1 text-danger"></i>
                            Super Admin Users ({{ $superAdminUsers->count() }} users)
                        </h5>
                        <div class="search-box">
                            <input type="text" id="superAdminSearch" class="form-control form-control-sm" placeholder="Search super admin users..." style="width: 250px;">
                        </div>
                    </div>
                </div>
                <div class="custom-card-body p-0 pt-2">
                    <div class="table-responsive">
                        <table class="table custom-table mb-0" id="superAdminTable">
                            <thead>
                                <tr>
                                    <th>SL</th>
                                    <th>User</th>
                                    <th>ISP Name</th>
                                    <th>Total Users</th>
                                    <th>Total Branch</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Assign Menu</th>
                                    <th>Last Login</th>
                                    <th>Created</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($superAdminUsers as $index => $user)
                                <tr class="table-danger">
                                    <td>
                                        <span class="badge bg-danger">{{ $index + 1 }}</span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <div class="avatar me-3">
                                                @if($user->profile_photo)
                                                    @php
                                                        $imagePath = asset('storage/' . $user->profile_photo);
                                                    @endphp
                                                    <img src="{{ $imagePath }}" 
                                                         alt="{{ $user->name }}" 
                                                         class="rounded-circle" 
                                                         width="40" height="40"
                                                         style="object-fit: cover;"
                                                         onerror="this.style.display='none';">
                                                @endif
                                            </div>
                                            <div>
                                                <h6 class="mb-0 text-danger">{{ $user->name }}</h6>
                                                <small class="text-muted">{{ $user->email }}</small>
                                                @if($user->phone)
                                                    <br><small class="text-muted">{{ $user->phone }}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->company_name)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->company_name }}
                                            </span>
                                        @elseif($user->branch)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->branch->name }}
                                            </span>
                                            <br><small class="text-muted">{{ $user->branch->code }}</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>No Company
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge bg-success" 
                                              style="cursor: pointer;" 
                                              onclick="showChildUsers({{ $user->id }}, '{{ $user->name }}')"
                                              title="Click to view child users">
                                            <i class="fas fa-users me-1"></i>{{ $user->childUsers->count() }}
                                        </span>
                                        <br><small class="text-muted">Child Users</small>
                                    </td>
                                    <td>
                                        @if($user->branch)
                                            <span class="badge bg-warning">
                                                <i class="fas fa-sitemap me-1"></i>{{ $user->branch->childBranches->count() }}
                                            </span>
                                            <br><small class="text-muted">Sub Branches</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>0
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge bg-danger">
                                            <i class="fas fa-crown me-1"></i>Super Admin
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <span class="badge bg-{{ $user->status === 'active' ? 'success' : ($user->status === 'inactive' ? 'warning' : 'danger') }}">
                                                {{ ucfirst($user->status) }}
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <div class="form-check form-switch ms-2">
                                                <input class="form-check-input" 
                                                       type="checkbox" 
                                                       id="statusToggle{{ $user->id }}"
                                                       {{ $user->is_active ? 'checked' : '' }}
                                                       onchange="toggleUserStatus({{ $user->id }})">
                                            </div>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <span class="badge bg-primary">
                                                {{ $user->menus()->count() }} Menus
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <a href="{{ route('user-menus.edit', $user) }}" 
                                               class="btn btn-success btn-sm ms-2" 
                                               title="Assign Menus">
                                                <i class="fas fa-bars"></i>
                                            </a>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->last_login_at)
                                            <div class="d-flex flex-column">
                                                <small class="text-muted">{{ $user->last_login_at->diffForHumans() }}</small>
                                                <small class="text-muted" style="font-size: 0.75rem;">
                                                    {{ $user->last_login_at->format('M d, Y H:i') }}
                                                </small>
                                            </div>
                                        @else
                                            <div class="d-flex align-items-center">
                                                <span class="badge bg-secondary">Never</span>
                                            </div>
                                        @endif
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $user->created_at->format('M d, Y') }}</small>
                                    </td>
                                    <td>
                                        <div class="d-flex gap-1">
                                            <a href="{{ route('users.show', $user) }}" 
                                               class="btn btn-info btn-sm" 
                                               title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user) }}" 
                                               class="btn btn-warning btn-sm" 
                                               title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            @if($user->is_active && $user->id !== auth()->id())
                                                <form method="POST" action="{{ route('users.login-as', $user) }}" style="display: inline;">
                                                    @csrf
                                                    <button type="submit" 
                                                            class="btn btn-success btn-sm" 
                                                            title="Login as {{ $user->name }}"
                                                            onclick="return confirm('Are you sure you want to login as {{ $user->name }}?')">
                                                        <i class="fas fa-sign-in-alt"></i>
                                                    </button>
                                                </form>
                                            @endif
                                            <button type="button" 
                                                    class="btn btn-danger btn-sm" 
                                                    onclick="deleteUser({{ $user->id }})"
                                                    title="Delete">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            @endif


            <!-- Regular Users Table -->
            @if(!$isCurrentUserSuperAdmin)
            <div class="custom-card">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-list me-1"></i>
                            Regular Users ({{ $users->total() ?? 0 }} users)
                        </h5>
                        <div class="search-box">
                            <input type="text" id="regularUsersSearch" class="form-control form-control-sm" placeholder="Search regular users..." style="width: 250px;">
                        </div>
                    </div>
                </div>
                <div class="custom-card-body p-0 pt-2">
                    <div class="table-responsive">
                        <table class="table custom-table mb-0" id="regularUsersTable">
                            <thead>
                                <tr>
                                    <th>SL</th>
                                    <th>User</th>
                                    <th>ISP Name</th>
                                    <th>Total Users</th>
                                    <th>Total Branch</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Assign Menu</th>
                                    <th>Last Login</th>
                                    <th>Created</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($users as $index => $user)
                                <tr>
                                    <td>
                                        <span class="badge bg-secondary">{{ ($users->currentPage() - 1) * $users->perPage() + $index + 1 }}</span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <div class="avatar me-3">
                                                @if($user->profile_photo)
                                                    @php
                                                        $imagePath = asset('storage/' . $user->profile_photo);
                                                    @endphp
                                                    <img src="{{ $imagePath }}" 
                                                         alt="{{ $user->name }}" 
                                                         class="rounded-circle" 
                                                         width="40" height="40"
                                                         style="object-fit: cover;"
                                                         onerror="this.style.display='none';">
                                                @endif
                                            </div>
                                            <div>
                                                <h6 class="mb-0">{{ $user->name }}</h6>
                                                <small class="text-muted">{{ $user->email }}</small>
                                                @if($user->phone)
                                                    <br><small class="text-muted">{{ $user->phone }}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->company_name)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->company_name }}
                                            </span>
                                        @elseif($user->branch)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->branch->name }}
                                            </span>
                                            <br><small class="text-muted">{{ $user->branch->code }}</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>No Company
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge bg-success" 
                                              style="cursor: pointer;" 
                                              onclick="showChildUsers({{ $user->id }}, '{{ $user->name }}')"
                                              title="Click to view child users">
                                            <i class="fas fa-users me-1"></i>{{ $user->childUsers->count() }}
                                        </span>
                                        <br><small class="text-muted">Child Users</small>
                                    </td>
                                    <td>
                                        @if($user->branch)
                                            <span class="badge bg-warning">
                                                <i class="fas fa-sitemap me-1"></i>{{ $user->branch->childBranches->count() }}
                                            </span>
                                            <br><small class="text-muted">Sub Branches</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>0
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge bg-{{ $user->role === 'admin' ? 'danger' : ($user->role === 'manager' ? 'warning' : ($user->role === 'technician' ? 'info' : 'secondary')) }}">
                                            {{ ucfirst($user->role) }}
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <span class="badge bg-{{ $user->status === 'active' ? 'success' : ($user->status === 'inactive' ? 'warning' : 'danger') }}">
                                                {{ ucfirst($user->status) }}
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <div class="form-check form-switch ms-2">
                                                <input class="form-check-input" 
                                                       type="checkbox" 
                                                       id="statusToggle{{ $user->id }}"
                                                       {{ $user->is_active ? 'checked' : '' }}
                                                       onchange="toggleUserStatus({{ $user->id }})">
                                            </div>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <span class="badge bg-primary">
                                                {{ $user->menus()->count() }} Menus
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <a href="{{ route('user-menus.edit', $user) }}" 
                                               class="btn btn-success btn-sm ms-2" 
                                               title="Assign Menus">
                                                <i class="fas fa-bars"></i>
                                            </a>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->last_login_at)
                                            <div class="d-flex flex-column">
                                                <small class="text-muted">{{ $user->last_login_at->diffForHumans() }}</small>
                                                <small class="text-muted" style="font-size: 0.75rem;">
                                                    {{ $user->last_login_at->format('M d, Y H:i') }}
                                                </small>
                                            </div>
                                        @else
                                            <div class="d-flex align-items-center">
                                                <span class="badge bg-secondary">Never</span>
                                            </div>
                                        @endif
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $user->created_at->format('M d, Y') }}</small>
                                    </td>
                                    <td>
                                        <div class="d-flex gap-1">
                                            <a href="{{ route('users.show', $user) }}" 
                                               class="btn btn-info btn-sm" 
                                               title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user) }}" 
                                               class="btn btn-warning btn-sm" 
                                               title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            @if($user->is_active && (auth()->user()->role === 'super-admin' || auth()->user()->role === 'admin') && $user->id !== auth()->id())
                                                <form method="POST" action="{{ route('users.login-as', $user) }}" style="display: inline;">
                                                    @csrf
                                                    <button type="submit" 
                                                            class="btn btn-success btn-sm" 
                                                            title="Login as {{ $user->name }}"
                                                            onclick="return confirm('Are you sure you want to login as {{ $user->name }}?')">
                                                        <i class="fas fa-sign-in-alt"></i>
                                                    </button>
                                                </form>
                                            @endif
                                            @if(auth()->user()->role === 'super-admin' || auth()->user()->role === 'Super-admin' || stripos(auth()->user()->role, 'super') !== false)
                                                <button type="button" 
                                                        class="btn btn-danger btn-sm" 
                                                        onclick="deleteUser({{ $user->id }})"
                                                        title="Delete">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            @endif
                                        </div>
                                    </td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="11" class="text-center py-4">
                                        <div class="text-muted">
                                            <i class="fas fa-users fa-2x mb-3"></i>
                                            <p>No users found.</p>
                                        </div>
                                    </td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            @endif

            <!-- Reseller Users Block -->
            @if($resellerUsers->count() > 0)
            <div class="custom-card mt-3">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-store me-1 text-purple"></i>
                            Reseller Users ({{ $resellerUsers->count() }} users)
                        </h5>
                        <div class="search-box">
                            <input type="text" id="resellerUsersSearch" class="form-control form-control-sm" placeholder="Search reseller users..." style="width: 250px;">
                        </div>
                    </div>
                </div>
                <div class="custom-card-body p-0 pt-2">
                    <div class="table-responsive">
                        <table class="table custom-table mb-0" id="resellerUsersTable">
                            <thead>
                                <tr>
                                    <th>SL</th>
                                    <th>User</th>
                                    <th>ISP Name</th>
                                    <th>Total Users</th>
                                    <th>Total Branch</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Assign Menu</th>
                                    <th>Last Login</th>
                                    <th>Created</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($resellerUsers as $index => $user)
                                <tr>
                                    <td>
                                        <span class="badge" style="background-color: #800080;">{{ $index + 1 }}</span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-store text-purple me-2"></i>
                                            <div>
                                                <h6 class="mb-0" style="color: #800080;">{{ $user->name }}</h6>
                                                <small class="text-muted">{{ $user->email }}</small>
                                                @if($user->phone)
                                                    <br><small class="text-muted">{{ $user->phone }}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->company_name)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->company_name }}
                                            </span>
                                        @elseif($user->branch)
                                            <span class="badge bg-primary">
                                                <i class="fas fa-building me-1"></i>{{ $user->branch->name }}
                                            </span>
                                            <br><small class="text-muted">{{ $user->branch->code }}</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>No Company
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge bg-success" 
                                              style="cursor: pointer;" 
                                              onclick="showChildUsers({{ $user->id }}, '{{ $user->name }}')"
                                              title="Click to view child users">
                                            <i class="fas fa-users me-1"></i>{{ $user->childUsers->count() }}
                                        </span>
                                        <br><small class="text-muted">Child Users</small>
                                    </td>
                                    <td>
                                        @if($user->branch)
                                            <span class="badge bg-warning">
                                                <i class="fas fa-sitemap me-1"></i>{{ $user->branch->childBranches->count() }}
                                            </span>
                                            <br><small class="text-muted">Sub Branches</small>
                                        @else
                                            <span class="badge bg-secondary">
                                                <i class="fas fa-times me-1"></i>0
                                            </span>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge" style="background-color: #800080;">
                                            <i class="fas fa-store me-1"></i>Reseller
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <span class="badge bg-{{ $user->status === 'active' ? 'success' : ($user->status === 'inactive' ? 'warning' : 'danger') }}">
                                                {{ ucfirst($user->status) }}
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <div class="form-check form-switch ms-2">
                                                <input class="form-check-input" 
                                                       type="checkbox" 
                                                       id="statusToggle{{ $user->id }}"
                                                       {{ $user->is_active ? 'checked' : '' }}
                                                       onchange="toggleUserStatus({{ $user->id }})">
                                            </div>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <span class="badge bg-primary">
                                                {{ $user->menus()->count() }} Menus
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <a href="{{ route('user-menus.edit', $user) }}" 
                                               class="btn btn-success btn-sm ms-2" 
                                               title="Assign Menus">
                                                <i class="fas fa-bars"></i>
                                            </a>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->last_login_at)
                                            <div class="d-flex flex-column">
                                                <small class="text-muted">{{ $user->last_login_at->diffForHumans() }}</small>
                                                <small class="text-muted" style="font-size: 0.75rem;">
                                                    {{ $user->last_login_at->format('M d, Y H:i') }}
                                                </small>
                                            </div>
                                        @else
                                            <div class="d-flex align-items-center">
                                                <span class="badge bg-secondary">Never</span>
                                            </div>
                                        @endif
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $user->created_at->format('M d, Y') }}</small>
                                    </td>
                                    <td>
                                        <div class="d-flex gap-1">
                                            <a href="{{ route('users.show', $user) }}" 
                                               class="btn btn-info btn-sm" 
                                               title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user) }}" 
                                               class="btn btn-warning btn-sm" 
                                               title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            @if($user->is_active && $user->id !== auth()->id())
                                                <form method="POST" action="{{ route('users.login-as', $user) }}" style="display: inline;">
                                                    @csrf
                                                    <button type="submit" 
                                                            class="btn btn-success btn-sm" 
                                                            title="Login as {{ $user->name }}"
                                                            onclick="return confirm('Are you sure you want to login as {{ $user->name }}?')">
                                                        <i class="fas fa-sign-in-alt"></i>
                                                    </button>
                                                </form>
                                            @endif
                                            <button type="button" 
                                                    class="btn btn-danger btn-sm" 
                                                    onclick="deleteUser({{ $user->id }})"
                                                    title="Delete">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            @endif

            <!-- MAC Reseller Users Table -->
            @if($macResellerUsers->count() > 0)
            <div class="custom-card mt-3">
                <div class="custom-card-header py-2">
                    <div class="d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-network-wired me-1 text-info"></i>
                            MAC Reseller Users ({{ $macResellerUsers->count() }} users)
                        </h5>
                        <div class="search-box">
                            <input type="text" id="macResellerSearch" class="form-control form-control-sm" placeholder="Search MAC resellers..." style="width: 250px;">
                        </div>
                    </div>
                </div>
                <div class="custom-card-body p-0 pt-2">
                    <div class="table-responsive">
                        <table class="table custom-table mb-0" id="macResellerTable">
                            <thead>
                                <tr>
                                    <th>SL</th>
                                    <th>User</th>
                                    <th>Company</th>
                                    <th>Email</th>
                                    <th>Phone</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Assign Menu</th>
                                    <th>Last Login</th>
                                    <th>Created</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($macResellerUsers as $index => $user)
                                <tr>
                                    <td>{{ $index + 1 }}</td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-user text-info me-2"></i>
                                            <div>
                                                <h6 class="mb-0">{{ $user->name }}</h6>
                                                <small class="text-muted">ID: {{ $user->id }}</small>
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{ $user->company_name ?? '-' }}</td>
                                    <td>
                                        <a href="mailto:{{ $user->email }}" class="text-primary">
                                            {{ $user->email }}
                                        </a>
                                    </td>
                                    <td>
                                        <a href="tel:{{ $user->phone }}" class="text-success">
                                            {{ $user->phone ?? '-' }}
                                        </a>
                                    </td>
                                    <td>
                                        <span class="badge bg-info">{{ ucfirst($user->role) }}</span>
                                    </td>
                                    <td>
                                        <span class="badge {{ $user->status === 'active' ? 'bg-success' : 'bg-danger' }}">
                                            {{ ucfirst($user->status) }}
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <span class="badge bg-primary">
                                                {{ $user->menus()->count() }} Menus
                                            </span>
                                            @if($isCurrentUserSuperAdmin)
                                            <a href="{{ route('user-menus.edit', $user) }}" 
                                               class="btn btn-success btn-sm ms-2" 
                                               title="Assign Menus">
                                                <i class="fas fa-bars"></i>
                                            </a>
                                            @endif
                                        </div>
                                    </td>
                                    <td>
                                        @if($user->last_login_at)
                                            <small class="text-muted">
                                                {{ \Carbon\Carbon::parse($user->last_login_at)->diffForHumans() }}
                                            </small>
                                        @else
                                            <small class="text-muted">Never</small>
                                        @endif
                                    </td>
                                    <td>
                                        <small class="text-muted">
                                            {{ \Carbon\Carbon::parse($user->created_at)->format('M d, Y') }}
                                        </small>
                                    </td>
                                    <td>
                                        <div class="d-flex gap-1">
                                            <a href="{{ route('users.show', $user->id) }}" class="btn btn-info btn-sm" title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user->id) }}" class="btn btn-warning btn-sm" title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            @if($user->id !== auth()->id())
                                                <form action="{{ route('users.login-as', $user->id) }}" method="POST" class="d-inline">
                                                    @csrf
                                                    <button type="submit" class="btn btn-secondary btn-sm" title="Impersonate">
                                                        <i class="fas fa-sign-in-alt"></i>
                                                    </button>
                                                </form>
                                            @endif
                                            <button type="button" 
                                                    class="btn btn-danger btn-sm" 
                                                    onclick="deleteUser({{ $user->id }})"
                                                    title="Delete">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            @endif
        </div>
    </div>

    <!-- Branch Data Table (Image-like design) - Only for Non-Super Admin Users -->
    @if(!$isCurrentUserSuperAdmin && isset($branchData) && $branchData->count() > 0)
    <div class="row mb-4">
        <div class="col-12">
            <div class="custom-card">
                <div class="custom-card-header py-2">
                    <h5 class="mb-0">
                        <i class="fas fa-sitemap me-1"></i>
                        Branch Network Overview
                    </h5>
                </div>
                <div class="custom-card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead class="table-dark">
                                <tr>
                                    <th class="text-center">SL</th>
                                    <th>Name</th>
                                    <th>Admin User</th>
                                    <th>Parent Branch</th>
                                    <th>Parent User</th>
                                    <th>Assigned Router</th>
                                    <th>Total Clients</th>
                                    <th>Status</th>
                                    <th>Created</th>
                                    <th class="text-center">Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($branchData as $index => $branch)
                                <tr>
                                    <td class="text-center">{{ $index + 1 }}</td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-sitemap text-primary me-2"></i>
                                            <div>
                                                <div class="fw-medium">{{ $branch['name'] }}</div>
                                                <small class="text-muted">{{ $branch['code'] }}</small>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-user text-success me-2"></i>
                                            <div>
                                                <div class="fw-medium">{{ $branch['admin_user']['name'] }}</div>
                                                <small class="text-muted">{{ $branch['admin_user']['email'] }}</small>
                                                <br>
                                                <span class="badge bg-danger">{{ $branch['admin_user']['role'] }}</span>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div>
                                            <div class="fw-medium">{{ $branch['parent_branch']['name'] }}</div>
                                            <small class="text-muted">{{ $branch['parent_branch']['code'] }}</small>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-user text-info me-2"></i>
                                            <div>
                                                <div class="fw-medium">{{ $branch['parent_user']['name'] }}</div>
                                                <small class="text-muted">{{ $branch['parent_user']['email'] }}</small>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        @foreach($branch['assigned_routers'] as $router)
                                        <div class="d-flex align-items-center mb-1">
                                            <i class="fas fa-server text-info me-2"></i>
                                            <div>
                                                <div class="fw-medium text-primary">{{ $router['name'] }}</div>
                                                <small class="text-muted">
                                                    <i class="fas fa-globe me-1"></i>
                                                    {{ $router['ip'] }}
                                                </small>
                                            </div>
                                        </div>
                                        @endforeach
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-users text-success me-2"></i>
                                            <div>
                                                <div class="fw-medium text-success">{{ $branch['total_clients'] }}</div>
                                                <small class="text-muted">Clients</small>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <span class="badge bg-success">{{ $branch['status'] }}</span>
                                    </td>
                                    <td>
                                        <div>
                                            <div class="fw-medium">{{ explode(' ', $branch['created_at'])[0] }}</div>
                                            <small class="text-muted">{{ explode(' ', $branch['created_at'])[1] }}</small>
                                        </div>
                                    </td>
                                    <td class="text-center">
                                        <div class="btn-group" role="group">
                                            <button type="button" class="btn btn-sm btn-outline-primary" title="View">
                                                <i class="fas fa-eye"></i>
                                            </button>
                                            <button type="button" class="btn btn-sm btn-outline-warning" title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </button>
                                            <button type="button" class="btn btn-sm btn-outline-info" title="Login" onclick="loginAsBranchUser({{ $branch['id'] }}, '{{ $branch['name'] }}', '{{ $branch['admin_user']['name'] }}', '{{ $branch['admin_user']['email'] }}')">
                                                <i class="fas fa-sign-in-alt"></i>
                                            </button>
                                            <button type="button" class="btn btn-sm btn-outline-success" title="Transfer">
                                                <i class="fas fa-arrow-right"></i>
                                            </button>
                                            <button type="button" class="btn btn-sm btn-outline-danger" title="Delete">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- All Child Users Table -->
    @if(!$isCurrentUserSuperAdmin && isset($allChildUsers) && $allChildUsers->count() > 0)
    <div class="row mb-4">
        <div class="col-12">
            <div class="custom-card">
                <div class="custom-card-header py-2">
                    <h5 class="mb-0">
                        <i class="fas fa-users me-1"></i>
                        All Child Users ({{ $allChildUsers->count() }} users)
                    </h5>
                </div>
                <div class="custom-card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover mb-0">
                            <thead class="table-dark">
                                <tr>
                                    <th class="text-center">SL</th>
                                    <th>User</th>
                                    <th>Branch</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Assigned Menus</th>
                                    <th>Last Login</th>
                                    <th>Created</th>
                                    <th class="text-center">Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($allChildUsers as $index => $user)
                                <tr>
                                    <td class="text-center">{{ $index + 1 }}</td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <i class="fas fa-user text-primary me-2"></i>
                                            <div>
                                                <div class="fw-medium">{{ $user['name'] }}</div>
                                                <small class="text-muted">{{ $user['email'] }}</small>
                                                @if($user['phone'])
                                                    <br><small class="text-muted">{{ $user['phone'] }}</small>
                                                @endif
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div>
                                            <div class="fw-medium">{{ $user['branch_name'] }}</div>
                                            <small class="text-muted">{{ $user['branch_code'] }}</small>
                                        </div>
                                    </td>
                                    <td>
                                        <span class="badge bg-{{ $user['role'] === 'admin' ? 'danger' : ($user['role'] === 'manager' ? 'warning' : ($user['role'] === 'technician' ? 'info' : 'secondary')) }}">
                                            {{ ucfirst($user['role']) }}
                                        </span>
                                    </td>
                                    <td>
                                        <div class="d-flex align-items-center">
                                            <span class="badge bg-{{ $user['is_active'] ? 'success' : 'danger' }}">
                                                {{ $user['is_active'] ? 'Active' : 'Inactive' }}
                                            </span>
                                        </div>
                                    </td>
                                    <td>
                                        <span class="badge bg-primary">
                                            {{ $user['menus_count'] }} Menus
                                        </span>
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $user['last_login_at'] }}</small>
                                    </td>
                                    <td>
                                        <small class="text-muted">{{ $user['created_at'] }}</small>
                                    </td>
                                    <td class="text-center">
                                        <div class="btn-group" role="group">
                                            <a href="{{ route('users.show', $user['id']) }}" 
                                               class="btn btn-sm btn-outline-primary" 
                                               title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user['id']) }}" 
                                               class="btn btn-sm btn-outline-warning" 
                                               title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            <a href="{{ route('user-menus.edit', $user['id']) }}" 
                                               class="btn btn-sm btn-outline-success" 
                                               title="Assign Menus">
                                                <i class="fas fa-bars"></i>
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Pagination -->
    @if($users->hasPages())
    <div class="row mt-3">
        <div class="col-12">
            <div class="d-flex justify-content-center">
                {{ $users->appends(request()->query())->links() }}
            </div>
        </div>
    </div>
    @endif
</div>

<!-- Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="deleteModalLabel">Confirm Delete</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Are you sure you want to delete this user? This action can be undone.
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                <form id="deleteForm" method="POST" style="display: inline;">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Delete User</button>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
function deleteUser(userId) {
    const modal = new bootstrap.Modal(document.getElementById('deleteModal'));
    const form = document.getElementById('deleteForm');
    form.action = `/users/${userId}`;
    modal.show();
}

function toggleUserStatus(userId) {
    fetch(`/users/${userId}/toggle-status`, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
            'Content-Type': 'application/json',
        },
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            // Show success message
            showAlert('success', data.message);
            
            // Update statistics
            refreshStats();
        } else {
            showAlert('error', data.message);
        }
    })
    .catch(error => {
        console.error('Error:', error);
        showAlert('error', 'Error updating user status');
    });
}

function refreshStats() {
    fetch('/users-stats')
        .then(response => response.json())
        .then(data => {
            document.getElementById('totalUsers').textContent = data.total;
            document.getElementById('activeUsers').textContent = data.active;
            document.getElementById('inactiveUsers').textContent = data.inactive;
            document.getElementById('adminUsers').textContent = data.admin;
            document.getElementById('managerUsers').textContent = data.manager;
            document.getElementById('technicianUsers').textContent = data.technician;
            if (document.getElementById('superAdminUsers')) {
                document.getElementById('superAdminUsers').textContent = data.super_admin || 0;
            }
            if (document.getElementById('resellerUsers')) {
                document.getElementById('resellerUsers').textContent = data.reseller || 0;
            }
        })
        .catch(error => {
            console.error('Error fetching stats:', error);
        });
}

function loginAsBranchUser(branchId, branchName, adminUserName, adminUserEmail) {
    console.log('loginAsBranchUser called with:', branchId, branchName, adminUserName, adminUserEmail);
    
    if (confirm(`Are you sure you want to login as "${adminUserName}" (${adminUserEmail}) from branch "${branchName}"?`)) {
        console.log('User confirmed login as:', adminUserName);
        
        // Create a form to submit the login request
        const form = document.createElement('form');
        form.method = 'POST';
        form.action = '{{ route("users.login-as-branch-user") }}';
        
        console.log('Form action:', form.action);
        
        // Add CSRF token
        const csrfToken = document.createElement('input');
        csrfToken.type = 'hidden';
        csrfToken.name = '_token';
        csrfToken.value = '{{ csrf_token() }}';
        form.appendChild(csrfToken);
        
        // Add branch ID
        const branchIdInput = document.createElement('input');
        branchIdInput.type = 'hidden';
        branchIdInput.name = 'branch_id';
        branchIdInput.value = branchId;
        form.appendChild(branchIdInput);
        
        // Add admin user email for finding the user
        const adminEmailInput = document.createElement('input');
        adminEmailInput.type = 'hidden';
        adminEmailInput.name = 'admin_email';
        adminEmailInput.value = adminUserEmail;
        form.appendChild(adminEmailInput);
        
        console.log('Form data:', {
            _token: csrfToken.value,
            branch_id: branchIdInput.value,
            admin_email: adminEmailInput.value
        });
        
        // Submit the form
        document.body.appendChild(form);
        console.log('Submitting form...');
        form.submit();
    } else {
        console.log('User cancelled login');
    }
}

function showAlert(type, message) {
    const alertDiv = document.createElement('div');
    alertDiv.className = `alert alert-${type === 'success' ? 'success' : 'danger'} alert-dismissible fade show`;
    alertDiv.innerHTML = `
        ${message}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    `;
    
    document.querySelector('.container-fluid').insertBefore(alertDiv, document.querySelector('.container-fluid').firstChild);
    
    setTimeout(() => {
        alertDiv.remove();
    }, 5000);
}

function showChildUsers(userId, userName) {
    // Create modal for showing child users
    const modalHtml = `
        <div class="modal fade" id="childUsersModal" tabindex="-1" aria-labelledby="childUsersModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content" style="font-size: 0.875rem;">
                    <div class="modal-header">
                        <h5 class="modal-title" id="childUsersModalLabel" style="font-size: 1rem;">
                            <i class="fas fa-users me-2"></i>Child Users of ${userName}
                        </h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body" style="font-size: 0.875rem;">
                        <div id="childUsersContent">
                            <div class="text-center">
                                <div class="spinner-border text-primary" role="status" style="width: 1.5rem; height: 1.5rem;">
                                    <span class="visually-hidden">Loading...</span>
                                </div>
                                <p class="mt-2" style="font-size: 0.875rem;">Loading child users...</p>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer" style="font-size: 0.875rem;">
                        <button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    `;
    
    // Remove existing modal if any
    const existingModal = document.getElementById('childUsersModal');
    if (existingModal) {
        existingModal.remove();
    }
    
    // Add modal to body
    document.body.insertAdjacentHTML('beforeend', modalHtml);
    
    // Get modal element
    const modalElement = document.getElementById('childUsersModal');
    
    // Show modal
    const modal = new bootstrap.Modal(modalElement);
    modal.show();
    
    // Add explicit event handlers for close buttons
    modalElement.addEventListener('hidden.bs.modal', function() {
        // Remove modal from DOM when closed
        modalElement.remove();
        // Remove backdrop if exists
        const backdrop = document.querySelector('.modal-backdrop');
        if (backdrop) {
            backdrop.remove();
        }
        // Remove modal-open class from body
        document.body.classList.remove('modal-open');
        document.body.style.overflow = '';
        document.body.style.paddingRight = '';
    });
    
    // Handle close button clicks
    const closeButtons = modalElement.querySelectorAll('[data-bs-dismiss="modal"], .btn-close');
    closeButtons.forEach(button => {
        button.addEventListener('click', function(e) {
            e.preventDefault();
            modal.hide();
        });
    });
    
    // Handle backdrop click to close modal
    modalElement.addEventListener('click', function(e) {
        if (e.target === modalElement) {
            modal.hide();
        }
    });
    
    // Fetch child users data
    fetch(`/users/${userId}/child-users`)
        .then(response => response.json())
        .then(data => {
            const content = document.getElementById('childUsersContent');
            
            if (data.users && data.users.length > 0) {
                let tableHtml = `
                    <div class="table-responsive">
                        <table class="table table-hover table-sm" style="font-size: 0.8rem;">
                            <thead class="table-dark">
                                <tr style="font-size: 0.8rem;">
                                    <th>SL</th>
                                    <th>Name</th>
                                    <th>Email</th>
                                    <th>Role</th>
                                    <th>Status</th>
                                    <th>Created</th>
                                    <th class="text-center">Assigned Menus</th>
                                </tr>
                            </thead>
                            <tbody>
                `;
                
                data.users.forEach((user, index) => {
                    tableHtml += `
                        <tr style="font-size: 0.8rem;">
                            <td>${index + 1}</td>
                            <td>
                                <div class="d-flex align-items-center">
                                    <i class="fas fa-user text-primary me-2" style="font-size: 0.75rem;"></i>
                                    <div>
                                        <div class="fw-bold" style="font-size: 0.85rem;">${user.name}</div>
                                    </div>
                                </div>
                            </td>
                            <td style="font-size: 0.8rem;">${user.email}</td>
                            <td>
                                <span class="badge bg-${user.role === 'admin' ? 'success' : (user.role === 'manager' ? 'primary' : 'secondary')}" style="font-size: 0.75rem;">
                                    ${user.role.charAt(0).toUpperCase() + user.role.slice(1)}
                                </span>
                            </td>
                            <td>
                                <span class="badge bg-${user.is_active ? 'success' : 'danger'}" style="font-size: 0.75rem;">
                                    ${user.is_active ? 'Active' : 'Inactive'}
                                </span>
                            </td>
                            <td style="font-size: 0.8rem;">${new Date(user.created_at).toLocaleDateString()}</td>
                            <td class="text-center">
                                <div class="d-flex align-items-center justify-content-center gap-1">
                                    <span class="badge bg-primary" style="font-size: 0.75rem;">
                                        ${user.menus_count || 0} Menus
                                    </span>
                                    <div class="btn-group" role="group">
                                        <a href="/users/${user.id}/menus" 
                                           class="btn btn-xs btn-success" 
                                           title="Assign Menus"
                                           style="font-size: 0.7rem; padding: 0.2rem 0.4rem;">
                                            <i class="fas fa-bars" style="font-size: 0.7rem;"></i>
                                        </a>
                                        <button type="button" 
                                                class="btn btn-xs btn-outline-primary" 
                                                title="View Details"
                                                onclick="viewUserDetails(${user.id})"
                                                style="font-size: 0.7rem; padding: 0.2rem 0.4rem;">
                                            <i class="fas fa-eye" style="font-size: 0.7rem;"></i>
                                        </button>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    `;
                });
                
                tableHtml += `
                            </tbody>
                        </table>
                    </div>
                `;
                
                content.innerHTML = tableHtml;
            } else {
                content.innerHTML = `
                    <div class="text-center py-4">
                        <i class="fas fa-users fa-2x text-muted mb-3"></i>
                        <h6 class="text-muted" style="font-size: 0.9rem;">No Child Users Found</h6>
                        <p class="text-muted" style="font-size: 0.8rem;">This user doesn't have any child users.</p>
                    </div>
                `;
            }
        })
        .catch(error => {
            console.error('Error fetching child users:', error);
            document.getElementById('childUsersContent').innerHTML = `
                <div class="alert alert-danger" style="font-size: 0.8rem;">
                    <i class="fas fa-exclamation-triangle me-2"></i>
                    Error loading child users. Please try again.
                </div>
            `;
        });
}

function showMyChildUsers() {
    // Show child users of current logged-in admin user
    const currentUserId = {{ auth()->id() }};
    const currentUserName = '{{ auth()->user()->name }}';
    showChildUsers(currentUserId, currentUserName);
}

function viewUserDetails(userId) {
    // Redirect to user details page
    window.open(`/users/${userId}`, '_blank');
}

// Auto search functionality for all user sections
document.addEventListener('DOMContentLoaded', function() {
    // Super Admin Users Search
    const superAdminSearch = document.getElementById('superAdminSearch');
    if (superAdminSearch) {
        superAdminSearch.addEventListener('input', function() {
            filterTable('superAdminTable', this.value);
        });
    }
    
    // Regular Users Search
    const regularUsersSearch = document.getElementById('regularUsersSearch');
    if (regularUsersSearch) {
        regularUsersSearch.addEventListener('input', function() {
            filterTable('regularUsersTable', this.value);
        });
    }
    
    // Reseller Users Search
    const resellerUsersSearch = document.getElementById('resellerUsersSearch');
    if (resellerUsersSearch) {
        resellerUsersSearch.addEventListener('input', function() {
            filterTable('resellerUsersTable', this.value);
        });
    }
    
    // MAC Reseller Users Search
    const macResellerSearch = document.getElementById('macResellerSearch');
    if (macResellerSearch) {
        macResellerSearch.addEventListener('input', function() {
            filterTable('macResellerTable', this.value);
        });
    }
});

// Filter table rows based on search input
function filterTable(tableId, searchTerm) {
    const table = document.getElementById(tableId);
    if (!table) return;
    
    const rows = table.getElementsByTagName('tr');
    const searchLower = searchTerm.toLowerCase();
    
    for (let i = 1; i < rows.length; i++) { // Start from 1 to skip header
        const row = rows[i];
        const cells = row.getElementsByTagName('td');
        let found = false;
        
        // Search in all cells
        for (let j = 0; j < cells.length; j++) {
            const cellText = cells[j].textContent || cells[j].innerText;
            if (cellText.toLowerCase().indexOf(searchLower) > -1) {
                found = true;
                break;
            }
        }
        
        // Show/hide row based on search result
        row.style.display = found ? '' : 'none';
    }
    
    // Update count display
    updateVisibleCount(tableId, searchTerm);
}

// Update visible count after filtering
function updateVisibleCount(tableId, searchTerm) {
    const table = document.getElementById(tableId);
    if (!table) return;
    
    const rows = table.getElementsByTagName('tr');
    let visibleCount = 0;
    
    for (let i = 1; i < rows.length; i++) { // Start from 1 to skip header
        if (rows[i].style.display !== 'none') {
            visibleCount++;
        }
    }
    
    // Update the count in the header
    const headerElement = document.querySelector(`#${tableId}`).closest('.custom-card').querySelector('.custom-card-header h5');
    if (headerElement) {
        const originalText = headerElement.textContent;
        const baseText = originalText.replace(/\(\d+ users\)/, '').trim();
        
        if (searchTerm && searchTerm.length > 0) {
            headerElement.innerHTML = `${baseText} <span class="badge bg-info">${visibleCount} found</span>`;
        } else {
            // Restore original text
            if (tableId === 'superAdminTable') {
                headerElement.innerHTML = `<i class="fas fa-crown me-1 text-danger"></i>Super Admin Users ({{ $superAdminUsers->count() }} users)`;
            } else if (tableId === 'regularUsersTable') {
                headerElement.innerHTML = `<i class="fas fa-list me-1"></i>Regular Users ({{ $users->total() }} users)`;
            } else if (tableId === 'resellerUsersTable') {
                headerElement.innerHTML = `<i class="fas fa-store me-1 text-purple"></i>Reseller Users ({{ $resellerUsers->count() }} users)`;
            } else if (tableId === 'macResellerTable') {
                headerElement.innerHTML = `<i class="fas fa-network-wired me-1"></i>PPPoE MAC Resellers ({{ $macResellerUsers->count() }} users)`;
            }
        }
    }
}
</script>
@endsection