Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory :  /home/gositeme/domains/soundstudiopro.com/private_html/admin_includes/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<?php
require_once __DIR__ . '/../config/database.php';
require_once __DIR__ . '/../includes/security_tracking.php';

// Skip admin validation if already done in admin.php
// Admin validation is handled by admin.php

// Get security statistics
function getSecurityStats() {
    try {
        $pdo = getDBConnection();
        
        // Get counts for last 24 hours
        $stmt = $pdo->prepare("
            SELECT 
                COUNT(*) as total_events,
                SUM(CASE WHEN event_type IN ('login_failed', 'login_failed_nonexistent', 'csrf_violation', 'user_blocked') THEN 1 ELSE 0 END) as security_threats,
                SUM(CASE WHEN event_type = 'login_success' THEN 1 ELSE 0 END) as successful_logins,
                SUM(CASE WHEN event_type = 'login_failed' THEN 1 ELSE 0 END) as failed_logins,
                SUM(CASE WHEN event_type = 'registration_success' THEN 1 ELSE 0 END) as successful_registrations,
                SUM(CASE WHEN event_type = 'registration_failed' THEN 1 ELSE 0 END) as failed_registrations
            FROM security_events 
            WHERE created_at >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
        ");
        $stmt->execute();
        $stats = $stmt->fetch(PDO::FETCH_ASSOC);
        
        // Get active users (logged in last 30 minutes)
        $stmt = $pdo->prepare("
            SELECT COUNT(*) as active_users
            FROM users 
            WHERE last_login_at >= DATE_SUB(NOW(), INTERVAL 30 MINUTE)
        ");
        $stmt->execute();
        $active_users = $stmt->fetchColumn();
        
        // Get blocked users
        $stmt = $pdo->prepare("SELECT COUNT(*) FROM users WHERE is_blocked = 1");
        $stmt->execute();
        $blocked_users = $stmt->fetchColumn();
        
        // Get total page visits today
        $stmt = $pdo->prepare("
            SELECT COUNT(*) as total_visits
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
        ");
        $stmt->execute();
        $total_visits = $stmt->fetchColumn();
        
        // Get unique visitors today
        $stmt = $pdo->prepare("
            SELECT COUNT(DISTINCT ip_address) as unique_visitors
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
        ");
        $stmt->execute();
        $unique_visitors = $stmt->fetchColumn();
        
        return [
            'total_events' => $stats['total_events'] ?? 0,
            'security_threats' => $stats['security_threats'] ?? 0,
            'successful_logins' => $stats['successful_logins'] ?? 0,
            'failed_logins' => $stats['failed_logins'] ?? 0,
            'successful_registrations' => $stats['successful_registrations'] ?? 0,
            'failed_registrations' => $stats['failed_registrations'] ?? 0,
            'active_users' => $active_users,
            'blocked_users' => $blocked_users,
            'total_visits' => $total_visits,
            'unique_visitors' => $unique_visitors
        ];
    } catch (Exception $e) {
        error_log("Error getting security stats: " . $e->getMessage());
        return [];
    }
}

// Get recent security events
function getRecentSecurityEvents($limit = 20) {
    try {
        $pdo = getDBConnection();
        $stmt = $pdo->prepare("
            SELECT 
                se.*,
                u.name as user_name,
                u.email as user_email
            FROM security_events se
            LEFT JOIN users u ON se.user_id = u.id
            ORDER BY se.created_at DESC
            LIMIT ?
        ");
        $stmt->execute([$limit]);
        return $stmt->fetchAll(PDO::FETCH_ASSOC);
    } catch (Exception $e) {
        error_log("Error getting recent security events: " . $e->getMessage());
        return [];
    }
}

// Get top visiting countries
function getTopVisitingCountries($limit = 10) {
    try {
        $pdo = getDBConnection();
        $stmt = $pdo->prepare("
            SELECT 
                country,
                COUNT(*) as visit_count
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
            AND country != 'Unknown' AND country != 'Local'
            GROUP BY country
            ORDER BY visit_count DESC
            LIMIT ?
        ");
        $stmt->execute([$limit]);
        return $stmt->fetchAll(PDO::FETCH_ASSOC);
    } catch (Exception $e) {
        error_log("Error getting top visiting countries: " . $e->getMessage());
        return [];
    }
}

// Get most visited pages
function getMostVisitedPages($limit = 10) {
    try {
        $pdo = getDBConnection();
        $stmt = $pdo->prepare("
            SELECT 
                page_url,
                COUNT(*) as visit_count
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
            GROUP BY page_url
            ORDER BY visit_count DESC
            LIMIT ?
        ");
        $stmt->execute([$limit]);
        return $stmt->fetchAll(PDO::FETCH_ASSOC);
    } catch (Exception $e) {
        error_log("Error getting most visited pages: " . $e->getMessage());
        return [];
    }
}

// Get recent login attempts
function getRecentLoginAttempts($limit = 20) {
    try {
        $pdo = getDBConnection();
        $stmt = $pdo->prepare("
            SELECT 
                ulh.*,
                u.name as user_name,
                u.email as user_email
            FROM user_login_history ulh
            LEFT JOIN users u ON ulh.user_id = u.id
            ORDER BY ulh.login_time DESC
            LIMIT ?
        ");
        $stmt->execute([$limit]);
        return $stmt->fetchAll(PDO::FETCH_ASSOC);
    } catch (Exception $e) {
        error_log("Error getting recent login attempts: " . $e->getMessage());
        return [];
    }
}

// Get recent registration attempts
function getRecentRegistrationAttempts($limit = 20) {
    try {
        $pdo = getDBConnection();
        $stmt = $pdo->prepare("
            SELECT *
            FROM registration_events
            ORDER BY created_at DESC
            LIMIT ?
        ");
        $stmt->execute([$limit]);
        return $stmt->fetchAll(PDO::FETCH_ASSOC);
    } catch (Exception $e) {
        error_log("Error getting recent registration attempts: " . $e->getMessage());
        return [];
    }
}

// Get device statistics
function getDeviceStats() {
    try {
        $pdo = getDBConnection();
        
        // Browser stats
        $stmt = $pdo->prepare("
            SELECT 
                browser,
                COUNT(*) as count
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
            AND browser != 'Unknown'
            GROUP BY browser
            ORDER BY count DESC
            LIMIT 5
        ");
        $stmt->execute();
        $browsers = $stmt->fetchAll(PDO::FETCH_ASSOC);
        
        // OS stats
        $stmt = $pdo->prepare("
            SELECT 
                os,
                COUNT(*) as count
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
            AND os != 'Unknown'
            GROUP BY os
            ORDER BY count DESC
            LIMIT 5
        ");
        $stmt->execute();
        $operatingSystems = $stmt->fetchAll(PDO::FETCH_ASSOC);
        
        // Device type stats
        $stmt = $pdo->prepare("
            SELECT 
                device_type,
                COUNT(*) as count
            FROM page_visits 
            WHERE visit_time >= DATE_SUB(NOW(), INTERVAL 24 HOUR)
            GROUP BY device_type
            ORDER BY count DESC
        ");
        $stmt->execute();
        $deviceTypes = $stmt->fetchAll(PDO::FETCH_ASSOC);
        
        return [
            'browsers' => $browsers,
            'operating_systems' => $operatingSystems,
            'device_types' => $deviceTypes
        ];
    } catch (Exception $e) {
        error_log("Error getting device stats: " . $e->getMessage());
        return [];
    }
}

// Get data for display
$stats = getSecurityStats();
$recentEvents = getRecentSecurityEvents(10);
$topCountries = getTopVisitingCountries(5);
$mostVisitedPages = getMostVisitedPages(5);
$recentLogins = getRecentLoginAttempts(10);
$recentRegistrations = getRecentRegistrationAttempts(10);
$deviceStats = getDeviceStats();
?>

<div class="security-intelligence">
    <div class="section-header">
        <h2><i class="fas fa-shield-alt"></i> Security Intelligence Dashboard</h2>
        <p>Real-time monitoring of all site activity, security threats, and user behavior</p>
    </div>

    <!-- Security Statistics -->
    <div class="stats-grid">
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-eye"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['total_visits']) ?></div>
                <div class="stat-label">Page Visits (24h)</div>
            </div>
        </div>
        
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-users"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['unique_visitors']) ?></div>
                <div class="stat-label">Unique Visitors (24h)</div>
            </div>
        </div>
        
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-sign-in-alt"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['successful_logins']) ?></div>
                <div class="stat-label">Successful Logins (24h)</div>
            </div>
        </div>
        
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-times-circle"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['failed_logins']) ?></div>
                <div class="stat-label">Failed Logins (24h)</div>
            </div>
        </div>
        
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-user-plus"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['successful_registrations']) ?></div>
                <div class="stat-label">New Registrations (24h)</div>
            </div>
        </div>
        
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-exclamation-triangle"></i></div>
            <div class="stat-content">
                <div class="stat-number"><?= number_format($stats['security_threats']) ?></div>
                <div class="stat-label">Security Threats (24h)</div>
            </div>
        </div>
    </div>

    <!-- Recent Activity Tabs -->
    <div class="activity-tabs">
        <div class="tab-buttons">
            <button class="tab-btn active" data-tab="security-events">Security Events</button>
            <button class="tab-btn" data-tab="login-attempts">Login Attempts</button>
            <button class="tab-btn" data-tab="registrations">Registrations</button>
            <button class="tab-btn" data-tab="visitor-stats">Visitor Statistics</button>
        </div>

        <!-- Security Events Tab -->
        <div class="tab-content active" id="security-events">
            <div class="table-container">
                <table class="data-table">
                    <thead>
                        <tr>
                            <th>Time</th>
                            <th>Event Type</th>
                            <th>User</th>
                            <th>IP Address</th>
                            <th>Location</th>
                            <th>Device</th>
                            <th>Details</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($recentEvents as $event): ?>
                        <tr class="event-<?= $event['event_type'] ?>">
                            <td><?= date('M j, H:i', strtotime($event['created_at'])) ?></td>
                            <td>
                                <span class="event-badge event-<?= $event['event_type'] ?>">
                                    <?= ucwords(str_replace('_', ' ', $event['event_type'])) ?>
                                </span>
                            </td>
                            <td>
                                <?php if ($event['user_name']): ?>
                                    <?= htmlspecialchars($event['user_name']) ?><br>
                                    <small><?= htmlspecialchars($event['user_email']) ?></small>
                                <?php else: ?>
                                    <span class="text-muted">Guest</span>
                                <?php endif; ?>
                            </td>
                            <td><?= htmlspecialchars($event['ip_address']) ?></td>
                            <td>
                                <?= htmlspecialchars($event['city']) ?>, <?= htmlspecialchars($event['country']) ?>
                            </td>
                            <td>
                                <?= htmlspecialchars($event['browser']) ?> on <?= htmlspecialchars($event['os']) ?><br>
                                <small><?= htmlspecialchars($event['device_type']) ?></small>
                            </td>
                            <td>
                                <?php if ($event['error_message']): ?>
                                    <span class="error-detail"><?= htmlspecialchars($event['error_message']) ?></span>
                                <?php endif; ?>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- Login Attempts Tab -->
        <div class="tab-content" id="login-attempts">
            <div class="table-container">
                <table class="data-table">
                    <thead>
                        <tr>
                            <th>Time</th>
                            <th>Email</th>
                            <th>Status</th>
                            <th>IP Address</th>
                            <th>Location</th>
                            <th>Device</th>
                            <th>Failure Reason</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($recentLogins as $login): ?>
                        <tr class="login-<?= $login['success'] ? 'success' : 'failed' ?>">
                            <td><?= date('M j, H:i', strtotime($login['login_time'])) ?></td>
                            <td><?= htmlspecialchars($login['email']) ?></td>
                            <td>
                                <span class="status-badge <?= $login['success'] ? 'success' : 'failed' ?>">
                                    <?= $login['success'] ? 'Success' : 'Failed' ?>
                                </span>
                            </td>
                            <td><?= htmlspecialchars($login['ip_address']) ?></td>
                            <td>
                                <?= htmlspecialchars($login['city']) ?>, <?= htmlspecialchars($login['country']) ?>
                            </td>
                            <td>
                                <?php 
                                $deviceInfo = json_decode($login['device_info'], true);
                                echo htmlspecialchars($deviceInfo['browser'] ?? 'Unknown') . ' on ' . htmlspecialchars($deviceInfo['os'] ?? 'Unknown');
                                ?>
                            </td>
                            <td>
                                <?php if (!$login['success'] && $login['failure_reason']): ?>
                                    <span class="error-detail"><?= htmlspecialchars($login['failure_reason']) ?></span>
                                <?php endif; ?>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- Registrations Tab -->
        <div class="tab-content" id="registrations">
            <div class="table-container">
                <table class="data-table">
                    <thead>
                        <tr>
                            <th>Time</th>
                            <th>Name</th>
                            <th>Email</th>
                            <th>Status</th>
                            <th>IP Address</th>
                            <th>Location</th>
                            <th>Failure Reason</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($recentRegistrations as $reg): ?>
                        <tr class="registration-<?= $reg['success'] ? 'success' : 'failed' ?>">
                            <td><?= date('M j, H:i', strtotime($reg['created_at'])) ?></td>
                            <td><?= htmlspecialchars($reg['name']) ?></td>
                            <td><?= htmlspecialchars($reg['email']) ?></td>
                            <td>
                                <span class="status-badge <?= $reg['success'] ? 'success' : 'failed' ?>">
                                    <?= $reg['success'] ? 'Success' : 'Failed' ?>
                                </span>
                            </td>
                            <td><?= htmlspecialchars($reg['ip_address']) ?></td>
                            <td>
                                <?= htmlspecialchars($reg['city']) ?>, <?= htmlspecialchars($reg['country']) ?>
                            </td>
                            <td>
                                <?php if (!$reg['success'] && $reg['failure_reason']): ?>
                                    <span class="error-detail"><?= htmlspecialchars($reg['failure_reason']) ?></span>
                                <?php endif; ?>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- Visitor Statistics Tab -->
        <div class="tab-content" id="visitor-stats">
            <div class="stats-row">
                <!-- Top Countries -->
                <div class="stat-section">
                    <h3><i class="fas fa-globe"></i> Top Visiting Countries</h3>
                    <div class="chart-container">
                        <?php foreach ($topCountries as $country): ?>
                        <div class="chart-item">
                            <div class="chart-label"><?= htmlspecialchars($country['country']) ?></div>
                            <div class="chart-bar">
                                <div class="chart-fill" style="width: <?= min(100, ($country['visit_count'] / max(array_column($topCountries, 'visit_count'))) * 100) ?>%"></div>
                            </div>
                            <div class="chart-value"><?= number_format($country['visit_count']) ?></div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>

                <!-- Most Visited Pages -->
                <div class="stat-section">
                    <h3><i class="fas fa-file-alt"></i> Most Visited Pages</h3>
                    <div class="chart-container">
                        <?php foreach ($mostVisitedPages as $page): ?>
                        <div class="chart-item">
                            <div class="chart-label"><?= htmlspecialchars($page['page_url']) ?></div>
                            <div class="chart-bar">
                                <div class="chart-fill" style="width: <?= min(100, ($page['visit_count'] / max(array_column($mostVisitedPages, 'visit_count'))) * 100) ?>%"></div>
                            </div>
                            <div class="chart-value"><?= number_format($page['visit_count']) ?></div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>
            </div>

            <!-- Device Statistics -->
            <div class="stats-row">
                <div class="stat-section">
                    <h3><i class="fas fa-desktop"></i> Device Types</h3>
                    <div class="pie-chart">
                        <?php foreach ($deviceStats['device_types'] as $device): ?>
                        <div class="pie-item">
                            <span class="pie-label"><?= htmlspecialchars($device['device_type']) ?></span>
                            <span class="pie-value"><?= number_format($device['count']) ?></span>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>

                <div class="stat-section">
                    <h3><i class="fas fa-browser"></i> Top Browsers</h3>
                    <div class="pie-chart">
                        <?php foreach ($deviceStats['browsers'] as $browser): ?>
                        <div class="pie-item">
                            <span class="pie-label"><?= htmlspecialchars($browser['browser']) ?></span>
                            <span class="pie-value"><?= number_format($browser['count']) ?></span>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>

                <div class="stat-section">
                    <h3><i class="fas fa-laptop"></i> Operating Systems</h3>
                    <div class="pie-chart">
                        <?php foreach ($deviceStats['operating_systems'] as $os): ?>
                        <div class="pie-item">
                            <span class="pie-label"><?= htmlspecialchars($os['os']) ?></span>
                            <span class="pie-value"><?= number_format($os['count']) ?></span>
                        </div>
                        <?php endforeach; ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
.security-intelligence {
    padding: 2rem;
}

.section-header {
    text-align: center;
    margin-bottom: 3rem;
}

.section-header h2 {
    font-size: 2.5rem;
    color: var(--text-primary);
    margin-bottom: 1rem;
}

.section-header p {
    color: var(--text-secondary);
    font-size: 1.1rem;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.stat-card {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

.stat-icon {
    font-size: 2rem;
    color: var(--accent);
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(102, 126, 234, 0.1);
    border-radius: 10px;
}

.stat-number {
    font-size: 2rem;
    font-weight: bold;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

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

.activity-tabs {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    overflow: hidden;
}

.tab-buttons {
    display: flex;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid var(--border-light);
}

.tab-btn {
    background: none;
    border: none;
    color: var(--text-secondary);
    padding: 1rem 2rem;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
}

.tab-btn:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.05);
}

.tab-btn.active {
    color: var(--accent);
    background: var(--bg-card);
    border-bottom: 2px solid var(--accent);
}

.tab-content {
    display: none;
    padding: 2rem;
}

.tab-content.active {
    display: block;
}

.table-container {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.data-table th,
.data-table td {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border-light);
}

.data-table th {
    background: rgba(255, 255, 255, 0.05);
    font-weight: 600;
    color: var(--text-primary);
}

.data-table td {
    color: var(--text-secondary);
}

.event-badge {
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.event-login_success { background: rgba(72, 187, 120, 0.2); color: #48bb78; }
.event-login_failed { background: rgba(245, 101, 101, 0.2); color: #f56565; }
.event-registration_success { background: rgba(102, 126, 234, 0.2); color: #667eea; }
.event-registration_failed { background: rgba(237, 137, 54, 0.2); color: #ed8936; }
.event-suspicious_activity { background: rgba(245, 101, 101, 0.2); color: #f56565; }

.status-badge {
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-badge.success { background: rgba(72, 187, 120, 0.2); color: #48bb78; }
.status-badge.failed { background: rgba(245, 101, 101, 0.2); color: #f56565; }

.error-detail {
    color: #f56565;
    font-size: 0.8rem;
}

.text-muted {
    color: var(--text-secondary);
    font-style: italic;
}

.stats-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.stat-section {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    padding: 1.5rem;
}

.stat-section h3 {
    color: var(--text-primary);
    margin-bottom: 1rem;
    font-size: 1.2rem;
}

.chart-container {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.chart-item {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.chart-label {
    min-width: 120px;
    color: var(--text-secondary);
    font-size: 0.9rem;
}

.chart-bar {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
}

.chart-fill {
    height: 100%;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border-radius: 4px;
    transition: width 0.3s ease;
}

.chart-value {
    min-width: 60px;
    text-align: right;
    color: var(--text-primary);
    font-weight: 500;
}

.pie-chart {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

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

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

.pie-label {
    color: var(--text-secondary);
}

.pie-value {
    color: var(--text-primary);
    font-weight: 500;
}

@media (max-width: 768px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .tab-buttons {
        flex-wrap: wrap;
    }
    
    .tab-btn {
        flex: 1;
        min-width: 120px;
    }
    
    .data-table {
        font-size: 0.8rem;
    }
    
    .data-table th,
    .data-table td {
        padding: 0.5rem;
    }
}
</style>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Tab functionality
    const tabButtons = document.querySelectorAll('.tab-btn');
    const tabContents = document.querySelectorAll('.tab-content');
    
    tabButtons.forEach(button => {
        button.addEventListener('click', () => {
            const targetTab = button.getAttribute('data-tab');
            
            // Remove active class from all buttons and contents
            tabButtons.forEach(btn => btn.classList.remove('active'));
            tabContents.forEach(content => content.classList.remove('active'));
            
            // Add active class to clicked button and target content
            button.classList.add('active');
            document.getElementById(targetTab).classList.add('active');
        });
    });
    
    // Auto-refresh data every 30 seconds
    setInterval(() => {
        location.reload();
    }, 30000);
});
</script>