<?php require APPROOT . '/app/Views/layouts/header.php'; ?>

<div class="max-w-7xl mx-auto mb-10 space-y-8">
    
    <!-- Search Header -->
    <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700/50 p-6 md:p-8 flex flex-col md:flex-row items-center justify-between">
        <div class="mb-6 md:mb-0 w-full md:w-1/2">
            <h1 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">
                Search Results for <span class="text-primary">"<?php echo htmlspecialchars($data['query']); ?>"</span>
            </h1>
            <p class="text-sm text-gray-500 dark:text-gray-400">
                Found <?php echo count($data['jobcards']) + count($data['users']) + count($data['partners']); ?> total matches.
            </p>
        </div>
        
        <div class="w-full md:w-1/2 md:pl-8">
            <form action="<?php echo URLROOT; ?>/search/index" method="GET" class="relative">
                <input type="text" name="q" value="<?php echo htmlspecialchars($data['query']); ?>" placeholder="Search again..." class="w-full pl-12 pr-4 py-3 rounded-lg border border-gray-300 dark:border-gray-700 bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-white focus:ring-2 focus:ring-primary outline-none transition-colors shadow-sm" required autofocus>
                <svg class="w-5 h-5 absolute left-4 top-3.5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
                <button type="submit" class="absolute right-2 top-2 bg-primary hover:bg-blue-700 text-white text-xs font-bold py-1.5 px-4 rounded transition-colors">Search</button>
            </form>
        </div>
    </div>

    <?php if (empty($data['query'])): ?>
        <div class="text-center py-20 bg-gray-50 dark:bg-gray-800/50 rounded-xl border border-gray-200 dark:border-gray-700/50">
            <svg class="w-16 h-16 text-gray-400 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16l2.879-2.879m0 0a3 3 0 104.243-4.242 3 3 0 00-4.243 4.242zM21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
            <h2 class="text-lg font-bold text-gray-700 dark:text-gray-300">Enter a search term to begin</h2>
        </div>
    <?php elseif (empty($data['jobcards']) && empty($data['users']) && empty($data['partners'])): ?>
        <div class="text-center py-20 bg-gray-50 dark:bg-gray-800/50 rounded-xl border border-gray-200 dark:border-gray-700/50">
            <svg class="w-16 h-16 text-gray-400 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
            <h2 class="text-lg font-bold text-gray-700 dark:text-gray-300">No records found</h2>
            <p class="text-gray-500 mt-2">Try adjusting your search query.</p>
        </div>
    <?php else: ?>

        <!-- Jobcards Results -->
        <?php if (!empty($data['jobcards'])): ?>
            <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700/50 overflow-hidden mb-8">
                <div class="p-5 border-b border-gray-200 dark:border-gray-700/50 bg-gray-50 dark:bg-gray-900/40">
                    <h2 class="text-sm font-bold text-gray-900 dark:text-white uppercase tracking-wider flex items-center">
                        <svg class="w-4 h-4 mr-2 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01"></path></svg>
                        Jobcard Matches (<?php echo count($data['jobcards']); ?>)
                    </h2>
                </div>
                <ul class="divide-y divide-gray-100 dark:divide-gray-700/50">
                    <?php foreach($data['jobcards'] as $jc): ?>
                        <li class="p-5 hover:bg-gray-50 dark:hover:bg-gray-900/20 transition-colors flex flex-col md:flex-row md:items-center justify-between gap-4">
                            <div class="flex-1">
                                <div class="flex items-center space-x-3 mb-1">
                                    <span class="font-bold text-gray-900 dark:text-white font-mono"><?php echo htmlspecialchars($jc->jobcard_number); ?></span>
                                    <span class="px-2 py-0.5 text-[10px] font-bold uppercase rounded border bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600"><?php echo $jc->status; ?></span>
                                </div>
                                <p class="text-sm text-gray-600 dark:text-gray-400">Client: <strong class="text-gray-800 dark:text-gray-200"><?php echo htmlspecialchars($jc->client_name); ?></strong> <?php echo !empty($jc->company_name) ? '('.htmlspecialchars($jc->company_name).')' : ''; ?></p>
                            </div>
                            <div class="flex-shrink-0">
                                <?php if(isAdmin()): ?>
                                    <a href="<?php echo URLROOT; ?>/admin/viewJobcard/<?php echo $jc->id; ?>" class="px-4 py-2 bg-primary hover:bg-blue-700 text-white text-xs font-bold rounded shadow-sm transition-colors">View Jobcard</a>
                                <?php elseif(isStaff()): ?>
                                    <a href="<?php echo URLROOT; ?>/staff/viewJobcard/<?php echo $jc->id; ?>" class="px-4 py-2 bg-primary hover:bg-blue-700 text-white text-xs font-bold rounded shadow-sm transition-colors">Execute Work</a>
                                <?php else: ?>
                                    <a href="<?php echo URLROOT; ?>/clientdashboard/index" class="text-xs font-bold text-primary hover:underline">Go to Dashboard</a>
                                <?php endif; ?>
                            </div>
                        </li>
                    <?php endforeach; ?>
                </ul>
            </div>
        <?php endif; ?>

        <!-- User Results (Admins Only) -->
        <?php if (!empty($data['users'])): ?>
            <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700/50 overflow-hidden mb-8">
                <div class="p-5 border-b border-gray-200 dark:border-gray-700/50 bg-emerald-50 dark:bg-emerald-900/10">
                    <h2 class="text-sm font-bold text-emerald-800 dark:text-emerald-400 uppercase tracking-wider flex items-center">
                        <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"></path></svg>
                        User Matrix Matches (<?php echo count($data['users']); ?>)
                    </h2>
                </div>
                <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-0 divide-y sm:divide-y-0 sm:gap-4 p-4">
                    <?php foreach($data['users'] as $user): ?>
                        <div class="p-4 border border-gray-100 dark:border-gray-700/50 rounded-lg hover:shadow-md transition-shadow bg-gray-50/50 dark:bg-gray-900/20">
                            <div class="flex justify-between items-start mb-2">
                                <h3 class="font-bold text-gray-900 dark:text-white truncate" title="<?php echo htmlspecialchars($user->name); ?>"><?php echo htmlspecialchars($user->name); ?></h3>
                                <span class="px-2 py-0.5 text-[9px] font-bold uppercase rounded border bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-300 border-transparent"><?php echo $user->role; ?></span>
                            </div>
                            <p class="text-xs text-gray-500 dark:text-gray-400 mb-4 truncate" title="<?php echo htmlspecialchars($user->email); ?>"><?php echo htmlspecialchars($user->email); ?></p>
                            <div class="flex space-x-2">
                                <a href="<?php echo URLROOT; ?>/admin/viewUser/<?php echo $user->id; ?>" class="flex-1 text-center py-1.5 border border-gray-300 dark:border-gray-600 rounded text-xs font-bold text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">Profile</a>
                                <a href="<?php echo URLROOT; ?>/admin/editUser/<?php echo $user->id; ?>" class="flex-1 text-center py-1.5 border border-transparent bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400 rounded text-xs font-bold hover:bg-emerald-200 dark:hover:bg-emerald-900/50 transition-colors">Edit</a>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        <?php endif; ?>

        <!-- Partner Results (Admins Only) -->
        <?php if (!empty($data['partners'])): ?>
            <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700/50 overflow-hidden mb-8">
                <div class="p-5 border-b border-gray-200 dark:border-gray-700/50 bg-purple-50 dark:bg-purple-900/10">
                    <h2 class="text-sm font-bold text-purple-800 dark:text-purple-400 uppercase tracking-wider flex items-center">
                        <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path></svg>
                        Partner Agencies (<?php echo count($data['partners']); ?>)
                    </h2>
                </div>
                <ul class="divide-y divide-gray-100 dark:divide-gray-700/50">
                    <?php foreach($data['partners'] as $partner): ?>
                        <li class="p-5 hover:bg-gray-50 dark:hover:bg-gray-900/20 transition-colors flex flex-col md:flex-row md:items-center justify-between gap-4">
                            <div>
                                <h3 class="font-bold text-gray-900 dark:text-white"><?php echo htmlspecialchars($partner->name); ?></h3>
                                <p class="text-sm text-gray-500 dark:text-gray-400"><?php echo htmlspecialchars($partner->email ?? 'No email on file'); ?></p>
                            </div>
                            <div>
                                <a href="<?php echo URLROOT; ?>/admin/editPartner/<?php echo $partner->id; ?>" class="px-4 py-2 border border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-700 dark:text-gray-300 text-xs font-bold rounded shadow-sm transition-colors">Manage Partner</a>
                            </div>
                        </li>
                    <?php endforeach; ?>
                </ul>
            </div>
        <?php endif; ?>

    <?php endif; ?>

</div>

<?php require APPROOT . '/app/Views/layouts/footer.php'; ?>