require_once __DIR__ . '/../api/fanction.php';

function renderRecentJobsComponent() {
    // Handle POST request before any output
    if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action']) && $_POST['action'] === 'updateStatus') {
        $application_id = intval($_POST['application_id']);
        $status = $_POST['status'];
        $scrollPosition = isset($_POST['scrollPosition']) ? intval($_POST['scrollPosition']) : 0;
        $rejection_reason = isset($_POST['rejection_reason']) ? $_POST['rejection_reason'] : null;
        
        // Create details array with rejection reason if status is Reject
        $details = [];
        if ($status === 'Reject' && $rejection_reason) {
            $details['rejection_reason'] = $rejection_reason;
        }
        
        $result = updateJobApplicationStatus($application_id, $status, $rejection_reason, $details);
        
        if ($result['status'] === 'success') {
            $_SESSION['success'] = $result['message'];
        } else {
            $_SESSION['error'] = $result['message'];



            // Redirect with scroll position
            header('Location: ' . $_SERVER['PHP_SELF'] . '?scroll=' . $scrollPosition);
            exit;
        }
    }

    ob_start();
    $recentJobs = getRecentJobApplications(99);
    <style>
        .recent-jobs {
            background: var(--component-bg);
            border-radius: 1.5rem;
            padding: 2rem;
            margin: 2rem auto;
            max-width: 1400px;
            direction: rtl;
            box-shadow: 0 8px 32px rgba(0,0,0,0.1);
            border: 1px solid rgba(255,255,255,0.1);
        }

        .jobs-timeline {
            display: grid;
            gap: 2rem;
            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
            padding: 1rem;
        }

        .job-card {
            background: var(--component-hover-bg);
            border-radius: 1rem;
            padding: 1.5rem;
            position: relative;
            border: 1px solid var(--border-color);
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }

        .job-header {
            display: flex;
            gap: 1rem;
        }

        .job-avatar {
            width: 64px;
            height: 64px;
            min-width: 64px;
            border-radius: 24px;
            overflow: hidden;
            border: 2px solid var(--border-color);
        }

        .job-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .status-badge {
            position: absolute;
            top: 1rem;
            left: 1rem;
            padding: 0.6rem 1.2rem;
            border-radius: 100px;
            font-size: 0.9rem;
            font-weight: 600;
            display: flex;
            align-items: center;
            gap: 0.5rem;
            color: white;
        }

        .status-badge.applied { background: #6366f1; }
        .status-badge.Approved { background: #10b981; }
        .status-badge.Reject { background: #ef4444; }
        .status-badge.Interview { background: #f59e0b; }
        .status-badge.resign_pending { background: #f97316; } 
        .status-badge.resigned { background: #9333ea; } 

        .job-info {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            flex: 1;
            min-width: 0; 
        }

        .job-name {
            font-size: 1.1rem;
            font-weight: 700;
            color: var(--text-color);
            margin-bottom: 0.5rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .job-date {
            margin-top: auto;
            align-self: flex-start;
        }

        .user-id {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            background: rgba(var(--primary-color-rgb), 0.1);
            color: var(--primary-color);
            padding: 0.4rem 0.8rem;
            border-radius: 0.5rem;
            font-size: 0.9rem;
            font-weight: 500;
            margin-bottom: 0.5rem;
        }

        .discord-image {
            width: 80px;
            height: 80px;
            border-radius: 24px;
            object-fit: cover;
            border: 2px solid var(--border-color);
            background: var(--component-bg);
        }

        .discord-name {
            color: #5865F2;
            font-size: 0.9rem;
            margin-right: 0.5rem;
            opacity: 0.9;
        }

        .job-user {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            color: var(--text-muted);
            font-size: 0.95rem;
        }

        .job-user i {
            color: var(--primary-color);
            font-size: 0.9rem;
        }

        @media (max-width: 1024px) {
            .job-card {
                grid-template-columns: auto 1fr;
                grid-template-rows: auto auto;
            }

            .status-badge {
                justify-self: start;
            }

            .job-date {
                justify-self: start;
            }
        }

        @media (max-width: 640px) {
            .job-card {
                grid-template-columns: 1fr;
                text-align: center;
            }

            .job-header {
                flex-direction: column;
                text-align: center;
            }

            .status-badge, .job-date {
                justify-self: center;
            }

            .job-info {
                align-items: center;
            }
        }

        @media (max-width: 768px) {
            .recent-jobs {
                padding: 1rem;
                margin: 1rem;
            }

            .job-card {
                flex-direction: column;
                align-items: stretch;
                gap: 1rem;
            }

            .jobs-timeline {
                grid-template-columns: 1fr;
            }

            .status-badge {
                margin-left: 0;
                align-self: flex-start;
            }

            .job-date {
                align-self: flex-start;
            }
        }

        .recent-jobs-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 1rem 1rem 1rem;
            border-bottom: 1px solid var(--border-color);
            margin-bottom: 1rem;
        }

        .header-title {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 1.2rem;
            font-weight: 600;
            color: var(--text-color);
        }

        .header-title i {
            color: var(--primary-color);
        }

        .jobs-count {
            display: flex;
            gap: 1rem;
        }

        .count-item {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.5rem 1rem;
            border-radius: 0.5rem;
            background: var(--component-hover-bg);
            border: 1px solid var(--border-color);
        }

        .count-value {
            font-weight: 600;
            color: var(--primary-color);
        }

        .count-label {
            color: var(--text-muted);
            font-size: 0.9rem;
        }

        .stats-grid {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 1rem;
            margin-bottom: 2rem;
            padding: 1rem;
            background: var(--component-hover-bg);
            border-radius: 1rem;
            border: 1px solid var(--border-color);
        }

        .stat-card {
            background: var(--component-bg);
            padding: 1.25rem;
            border-radius: 0.75rem;
            border: 1px solid var(--border-color);
            display: flex;
            flex-direction: column;
            gap: 0.75rem;
            transition: all 0.3s ease;
        }

        .stat-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .stat-icon {
            width: 40px;
            height: 40px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.25rem;
            color: white;
        }

        .stat-icon.total { background: #6366f1; }
        .stat-icon.approved { background: #10b981; }
        .stat-icon.Interview { background: #f59e0b; }
        .stat-icon.rejected { background: #ef4444; }
        .stat-icon.applied { background: #6366f1; }

        .stat-value {
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--text-color);
        }

        .stat-label {
            color: var(--text-muted);
            font-size: 0.9rem;
        }

        @media (max-width: 1200px) {
            .stats-grid {
                grid-template-columns: repeat(3, 1fr);
            }
        }

        @media (max-width: 1024px) {
            .stats-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 640px) {
            .stats-grid {
                grid-template-columns: 1fr;
            }
        }

        
        .search-container {
            margin-bottom: 1.5rem;
            padding: 1rem;
            background: var(--component-hover-bg);
            border-radius: 1rem;
            border: 1px solid var(--border-color);
        }

        .search-wrapper {
            position: relative;
            display: flex;
            align-items: center;
        }

        .search-input {
            width: 100%;
            padding: 1rem 3rem;
            border-radius: 0.75rem;
            border: 2px solid var(--border-color);
            background: var(--component-bg);
            color: var(--text-color);
            font-size: 1rem;
            transition: all 0.3s ease;
        }

        .search-input:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 3px rgba(var(--primary-color-rgb), 0.1);
            outline: none;
        }

        .search-icon {
            position: absolute;
            right: 1rem;
            color: var(--primary-color);
            font-size: 1.2rem;
        }

        .clear-search {
            position: absolute;
            left: 1rem;
            color: var(--text-muted);
            cursor: pointer;
            padding: 0.5rem;
            border-radius: 50%;
            transition: all 0.3s ease;
        }

        .clear-search:hover {
            background: var(--component-hover-bg);
            color: var (--danger-color);
        }

        .job-card.hidden {
            display: none;
        }

        .job-actions {
            display: flex;
            gap: 0.5rem;
            margin-top: 1rem;
            padding-top: 1rem;
            border-top: 1px solid var(--border-color);
        }
        .action-btn {
            padding: 0.5rem 1rem;
            border-radius: 0.5rem;
            border: none;
            cursor: pointer;
            font-size: 0.9rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
            transition: all 0.3s ease;
            color: white;
        }

        .btn-interview { background: #f59e0b; }
        .btn-approve { background: #10b981; }
        .btn-reject { background: #ef4444; }

        .action-btn:hover {
            filter: brightness(1.1);
            transform: translateY(-1px);
        }

        .action-btn:active {
            transform: translateY(0);
        }

        .action-btn.disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

        
        .rejection-modal {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 1000;
            direction: rtl;
        }

        .modal-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: var(--component-bg);
            padding: 2rem;
            border-radius: 1rem;
            width: 90%;
            max-width: 500px;
        }

        .modal-header {
            margin-bottom: 1.5rem;
            font-size: 1.2rem;
            font-weight: 600;
            color: var(--text-color);
        }

        .modal-body textarea {
            width: 100%;
            padding: 1rem;
            border-radius: 0.5rem;
            border: 1px solid var(--border-color);
            background: var(--component-hover-bg);
            color: var(--text-color);
            margin-bottom: 1rem;
            min-height: 100px;
            resize: vertical;
        }

        .modal-footer {
            display: flex;
            gap: 1rem;
            justify-content: flex-start;
        }

        .modal-btn {
            padding: 0.5rem 1.5rem;
            border-radius: 0.5rem;
            border: none;
            cursor: pointer;
            font-size: 0.9rem;
            color: white;
        }

        .btn-confirm-reject { background: #ef4444; }
        .btn-cancel { background: #6b7280; }

        .log-modal {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 1000;
            direction: rtl;
        }

        .log-list {
            max-height: 400px;
            overflow-y: auto;
            margin: 1rem 0;
        }

        .log-item {
            padding: 1rem;
            border-bottom: 1px solid var(--border-color);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .log-item:last-child {
            border-bottom: none;
        }

        .log-info {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
        }

        .log-admin {
            color: var(--primary-color);
            font-weight: 500;
        }

        .log-date {
            color: var(--text-muted);
            font-size: 0.9rem;
        }

        .log-action {
            padding: 0.4rem 0.8rem;
            border-radius: 0.5rem;
            color: white;
            font-size: 0.9rem;
        }

        .btn-show-logs {
            background: none;
            border: none;
            color: var(--primary-color);
            cursor: pointer;
            padding: 0.5rem;
            border-radius: 50%;
            transition: all 0.3s ease;
        }

        .btn-show-logs:hover {
            background: rgba(var(--primary-color-rgb), 0.1);
            transform: scale(1.1);
        }

        .rejection-reason {
            background: rgba(239, 68, 68, 0.1);
            color: #ef4444;
            padding: 0.75rem;
            border-radius: 0.5rem;
            margin-top: 0.5rem;
            font-size: 0.9rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .log-reason {
            color: #ef4444;
            font-size: 0.9rem;
            margin-top: 0.25rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .log-reason i,
        .rejection-reason i {
            font-size: 0.8rem;
        }

        
        .log-rejection-reason {
            background: rgba(239, 68, 68, 0.1);
            color: #ef4444;
            padding: 0.75rem;
            border-radius: 0.5rem;
            margin-top: 0.5rem;
            font-size: 0.9rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .log-rejection-reason i {
            color: #ef4444;
            font-size: 1rem;
        }

        .rejection-by-admin {
            margin-top: 0.25rem;
            color: var(--text-muted);
            font-size: 0.85rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .rejection-by-admin i {
            color: var(--primary-color);
        }
    </style>

    <script>
        // Save scroll position before form submit
        document.addEventListener('DOMContentLoaded', function() {
            // Restore scroll position if exists in URL
            const urlParams = new URLSearchParams(window.location.search);
            const scrollPos = urlParams.get('scroll');
            if (scrollPos) {
                window.scrollTo(0, parseInt(scrollPos));
            }

            // Add hidden input for scroll position to all forms
            document.querySelectorAll('form').forEach(form => {
                form.addEventListener('submit', function() {
                    const scrollInput = document.createElement('input');
                    scrollInput.type = 'hidden';
                    scrollInput.name = 'scrollPosition';
                    scrollInput.value = window.pageYOffset;
                    this.appendChild(scrollInput);
                });
            });
        });
    </script>

    <div class="recent-jobs">
        
        <div class="search-container">
            <div class="search-wrapper">
                <i class="fas fa-search search-icon"></i>
                <input type="text" 
                       class="search-input" 
                       id="jobSearch"
                       placeholder="ابحث عن اسم الوظيفة، اسم المستخدم، أو الايدي..."
                       autocomplete="off">
                <i class="fas fa-times clear-search" onclick="clearSearch()"></i>
            </div>
        </div>

        <div class="stats-grid">
            <div class="stat-card">
                <div class="stat-header">
                    <div class="stat-icon total">
                        <i class="fas fa-list"></i>
                    </div>
                    <div class="stat-label">إجمالي التقديمات</div>
                </div>
                <div class="stat-value">echo count($recentJobs);</div>
            </div>
            $statuses = [
                    'applied' => 0,
                    'Approved' => 0,
                    'Reject' => 0,
                    'Interview' => 0
                ];
                foreach ($recentJobs as $job) {
                    if (isset($statuses[$job['status']])) {
                        $statuses[$job['status']]++;
                    }
                }
   
            <div class="stat-card">
                <div class="stat-header">
                    <div class="stat-icon applied">
                        <i class="fas fa-paper-plane"></i>
                    </div>
                    <div class="stat-label">انتظار</div>
                </div>
                <div class="stat-value">echo $statuses['applied'];</div>
            </div>
            <div class="stat-card">
                <div class="stat-header">
                    <div class="stat-icon approved">
                        <i class="fas fa-check-circle"></i>
                    </div>
                    <div class="stat-label">التقديمات المقبولة</div>
                </div>
                <div class="stat-value">echo $statuses['Approved'];</div>
            </div>
            <div class="stat-card">
                <div class="stat-header">
                    <div class="stat-icon Interview">
                        <i class="fas fa-clock"></i>
                    </div>
                    <div class="stat-label">قيد المراجعة</div>
                </div>
                <div class="stat-value">echo $statuses['Interview'];</div>
            </div>
            <div class="stat-card">
                <div class="stat-header">
                    <div class="stat-icon rejected">
                        <i class="fas fa-times-circle"></i>
                    </div>
                    <div class="stat-label">التقديمات المرفوضة</div>
                </div>
                <div class="stat-value">echo $statuses['Reject'];</div>
            </div>
        </div>

        <div class="jobs-timeline">
            foreach($recentJobs as $job):
                <div class="job-card" 
                     data-job-id="echo htmlspecialchars($job['id']);" 
                     data-discord-id="echo htmlspecialchars($job['discord_id']);" 
                     data-job-job-id="echo htmlspecialchars($job['job_id']);">
                    
                    <div class="job-header">
                        <div class="job-avatar">
                            if ($job['discord_id']):
                                <img class="discord-image"
                                     src="echo htmlspecialchars(getDiscordUserAvatar($job['discord_id']));" 
                                     alt="echo htmlspecialchars($job['username']);"
                                     onerror="this.src='assets/images/default-avatar.png'">
                            else:
                                <img class="discord-image" 
                                     src="assets/images/default-avatar.png" 
                                     alt="Default Avatar">
                            endif;
                        </div>
                        
                        <div class="job-info">
                            <div class="user-id">
                                <i class="fas fa-id-card"></i>
                                ID: echo htmlspecialchars($job['user_id']);
                            </div>
                            <div class="job-name">
                                <i class="fas fa-briefcase"></i>
                                echo htmlspecialchars($job['job_name']);
                                if ($job['job_id']):
                                    <span class="job-id">(#echo htmlspecialchars($job['job_id']);)</span>
                                endif;
                            </div>
                            <div class="job-user">
                                <i class="fas fa-user"></i>
                                echo htmlspecialchars($job['username']);
                                if ($job['discord_username']):
                                    <span class="discord-name">
                                        (echo htmlspecialchars($job['discord_username']);)
                                    </span>
                                endif;
                            </div>
                        </div>
                    </div>

                    
                    <div style="display: flex; align-items: center; gap: 1rem;">
                        <span class="status-badge echo $job['status'];">
                            <i class="fas fa-echo getLogIcon($job['status']);"></i>
                            echo formatLogAppAction($job['status']);
                        </span>
                        <a href="?show_logs=true&application_id=echo $job['id'];" class="btn-show-logs">
                            <i class="fas fa-eye"></i>
                        </a>
                    </div>

                    if ($job['status'] === 'Reject' && isset($job['rejection_reason'])):
                        <div class="rejection-reason">
                            <i class="fas fa-comment-alt"></i>
                            <div class="rejection-content">
                                <div class="rejection-text">
                                    سبب الرفض: echo htmlspecialchars($job['rejection_reason']);
                                </div>
                              
                            </div>
                        </div>
                    endif;

                    <div class="job-date">
                        <i class="fas fa-calendar-alt"></i>
                        $date = new DateTime($job['application_date']);
                            echo $date->format('Y/m/d - H:i');
                    </div>

                    // Show actions based on current status
                        if ($job['status'] === 'applied'):
                            <div class="job-actions">
                                <form method="POST" style="display: inline;">
                                    <input type="hidden" name="action" value="updateStatus">
                                    <input type="hidden" name="application_id" value="echo $job['id'];">
                                    <input type="hidden" name="job_id" value="echo $job['job_id'];">
                                    <input type="hidden" name="status" value="Interview">
                                    <button type="submit" class="action-btn btn-interview">
                                        <i class="fas fa-user-tie"></i>
                                        مقابلة
                                    </button>
                                </form>
                            </div>
                        elseif ($job['status'] === 'Interview'):
                            <div class="job-actions">
                                <form method="POST" style="display: inline;">
                                    <input type="hidden" name="action" value="updateStatus">
                                    <input type="hidden" name="application_id" value="echo $job['id'];">
                                    <input type="hidden" name="job_id" value="echo $job['job_id'];">
                                    <input type="hidden" name="status" value="Approved">
                                    <button type="submit" class="action-btn btn-approve">
                                        <i class="fas fa-check"></i>
                                        قبول
                                    </button>
                                </form>
                                <button onclick="showRejectionModal(echo $job['id'];)" class="action-btn btn-reject">
                                    <i class="fas fa-times"></i>
                                    رفض
                                </button>
                            </div>
                        elseif ($job['status'] === 'Reject'):
                            <div class="job-actions">
                                <form method="POST" style="display: inline;">
                                    <input type="hidden" name="action" value="updateStatus">
                                    <input type="hidden" name="application_id" value="echo $job['id'];">
                                    <input type="hidden" name="job_id" value="echo $job['job_id'];">
                                    <input type="hidden" name="status" value="Interview">
                                    <button type="submit" class="action-btn btn-interview">
                                        <i class="fas fa-user-tie"></i>
                                        مقابلة
                                    </button>
                                </form>
                            </div>
                        endif;
                </div>
            endforeach;
        </div>

        
        <div id="rejectionModal" class="rejection-modal">
            <div class="modal-content">
                <div class="modal-header">سبب الرفض</div>
                <div class="modal-body">
                    <textarea id="rejectionReason" placeholder="اكتب سبب الرفض هنا..."></textarea>
                </div>
                <div class="modal-footer">
                    <button class="modal-btn btn-confirm-reject" onclick="submitRejection()">
                        <i class="fas fa-times"></i> تأكيد الرفض
                    </button>
                    <button class="modal-btn btn-cancel" onclick="closeRejectionModal()">
                        <i class="fas fa-times"></i> إلغاء
                    </button>
                </div>
            </div>
        </div>

        
        <div id="logModal" class="log-modal"if(isset($_GET['show_logs'])): style="display: block;"endif;>
            <div class="modal-content">
                <div class="modal-header">سجل التحديثات</div>
                <div class="log-list" id="logList">
                    if (isset($_GET['application_id']) && isset($_GET['show_logs'])) {
                        $logs = getJobLogsByJobId($_GET['application_id']);
                        foreach ($logs as $log):
                            $statusColor = getStatusColor($log['action']);
                            $adminName = $log['admin_name'] ?: 'مجهول';
                            $details = !empty($log['details']) ? json_decode($log['details'], true) : null;
                        <div class="log-item">
                            <div class="log-info">
                                <div class="log-admin">
                                    <i class="fas fa-user"></i>
                                    echo htmlspecialchars($adminName['name'] ?? $adminName['username'] ?? 'مجهول');
                                </div>
                                <div class="log-date">
                                    <i class="fas fa-calendar"></i>
                                    echo $log['timestamp'];
                                </div>
                                <div class="log-details">
                                    <i class="fas fa-info-circle"></i>
                                    if (isset($details['old_status'], $details['new_status'])) {
                                        echo 'من ' . formatLogAppAction($details['old_status']) . 
                                             ' إلى ' . formatLogAppAction($details['new_status']);
                                        
                                        // Add rejection reason if status changed to Reject
                                        if ($details['new_status'] === 'Reject' && isset($details['rejection_reason'])) {
                                            echo '<div class="log-rejection-reason">';
                                            echo '<i class="fas fa-comment-alt"></i>';
                                            echo 'سبب الرفض: ';
                                            
                                            // Fix for the htmlspecialchars error - ensure we're handling string values
                                            if (is_array($details['rejection_reason'])) {
                                                echo htmlspecialchars(json_encode($details['rejection_reason']));
                                            } else {
                                                echo htmlspecialchars((string)$details['rejection_reason']);
                                            }
                                            
                                            echo '</div>';
                                        }
                                    }
                                </div>
                            </div>
                            <span class="log-action" style="background: echo $statusColor;">
                                echo formatLogAppAction($log['action']);
                            </span>
                        </div>
                    endforeach;
                    }
                </div>
                <div class="modal-footer">
                    <a href="echo strtok($_SERVER["REQUEST_URI"], '?');" class="modal-btn btn-cancel">
                        <i class="fas fa-times"></i> إغلاق
                    </a>
                </div>
            </div>
        </div>

        <style>
            
            .log-details {
                font-size: 0.9rem;
                color: var(--text-muted);
                margin-top: 0.25rem;
            }
            
            .log-details i {
                margin-right: 0.5rem;
                color: var(--primary-color);
            }
        </style>
    </div>
    <script src="assets/js/notifications.js"></script>

    if (isset($_SESSION['success'])):
        <script>
            showNotification('echo addslashes($_SESSION['success']);', 'success');
        </script>
        unset($_SESSION['success']);
    endif;

    if (isset($_SESSION['error'])):
        <script>
            showNotification('echo addslashes($_SESSION['error']);', 'error');
        </script>
        unset($_SESSION['error']);
    endif;
    <script>
        // Define log handling functions first
        let currentLogJobId = null;
        let currentJobId = null;

        function formatLogAppAction(action) {
            const actions = {
                'PENDING': 'قيد المراجعة',
                'INTERVIEW': 'مقابلة',
                'TRAINING': 'تدريب',
                'APPROVED': 'مقبول',
                'REJECT': 'مرفوض',
                'CANCELED': 'ملغي',
                'APPLIED': 'انتظار'
            };
            return actions[action.toUpperCase()] || action;
        }

        function clearSearch() {
            document.getElementById('jobSearch').value = '';
            filterJobs('');
            updateStats();
        }

        function filterJobs(searchTerm) {
            const cards = document.querySelectorAll('.job-card');
            let visibleCount = 0;
            
            cards.forEach(card => {
                const jobName = card.querySelector('.job-name').textContent.toLowerCase();
                const userName = card.querySelector('.job-user').textContent.toLowerCase();
                const userId = card.querySelector('.user-id').textContent.toLowerCase();
                const searchLower = searchTerm.toLowerCase();

                if (jobName.includes(searchLower) || 
                    userName.includes(searchLower) || 
                    userId.includes(searchLower)) {
                    card.classList.remove('hidden');
                    visibleCount++;
                } else {
                    card.classList.add('hidden');
                }
            });

            updateStats();
        }

        function updateStats() {
            const cards = document.querySelectorAll('.job-card:not(.hidden)');
            const stats = {
                total: cards.length,
                applied: 0,
                Approved: 0,
                Reject: 0,
                Interview: 0
            };

            cards.forEach(card => {
                const status = card.querySelector('.status-badge').classList[1];
                if (stats.hasOwnProperty(status)) {
                    stats[status]++;
                }
            });

            // Update stat values
            document.querySelector('.stat-card:nth-child(1) .stat-value').textContent = stats.total;
            document.querySelector('.stat-card:nth-child(2) .stat-value').textContent = stats.applied;
            document.querySelector('.stat-card:nth-child(3) .stat-value').textContent = stats.Approved;
            document.querySelector('.stat-card:nth-child(4) .stat-value').textContent = stats.Interview;
            document.querySelector('.stat-card:nth-child(5) .stat-value').textContent = stats.Reject;
        }

        // Add event listener for search input
        document.getElementById('jobSearch').addEventListener('input', (e) => {
            filterJobs(e.target.value);
        });

        // ...existing script...

        function showRejectionModal(applicationId) {
            currentJobId = applicationId;  // You can rename this variable if desired
            document.getElementById('rejectionModal').style.display = 'block';
            document.getElementById('rejectionReason').value = '';
        }

        function closeRejectionModal() {
            document.getElementById('rejectionModal').style.display = 'none';
            currentJobId = null;
        }

        function submitRejection() {
            const reason = document.getElementById('rejectionReason').value;
            if (!reason.trim()) {
                alert('يرجى كتابة سبب الرفض');
                return;
            }

            // Create form with all necessary data
            const form = document.createElement('form');
            form.method = 'POST';
            
            // Add fields
            const fields = {
                'action': 'updateStatus',
                'application_id': currentJobId,
                'status': 'Reject',
                'rejection_reason': reason,
                'scrollPosition': window.pageYOffset
            };

            // Add each field to form
            Object.entries(fields).forEach(([name, value]) => {
                const input = document.createElement('input');
                input.type = 'hidden';
                input.name = name;
                input.value = value;
                form.appendChild(input);
            });

            // Submit form
            document.body.appendChild(form);
            form.submit();
        }

        // Close modal when clicking outside
        window.onclick = function(event) {
            if (event.target == document.getElementById('logModal')) {
                closeLogModal();
            } else if (event.target == document.getElementById('rejectionModal')) {
                closeRejectionModal();
            }
        }
    </script>

}

function getStatusColor($status) {
    $colors = [
        'Interview' => '#6366f1',
        'Approved' => '#10b981',
        'Reject' => '#ef4444',
        'Pending' => '#f59e0b',
        'Training' => '#06b6d4',
        'Canceled' => '#6b7280',
        'applied' => '#6366f1',      // Same as Interview - blue/purple
        'cancelled' => '#6b7280',    // Same as Canceled - gray
        'resign_pending' => '#f97316', // Orange - different from Pending
        'resigned' => '#9333ea'       // Purple
    ];
    return $colors[$status] ?? '#6b7280'; // Default to gray if status not found
}

function safeHtmlSpecialChars($value) {
    if (is_array($value)) {
        return htmlspecialchars(json_encode($value));
    }
    return htmlspecialchars((string)$value);
}