<?php
/**
 * VMPFence Firewall View
 *
 * @package VMPFence
 * @since 1.0.0
 * @since 2.0.0 -- Updated styling and layout and Basic Firewall Implementation
 * @since 2.1.0 -- Added dynamic calculation of WAF and feature percentages
 * @since 2.1.2 -- Rule_id column issue fix and firewall detailed summary table fixed to have responsive layout
 * @since 2.2.0 -- Added Top Countries Chart module
 * @since 2.2.2 -- Updated to reflect VMP Security branding, improved UI/UX design.
 */

// Prevent direct access
if (!defined('ABSPATH')) {
    exit;
}

// Detect which tab is active
$current_tab = isset($_GET['tab']) ? sanitize_text_field($_GET['tab']) : 'firewall';

// Enqueue firewall CSS
wp_enqueue_style('vmpfence-firewall', VMPFENCE_PLUGIN_URL . 'admin/assets/css/firewall.css', array(), VMPFENCE_VERSION);

// Enqueue toast notification system
wp_enqueue_style('vmpfence-toast-notifications', VMPFENCE_PLUGIN_URL . 'admin/assets/css/toast-notifications.css', array(), '1.0.3');
wp_enqueue_script('vmpfence-toast-notifications', VMPFENCE_PLUGIN_URL . 'admin/assets/js/toast-notifications.js', array('jquery'), '1.0.3', true);

// Enqueue Premium Upgrade Button Handler (required for "UPGRADE TO PREMIUM" buttons)
wp_enqueue_script('vmpfence-premium-upgrade', VMPFENCE_PLUGIN_URL . 'admin/assets/js/premium-upgrade.js', array('jquery'), VMPFENCE_VERSION, true);

// Enqueue Chart.js library (needed for Total Attacks Blocked graph)
wp_enqueue_script('chartjs', 'https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js', array(), '4.4.0', true);

// Enqueue firewall JS (depends on jQuery, Chart.js, and toast notifications)
wp_enqueue_script('vmpfence-firewall-js', VMPFENCE_PLUGIN_URL . 'admin/assets/js/firewall.js', array('jquery', 'chartjs', 'vmpfence-toast-notifications'), VMPFENCE_VERSION, true);
wp_localize_script('vmpfence-firewall-js', 'vmpfence_firewall', array(
    'nonce' => wp_create_nonce('vmpfence_firewall_nonce')
));

// Enqueue Top IPs Chart module (only on firewall tab, not blocking tab)
if ($current_tab !== 'blocking') {
    wp_enqueue_script('vmpfence-top-ips-chart', VMPFENCE_PLUGIN_URL . 'admin/assets/js/top-ips-chart.js', array('jquery'), VMPFENCE_VERSION, true);
    wp_localize_script('vmpfence-top-ips-chart', 'vmpfenceTopIPs', array(
        'ajaxurl' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('vmpfence_top_ips_nonce')
    ));
    
    // Enqueue Top Countries Chart module
    wp_enqueue_script('vmpfence-top-countries-chart', VMPFENCE_PLUGIN_URL . 'admin/assets/js/top-countries-chart.js', array('jquery'), VMPFENCE_VERSION, true);
    wp_localize_script('vmpfence-top-countries-chart', 'vmpfenceTopCountries', array(
        'ajaxurl' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('vmpfence_top_countries_nonce')
    ));
}
?>
<!-- WordPress Admin Notices Container (must be in .wrap for WordPress notices to display correctly) -->
<div class="wrap">
    <?php settings_errors(); ?>
</div>

<?php
// If blocking tab, include blocked IPs view and exit
if ($current_tab === 'blocking') {
    // Check for view parameter (for sub-pages like blocking-options)
    $current_view = isset($_GET['view']) ? sanitize_text_field($_GET['view']) : '';
    
    // If view=blocking-options, show blocking options page
    if ($current_view === 'blocking-options') {
        require_once VMPFENCE_PLUGIN_DIR . 'admin/views/blocking-options.php';
        return;
    }
    
    // Otherwise show default blocked IPs view
    // Add page title and tab navigation
    ?>
    <div style="max-width: 1300px;">
        <!-- Tab Navigation -->
        <div class="nav-tab-wrapper" style="max-width: 1300px;">
            <img src="<?php echo esc_url( VMPFENCE_PLUGIN_URL . 'admin/assets/images/VMP-logo.svg' ); ?>" alt="VMP Security" style="width: 36px; height: 36px; vertical-align: middle; margin-right: 2px; margin-left: 4px; display: inline-block; float: left; margin-top: 4px; padding-bottom: 7px;">
            <a href="?page=vmpfence-firewall&tab=firewall" 
               class="nav-tab <?php echo ($current_tab === 'firewall') ? 'nav-tab-active' : ''; ?>" style="padding: 8px 12px; border-radius: 6px 6px 0 0;<?php echo ($current_tab === 'firewall') ? ' color: #191970;' : ''; ?>">
                Firewall
            </a>
            <a href="?page=vmpfence-firewall&tab=blocking" 
               class="nav-tab <?php echo ($current_tab === 'blocking') ? 'nav-tab-active' : ''; ?>" style="padding: 8px 12px; border-radius: 6px 6px 0 0;<?php echo ($current_tab === 'blocking') ? ' color: #191970;' : ''; ?>">
                Blocking
            </a>
        </div>

        <h1 style="max-width: 1300px; padding: 15px 0;">Blocking</h1>
    <?php
    
    // Include blocked IPs content
    require_once VMPFENCE_PLUGIN_DIR . 'admin/views/blocked-ips.php';
    
    echo '</div>';
    return;
}

// Get current firewall status (for firewall tab)
$firewall_enabled = VMPFence_Config::get('waf_enabled');
$firewall_status_text = $firewall_enabled ? 'VMP Security Firewall Enabled' : 'VMP Security Firewall Deactivated';

// Get real-time IP blocklist status from config
$realtime_blocklist_enabled = VMPFence_Config::get('realtime_ip_blocklist_enabled', 0);
$realtime_blocklist_percentage = $realtime_blocklist_enabled ? 100 : 0;

// Set color based on percentage using dashboard color mechanism
if ($realtime_blocklist_percentage >= 80) {
    $realtime_blocklist_color = '#28a745'; // Green for excellent
} elseif ($realtime_blocklist_percentage >= 60) {
    $realtime_blocklist_color = '#17a2b8'; // Blue for good
} elseif ($realtime_blocklist_percentage >= 40) {
    $realtime_blocklist_color = '#ffc107'; // Yellow for fair
} else {
    $realtime_blocklist_color = '#dc3545'; // Red for poor/disabled
}

$realtime_blocklist_status = $realtime_blocklist_enabled ? 'Enabled' : 'Disabled';

// Get blocked IP count for display
$blocked_ip_stats = VMPFence_Blocked_IP::get_stats();
$api_ip_count = $blocked_ip_stats['api'] + $blocked_ip_stats['both'];
?>

<!-- Toast Notification Container -->
<?php require_once VMPFENCE_PLUGIN_DIR . 'admin/views/partials/toast-notification-container.php'; ?>

<div style="max-width: 1300px;">
    <!-- Tab Navigation -->
    <div class="nav-tab-wrapper" style="max-width: 1300px;">
        <img src="<?php echo esc_url( VMPFENCE_PLUGIN_URL . 'admin/assets/images/VMP-logo.svg' ); ?>" alt="VMP Security" style="width: 36px; height: 36px; vertical-align: middle; margin-right: 2px; margin-left: 4px; display: inline-block; float: left; margin-top: 4px; padding-bottom: 7px;">
        <a href="?page=vmpfence-firewall&tab=firewall" 
           class="nav-tab <?php echo ($current_tab === 'firewall') ? 'nav-tab-active' : ''; ?>" style="padding: 8px 12px; border-radius: 6px 6px 0 0;<?php echo ($current_tab === 'firewall') ? ' color: #191970;' : ''; ?>">
            Firewall
        </a>
        <a href="?page=vmpfence-firewall&tab=blocking" 
           class="nav-tab <?php echo ($current_tab === 'blocking') ? 'nav-tab-active' : ''; ?>" style="padding: 8px 12px; border-radius: 6px 6px 0 0;<?php echo ($current_tab === 'blocking') ? ' color: #191970;' : ''; ?>">
            Blocking
        </a>
    </div>

    <h1 style="max-width: 1300px; padding: 15px 0;"><?php echo esc_html(get_admin_page_title()); ?></h1>
</div>

<div class="vmpfence-firewall-wrapper">
    <!-- Firewall Header -->
    <div class="vmpfence-firewall-header-grid">
        <div class="vmpfence-firewall-header" id="vmpfence-firewall-status">
            <?php if ($firewall_enabled): ?>
            <div class="vmpfence-firewall-enabled">
                <svg width="120" height="120" viewBox="0 0 120 120">
                    <path d="M25 60 L50 85 L95 35" stroke="#191970" stroke-width="16" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
                </svg>
                <h2><?php echo esc_html($firewall_status_text); ?></h2>
            </div>
            <?php else: ?>
            <div class="vmpfence-firewall-disabled">
                <h2><?php echo esc_html($firewall_status_text); ?></h2>
                <p>The VMP Security Web Application Firewall is a PHP-based, application-level firewall that filters out malicious requests to your site. It is designed to run at the beginning of WordPress' initialization to filter out attacks before plugins or themes can run any potentially vulnerable code.</p>
                <p>
                    <button id="vmpfence-enable-firewall-btn" class="button button-primary">ENABLE FIREWALL</button>
                </p>
            </div>
            <?php endif; ?>
        </div>

        <?php
            // Check premium status using the proper method
            $license_type = VMPFence_License::get_license_type();
            $is_premium = ($license_type === VMPFence_Constants::LICENSE_PREMIUM);
            ?>
            <div class="vmpfence-progress-item" id="vmpfence-premium-progress">
                <?php if (!$is_premium): ?>
                    <div class="vmpfence-premium-disabled">
                        <h3>Premium Protection Disabled</h3>
                        <p>As a free VMP Security user, you are currently using the Community version of the Threat Defense Feed. Premium users are protected by real-time malware signatures. Upgrade to Premium today to improve your protection.</p>
                        <div class="vmpfence-premium-buttons">
                            <a href="#" class="vmpfence-premium-upgrade-btn">UPGRADE TO PREMIUM</a>
                            <a href="#" target="_self" class="vmpfence-premium-learn-btn">LEARN MORE</a>
                        </div>
                    </div>
                <?php else: ?>
                    <div class="vmpfence-premium-enabled">
                        <h2>Premium Protection Enabled</h2>
                        <p>Your site is protected by real-time malware signatures</p>
                    </div>
                    <div class="vmpfence-premium-buttons">
                            <!-- <a href="#" class="vmpfence-premium-upgrade-btn">UPGRADE TO PREMIUM</a>
                            <a href="#" target="_self" class="vmpfence-premium-learn-btn">LEARN MORE</a> -->
                    </div>
                <?php endif; ?>
            </div>
    </div>

    <!-- Status Grid -->
    <div class="vmpfence-firewall-status-grid">
        <div class="vmpfence-firewall-status-box" id="vmpfence-firewall-waf-status">
            <div class="circle-container" data-status-type="firewall_waf">
                <?php 
                // Calculate WAF percentage: Rules (25%) + Premium (10%) + Real-Time Blocklist (35%) + Optimize (20%) + Rate Limiting (10%)
                if ($firewall_enabled) {
                    // Get rule enablement percentage from database
                    global $wpdb;
                    $table_name = $wpdb->prefix . 'vmpfence_waf_rules';
                    $total_rules = (int) $wpdb->get_var("SELECT COUNT(*) FROM {$table_name}");
                    $disabled_rules = (int) $wpdb->get_var("SELECT COUNT(*) FROM {$table_name} WHERE enabled = 0");
                    
                    $rule_percentage = 1.0;
                    if ($total_rules > 0) {
                        $enabled_rules = $total_rules - $disabled_rules;
                        $rule_percentage = $enabled_rules / $total_rules;
                    }
                    
                    // Check other features
                    $license_type = VMPFence_License::get_license_type();
                    $is_premium = ($license_type === VMPFence_Constants::LICENSE_PREMIUM);
                    $blacklist_enabled = VMPFence_Config::get('realtime_ip_blocklist_enabled', 0);
                    $protection_level = VMPFence_Config::get('waf_protection_level', 'basic');
                    $optimized = ($protection_level === 'extended');
                    $rate_limiting = VMPFence_Config::get('rate_limiting_enabled', 0);
                    
                    // Calculate percentage
                    $waf_percentage_decimal = 0.0;
                    $waf_percentage_decimal += $rule_percentage * 0.25;  // 25% for rules
                    $waf_percentage_decimal += ($is_premium ? 1.0 : 0.0) * 0.10;  // 10% for premium
                    $waf_percentage_decimal += ($blacklist_enabled ? 1.0 : 0.0) * 0.35;  // 35% for blocklist
                    $waf_percentage_decimal += ($optimized ? 1.0 : 0.0) * 0.20;  // 20% for optimization
                    $waf_percentage_decimal += ($rate_limiting ? 1.0 : 0.0) * 0.10;  // 10% for rate limiting
                    
                    $waf_percentage = round($waf_percentage_decimal * 100);
                } else {
                    $waf_percentage = 0;
                }
                
                // Set color based on percentage
                if ($waf_percentage >= 80) {
                    $waf_color = '#28a745'; // Green
                } elseif ($waf_percentage >= 60) {
                    $waf_color = '#17a2b8'; // Blue
                } elseif ($waf_percentage >= 40) {
                    $waf_color = '#ffc107'; // Yellow
                } else {
                    $waf_color = '#dc3545'; // Red
                }
                ?>
                <svg class="vmpfence-circle-chart" viewbox="0 0 33.83098862 33.83098862" width="80" height="80">
                    <circle class="vmpfence-circle-bg" stroke="#e6e6e6" stroke-width="2" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <circle class="vmpfence-circle-progress-bar" stroke="<?php echo esc_attr($waf_color); ?>" stroke-width="2" stroke-dasharray="<?php echo esc_attr($waf_percentage); ?>,100" stroke-linecap="round" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <text x="16.91549431" y="20.91549431" text-anchor="middle" transform="rotate(90 16.91549431 16.91549431)" class="vmpfence-circle-text" style="font-size: 8px; fill: #666;"><?php echo esc_html($waf_percentage); ?>%</text>
                </svg>
            </div>
            <h3>Web Application Firewall</h3>
            <p>Stops Complex Attacks</p>
            <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options')); ?>" class="button button-secondary">Manage WAF</a>
        </div>

        <div class="vmpfence-firewall-status-box">
            <div class="circle-container" data-status-type="firewall_rules">
                <?php 
                // Check premium status
                $license_type = VMPFence_License::get_license_type();
                $is_premium = ($license_type === VMPFence_Constants::LICENSE_PREMIUM);
                
                // Free users: 70% if firewall enabled, Premium users: 100% if enabled
                if ($firewall_enabled) {
                    $rules_percentage = $is_premium ? 100 : 70;
                } else {
                    $rules_percentage = 0;
                }
                
                // Set color based on percentage
                if ($rules_percentage >= 80) {
                    $rules_color = '#28a745'; // Green
                } elseif ($rules_percentage >= 60) {
                    $rules_color = '#17a2b8'; // Blue
                } elseif ($rules_percentage >= 40) {
                    $rules_color = '#ffc107'; // Yellow
                } else {
                    $rules_color = '#dc3545'; // Red
                }
                
                $rules_title = $is_premium ? 'Firewall Rules: Premium' : 'Firewall Rules: Community';
                $rules_description = $is_premium ? 'Real-time rule updates' : 'Rule updates delayed by 30 days';
                ?>
                <svg class="vmpfence-circle-chart" viewbox="0 0 33.83098862 33.83098862" width="80" height="80">
                    <circle class="vmpfence-circle-bg" stroke="#e6e6e6" stroke-width="2" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <circle class="vmpfence-circle-progress-bar" stroke="<?php echo esc_attr($rules_color); ?>" stroke-width="2" stroke-dasharray="<?php echo esc_attr($rules_percentage); ?>,100" stroke-linecap="round" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <text x="16.91549431" y="20.91549431" text-anchor="middle" transform="rotate(90 16.91549431 16.91549431)" class="vmpfence-circle-text" style="font-size: 8px; fill: #666;"><?php echo esc_html($rules_percentage); ?>%</text>
                </svg>
            </div>
            <h3><?php echo esc_html($rules_title); ?></h3>
            <p><?php echo esc_html($rules_description); ?></p>
            <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options#waf-rules')); ?>" class="button button-secondary" style="margin-left: 10px;">Manage WAF Rules</a>
        </div>

        <div class="vmpfence-firewall-status-box">
            <div class="circle-container" data-status-type="realtime_blocklist">
                <svg class="vmpfence-circle-chart" viewbox="0 0 33.83098862 33.83098862" width="80" height="80">
                    <circle class="vmpfence-circle-bg" stroke="#e6e6e6" stroke-width="2" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <circle class="vmpfence-circle-progress-bar" stroke="<?php echo esc_attr($realtime_blocklist_color); ?>" stroke-width="2" stroke-dasharray="<?php echo esc_attr($realtime_blocklist_percentage); ?>,100" stroke-linecap="round" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <text x="16.91549431" y="20.91549431" text-anchor="middle" transform="rotate(90 16.91549431 16.91549431)" class="vmpfence-circle-text" style="font-size: 8px; fill: #666;"><?php echo esc_html($realtime_blocklist_percentage); ?>%</text>
                </svg>
            </div>
            <h3>Real-Time IP Blocklist: <?php echo esc_html($realtime_blocklist_status); ?></h3>
            <p>Blocks requests from known malicious IPs<?php if ($realtime_blocklist_enabled): ?> (<?php echo number_format($api_ip_count); ?> IPs synced)<?php endif; ?></p>
            <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options')); ?>" class="button button-secondary">Manage Real-Time IP Blocklist</a>
        </div>

        <div class="vmpfence-firewall-status-box" id="vmpfence-firewall-brute-force-status">
            <div class="circle-container" data-status-type="firewall_brute_force">
                <?php 
                // Calculate brute force percentage based on all features
                // Base (10%) + Network (50%) + Strong Passwords (10%) + Mask Errors (10%) + Block Admin (10%) + Disable Author (10%)
                $brute_force_enabled = VMPFence_Config::get('brute_force_enabled', 0);
                $network_protection = VMPFence_Config::get('participate_security_network', 0);
                $strong_passwords = VMPFence_Config::get('enforce_strong_passwords', 0);
                $mask_errors = VMPFence_Config::get('dont_reveal_users', 0);
                $block_admin = VMPFence_Config::get('prevent_admin_username', 0);
                $disable_author = VMPFence_Config::get('prevent_username_discovery', 0);
                
                $brute_force_percentage = 0;
                if ($brute_force_enabled) {
                    $brute_force_percentage += 10;
                    if ($network_protection) $brute_force_percentage += 50;
                    if ($strong_passwords) $brute_force_percentage += 10;
                    if ($mask_errors) $brute_force_percentage += 10;
                    if ($block_admin) $brute_force_percentage += 10;
                    if ($disable_author) $brute_force_percentage += 10;
                }
                
                // Set color based on percentage
                if ($brute_force_percentage >= 80) {
                    $brute_force_color = '#28a745'; // Green
                } elseif ($brute_force_percentage >= 60) {
                    $brute_force_color = '#17a2b8'; // Blue
                } elseif ($brute_force_percentage >= 40) {
                    $brute_force_color = '#ffc107'; // Yellow
                } else {
                    $brute_force_color = '#dc3545'; // Red
                }
                
                $brute_force_status = $brute_force_enabled ? 'Enabled' : 'Disabled';
                ?>
                <svg class="vmpfence-circle-chart" viewbox="0 0 33.83098862 33.83098862" width="80" height="80">
                    <circle class="vmpfence-circle-bg" stroke="#e6e6e6" stroke-width="2" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <circle class="vmpfence-circle-progress-bar" stroke="<?php echo esc_attr($brute_force_color); ?>" stroke-width="2" stroke-dasharray="<?php echo esc_attr($brute_force_percentage); ?>,100" stroke-linecap="round" fill="none" cx="16.91549431" cy="16.91549431" r="15.91549431"></circle>
                    <text x="16.91549431" y="20.91549431" text-anchor="middle" transform="rotate(90 16.91549431 16.91549431)" class="vmpfence-circle-text" style="font-size: 8px; fill: #666;"><?php echo esc_html($brute_force_percentage); ?>%</text>
                </svg>
            </div>
            <h3>Brute Force Protection: <?php echo esc_html($brute_force_status); ?></h3>
            <p>Stops Password Guessing Attacks</p>
            <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options#brute-force')); ?>" class="button button-secondary">Manage Brute Force Protection</a>
        </div>
    </div>

    <!-- Feature Boxes Grid -->
    <div class="vmpfence-firewall-features">
        <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options#rate-limiting')); ?>" style="text-decoration:none; color: inherit;">
            <div class="vmpfence-firewall-feature-box">
                <span class="icon">
                    <svg viewBox="0 0 189.2 180.26" width="36" height="36" style="display: block;">
                        <title>ratelimiting</title>
                        <path fill="none" d="M98.95,102.14a42.26,42.26,0,0,0,58.54,58.54c.89-.59,1.74-1.23,2.58-1.87L100.82,99.55C100.17,100.39,99.53,101.24,98.95,102.14Zm41.58,41.58a25.85,25.85,0,0,1-3.9,2.62.71.71,0,0,0-.05,1.22c5.3,3.53,2.28,9,.14,16a1.68,1.68,0,0,1-3.22-1l2.58-8.42c1-3.36-3.37-5.82-6.75-5-2.58.59-10.12,1.69-13.5.25a2,2,0,0,1-.64-3.31L129,132.2Zm-28.46-20.66a.71.71,0,0,0,1.22-.05,30.06,30.06,0,0,1,2.59-3.94l11.55,11.55-13.84,13.84c-1.69,1.69-4.56-.09-4.08-5.44a61.8,61.8,0,0,1,1-8.7c.79-3.45-1.77-7.75-5-6.75l-8.41,2.57a1.68,1.68,0,0,1-1-3.22l8.42-2.58A6.8,6.8,0,0,1,112.07,123.05Z"></path>
                        <path fill="none" d="M134.28,83a42,42,0,0,0-21.65,6c-.92.56-1.83,1.13-2.71,1.75l58.89,58.89c.62-.88,1.2-1.79,1.75-2.71a42.22,42.22,0,0,0-36.28-64Zm-7.52,20.16c-.21-3-.94-3.28-5.46-5.46L117.53,94a1.61,1.61,0,0,1,2.24-.74c10.07,5.09,10.06,4,10.51,13.48Zm14,14-8.32-8.31.07,0C142.49,108.55,143.08,114.42,140.76,117.19Zm1.71,1.71a4.61,4.61,0,0,1,7.36,2,23,23,0,0,1,1,6.33Zm23.19,23.19-3.85-3.85L160,134.76a3.37,3.37,0,0,0-2.84-1.84l-.76,0-3.54-3.55c9.06.43,8.15-.05,13.48,10.51A1.6,1.6,0,0,1,165.65,142.09Zm7.67-23.82a1.12,1.12,0,0,1-1.59,1.59l-3.09-3.09c-4.89-4.89-12.19-4.07-12.23-2.4-.09,3.59-1.6,5.83-3.85,8.08a19.76,19.76,0,0,0-15.39-15.39c2.22-2.22,4.44-3.76,8.09-3.85a1.07,1.07,0,0,0,1-.85A12.51,12.51,0,0,0,142.86,91l-3.09-3.09a1.12,1.12,0,0,1,1.59-1.59c3,3,8.93,7.7,7.12,16.51a.83.83,0,0,0,.56,1,10.52,10.52,0,0,1,6.82,6.82.83.83,0,0,0,1,.55C165.2,109.43,169.7,114.64,173.33,118.27Z"></path>
                        <path fill="#999" d="M7.65,9.23V85.81A9.06,9.06,0,0,0,16.71,95H81.15a96.75,96.75,0,0,1,9.12-12H21.9a2.41,2.41,0,0,1-2.26-2.61V14.64A2.44,2.44,0,0,1,21.9,12H128.33a2.49,2.49,0,0,1,2.32,2.64V64.29c1-.07,2.33-.18,3.5-.18a63.93,63.93,0,0,1,8.5.66V9.23A9.14,9.14,0,0,0,133.52,0H16.71A9.09,9.09,0,0,0,7.65,9.23Z"></path>
                        <path fill="#999" d="M4.75,124H73.13a59.11,59.11,0,0,1,3.93-20H10.35a4.65,4.65,0,0,0-4.2,2.42L.55,117a4.8,4.8,0,0,0,4.2,7Z"></path>
                        <path fill="#999" d="M156.81,111.15a.83.83,0,0,1-1-.55,10.52,10.52,0,0,0-6.82-6.82.83.83,0,0,1-.56-1c1.81-8.81-4.16-13.56-7.12-16.51a1.12,1.12,0,0,0-1.59,1.59L142.86,91a12.51,12.51,0,0,1,3.42,11.38,1.07,1.07,0,0,1-1,.85c-3.65.09-5.87,1.63-8.09,3.85a19.76,19.76,0,0,1,15.39,15.39c2.25-2.25,3.76-4.49,3.85-8.08,0-1.67,7.35-2.48,12.23,2.4l3.09,3.09a1.12,1.12,0,0,0,1.59-1.59C169.7,114.64,165.2,109.43,156.81,111.15Z"></path>
                        <path fill="#999" d="M152.91,129.34l3.54,3.55.76,0a3.37,3.37,0,0,1,2.84,1.84l1.76,3.48,3.85,3.85a1.6,1.6,0,0,0,.74-2.24C161.05,129.29,162,129.77,152.91,129.34Z"></path>
                        <path fill="#999" d="M115.81,149.35c3.37,1.44,10.91.34,13.5-.25,3.39-.78,7.78,1.68,6.75,5l-2.58,8.42a1.68,1.68,0,0,0,3.22,1c2.14-7,5.16-12.46-.14-16a.71.71,0,0,1,.05-1.22,25.85,25.85,0,0,0,3.9-2.62L129,132.2,115.17,146A2,2,0,0,0,115.81,149.35Z"></path>
                        <path fill="#999" d="M142.46,118.9l8.34,8.34a23,23,0,0,0-1-6.33A4.61,4.61,0,0,0,142.46,118.9Z"></path>
                        <path fill="#999" d="M119.77,93.23a1.61,1.61,0,0,0-2.24.74l3.78,3.77c4.52,2.18,5.25,2.5,5.46,5.46l3.51,3.51C129.83,97.27,129.85,98.32,119.77,93.23Z"></path>
                        <path fill="#999" d="M97.06,126.13l8.41-2.57c3.28-1,5.83,3.31,5,6.75a61.8,61.8,0,0,0-1,8.7c-.48,5.35,2.4,7.13,4.08,5.44l13.84-13.84-11.55-11.55a30.06,30.06,0,0,0-2.59,3.94.71.71,0,0,1-1.22.05,6.8,6.8,0,0,0-7.57-2.72l-8.42,2.58A1.68,1.68,0,0,0,97.06,126.13Z"></path>
                        <path fill="#999" d="M132.51,108.9l-.07,0,8.32,8.31C143.08,114.42,142.49,108.55,132.51,108.9Z"></path>
                        <path fill="#999" d="M134.28,70.42a54.92,54.92,0,1,0,54.92,54.92A55,55,0,0,0,134.28,70.42Zm23.21,90.25a42.26,42.26,0,0,1-58.54-58.54c.58-.89,1.22-1.74,1.87-2.59l59.25,59.25C159.23,159.45,158.38,160.09,157.49,160.68ZM170.56,147c-.55.92-1.13,1.83-1.75,2.71L109.92,90.81c.88-.62,1.79-1.19,2.71-1.75A42.22,42.22,0,0,1,170.56,147Z"></path>
                    </svg>
                </span>
                <div class="vmpfence-firewall-feature-box-content">
                    <h3>Rate Limiting</h3>
                    <p>Block crawlers that are using too many resources or stealing content</p>
                </div>
            </div>
        </a>

        <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&tab=blocking')); ?>" style="text-decoration:none; color: inherit;">
            <div class="vmpfence-firewall-feature-box">
                <span class="icon">
                    <svg viewBox="0 0 210.49 180" width="36" height="36" style="display: block;">
                        <title>Firewall</title>
                        <path fill="#999" d="M71.78,14.23c3.79-.59,7.61-1.09,11.42-1.53a2.09,2.09,0,0,1,1.57.67c2.51,3.17,6,4.72,9.73,5.82,3.11.92,3.55.49,4-2.78,4-.93,8-2.79,12.06-.25a37.89,37.89,0,0,1,6.15,5c.46.45.18,1.88,0,2.8-.29,1.24-1,2.37-1.3,3.6a3.24,3.24,0,0,0,3.4,4.22c.78,0,1.56-.18,2.35-.21,2.28-.11,3.09.76,2.88,3.06-.29,3.26.25,3.65,3.55,3.09a6.56,6.56,0,0,1,3,.61,6.4,6.4,0,0,1,1.53,1.14c3.06,2.32,5.4,1.45,6.3-2.35.1-.41.09-.85.17-1.28.36-1.7,1.32-2.15,2.47-.93,2.43,2.58,4.71,5.3,7.18,8.11-2.65,2.43-2.75,5.39-2.16,8.29.65,3.22-.2,6-1.47,8.87a64,64,0,0,0-3.37,8.27c-1.21,4.27.17,6.22,4.5,7.18a16.69,16.69,0,0,1,1.89.51l25-4A82.21,82.21,0,0,0,157.39,36c-14-19.15-32.75-30.63-56.15-34.71A82.86,82.86,0,0,0,87.08,0h-.94A87.3,87.3,0,0,0,72.91,1.25C27.92,8.15-4.61,50.53.54,95.86c2.45,21.63,11.52,40.09,27.6,54.79,19.08,17.45,41.74,25,67.42,22.57a13.49,13.49,0,0,1-2.86-6.09,15.67,15.67,0,0,1-.3-5.13,74.53,74.53,0,0,1-71.14-40.38c-15.12-29-7.76-61.86,7.61-79.94.41,3.25.82,6.17,1.15,9.11a74.29,74.29,0,0,1-1.41,23.78,11.67,11.67,0,0,0,.22,5.23,3.59,3.59,0,0,0,2.55,2.06c.74.06,2-1.1,2.32-2a22.32,22.32,0,0,0,.73-5c.12-1.19.12-2.4.2-4.27a34.87,34.87,0,0,1,2.85,2.33c1.89,1.89,3.79,3.78,5.52,5.82A5.64,5.64,0,0,1,44.52,82c-.05,2.33,1,3.92,2.23,5.75,1.38,2,2,4.6,2.9,7,.37,1,.45,2.1.9,3.05a5.47,5.47,0,0,0,4.86,3.58c2.61.17,3.58,1.17,4,3.84-.67.07-1.33.17-2,.23-3.18.29-4.75,1.75-4.63,5A22.81,22.81,0,0,0,60,126.7c1.3,1.21,2.68,2.35,3.95,3.6,2.89,2.85,3.89,6.2,2.5,10.13a31.88,31.88,0,0,0-1.87,5.65,16.13,16.13,0,0,0,.16,6c.48,2,.27,6.4,2.34,6,3.68-.65,5.78.07,6.06-4a3.29,3.29,0,0,0-.21-1.6c-1.09-3.86,3.86-14.79,6.82-16.79a73.67,73.67,0,0,0,7.39-5.45c3.32-2.89,4.81-6.61,3.41-10.95-1.31-4.07.22-7.08,3.08-9.7s4.82-5.77,4.62-9.88-2.89-7.1-6.41-6.68a25.73,25.73,0,0,0-5,1.6c-2.45.82-4.85,2-7.37,2.44-3.54.62-5.7-1.68-7.29-4.48-1.27-2.26-1.68-2.43-3.89-1-1.85,1.18-3.71,2.38-5.63,3.45s-3.08.7-4.62-1a15.29,15.29,0,0,0-3.35-2.39c-.85-.52-2-.65-2.65-1.3-.91-.88-2.16-2.18-2-3.13a4.57,4.57,0,0,1,2.57-3c1.93-.78,4.14-.91,6.21-1.36A21.79,21.79,0,0,0,62,82.07c1.43-.57,1.37-1.51.27-2.39a7.39,7.39,0,0,0-1.86-1c-3.17-1.28-6.36-2.5-9.53-3.78a13.71,13.71,0,0,1-2.27-1.16c-2-1.31-2.23-2.76-.42-4.34,7.13-6.3,15.47-8.13,22.85.22,2.28,2.59,3.84,5.82,6,8.54A33.26,33.26,0,0,0,82.9,84a4.31,4.31,0,0,0,3.89.25c1.48-.81,1.53-2.66.78-4.21a21.93,21.93,0,0,0-2.31-3.84c-4.2-5.4-3.9-15.93,4.31-20.33,2.75-1.47,5.53-3,6.84-7-1.57.43-2.72.71-3.84,1-6.23,1.93-1.89-2.73,1-3.53,1.74-.5-1.56-1.84-1.56-1.84s2.2-.74,4.56-1.73a19.41,19.41,0,0,0,4.62-2.57c.87-.71,1.2-2.07,1.77-3.15l-.43-.5c-1.65.21-3.3.47-4.95.65-2.8.32-3.45-.23-3.72-3.05a2.6,2.6,0,0,0-4-2c-1.24.68-2.32,1.65-3.51,2.42-2.76,1.8-4.82,1.08-5.91-2-.64-1.83-1.54-2.18-3.22-1.15-.85.52-1.56,1.27-2.42,1.75a28.85,28.85,0,0,1-4.37,2.13c-1.48.52-3.26.9-4.27-.72s-.14-3.44,1.23-4.54a39.08,39.08,0,0,1,5.56-3.49c2.72-1.53,5.6-2.8,8.22-4.47a4.82,4.82,0,0,0,2.15-5.6c-.53-2-1.86-2.68-3.71-1.76-1.52.76-2.86,1.94-4.43,2.56a7.42,7.42,0,0,1-3.8.22c-.45-.07-.94-1.33-1-2.07C70.39,15,71.24,14.31,71.78,14.23Z"></path>
                        <rect fill="#999" x="110.49" y="87" width="16" height="25"></rect>
                        <rect fill="#999" x="110.49" y="156" width="16" height="24"></rect>
                        <rect fill="#999" x="110.49" y="122" width="45" height="24"></rect>
                        <rect fill="#999" x="164.49" y="122" width="46" height="24"></rect>
                        <rect fill="#999" x="137.49" y="156" width="45" height="24"></rect>
                        <rect fill="#999" x="194.49" y="156" width="16" height="24"></rect>
                        <rect fill="#999" x="137.49" y="87" width="45" height="25"></rect>
                        <rect fill="#999" x="194.49" y="87" width="16" height="25"></rect>
                    </svg>
                </span>
                <div class="vmpfence-firewall-feature-box-content">
                    <h3>Blocking</h3>
                    <p>Block traffic by country, IP, IP range, user agent, referrer, or hostname</p>
                </div>
            </div>
        </a>

        <a style="text-decoration:none; color: inherit; cursor: not-allowed; opacity: 0.6;">
            <div class="vmpfence-firewall-feature-box" style="cursor: not-allowed;">
                <span class="icon">
                    <svg viewBox="0 0 409.6 409.6" width="36" height="36" style="display: block;">
                        <title>support</title>
                        <path d="M204.8,0C91.69,0,0,91.69,0,204.8S91.69,409.6,204.8,409.6s204.8-91.7,204.8-204.8S317.91,0,204.8,0ZM128,204.8a76.8,76.8,0,1,1,76.8,76.8A76.8,76.8,0,0,1,128,204.8Zm242.39,68.59-71-29.4a102.71,102.71,0,0,0,0-78.39l48.85-20.23,22.12-9.16a179.65,179.65,0,0,1,0,137.18Zm-97-234.18-29.39,71a102.65,102.65,0,0,0-78.39,0L151.82,76.9,136.21,39.21a179.7,179.7,0,0,1,137.18,0Zm-234.18,97L76.9,151.82l33.28,13.78a102.65,102.65,0,0,0,0,78.39l-71,29.4a179.7,179.7,0,0,1,0-137.18Zm97,234.18,9.16-22.12,20.23-48.85a102.68,102.68,0,0,0,78.39,0l29.39,71a179.65,179.65,0,0,1-137.18,0Zm0,0" fill="#999"></path>
                    </svg>
                </span>
                <div class="vmpfence-firewall-feature-box-content">
                    <h3>Help</h3>
                    <p>Learn about firewall features and troubleshooting. <b style="color: #191970;">Coming Soon</b></p>
                </div>
            </div>
        </a>
        
        <a href="<?php echo esc_url(admin_url('admin.php?page=vmpfence-firewall&view=options')); ?>" style="text-decoration:none; color: inherit;">
            <div class="vmpfence-firewall-feature-box" id="vmpfence-firewall-options-box">
                <span class="icon">
                    <svg viewBox="0 0 100.11 100.11" width="36" height="36" style="display: block;">
                        <title>options</title>
                        <path fill="#999" d="M99.59,41.42a2.06,2.06,0,0,0-1.37-.82L86.3,38.78a39.34,39.34,0,0,0-2.67-6.39q1.17-1.63,3.52-4.6t3.32-4.33A2.52,2.52,0,0,0,91,22a2.1,2.1,0,0,0-.46-1.43Q88.18,17.2,79.78,9.45a2.52,2.52,0,0,0-1.63-.65,2.12,2.12,0,0,0-1.57.59l-9.25,7a40.09,40.09,0,0,0-5.87-2.41L59.64,2a1.92,1.92,0,0,0-.75-1.4A2.46,2.46,0,0,0,57.29,0H42.82a2.19,2.19,0,0,0-2.34,1.82,106,106,0,0,0-1.89,12.12,37.62,37.62,0,0,0-5.93,2.48l-9-7A2.78,2.78,0,0,0,22,8.8q-1.44,0-6.16,4.66a64.88,64.88,0,0,0-6.42,7A2.75,2.75,0,0,0,8.8,22a2.44,2.44,0,0,0,.65,1.56q4.37,5.28,7,9a32.38,32.38,0,0,0-2.54,6L1.76,40.34a2,2,0,0,0-1.24.85A2.5,2.5,0,0,0,0,42.69V57.16a2.44,2.44,0,0,0,.52,1.53,2,2,0,0,0,1.37.82l11.93,1.76a31.91,31.91,0,0,0,2.67,6.45Q15.31,69.35,13,72.31T9.65,76.65a2.54,2.54,0,0,0-.07,3q2.54,3.52,10.75,11a2.25,2.25,0,0,0,1.63.71,2.35,2.35,0,0,0,1.63-.59l9.19-7a40.54,40.54,0,0,0,5.87,2.41l1.82,12a1.92,1.92,0,0,0,.75,1.4,2.45,2.45,0,0,0,1.6.55H57.29a2.2,2.2,0,0,0,2.35-1.82,107.41,107.41,0,0,0,1.89-12.12,37.19,37.19,0,0,0,5.93-2.48l9,7a3.18,3.18,0,0,0,1.69.59q1.43,0,6.13-4.62a65.86,65.86,0,0,0,6.45-7,2.16,2.16,0,0,0,.59-1.5,2.51,2.51,0,0,0-.65-1.63q-4.69-5.74-7-9a41.57,41.57,0,0,0,2.54-5.93l12.06-1.82a2,2,0,0,0,1.3-.85,2.52,2.52,0,0,0,.52-1.5V43a2.46,2.46,0,0,0-.52-1.53ZM61.85,61.86a16.08,16.08,0,0,1-11.8,4.89A16.69,16.69,0,0,1,33.37,50.06,16.69,16.69,0,0,1,50.06,33.37,16.69,16.69,0,0,1,66.74,50.06a16.08,16.08,0,0,1-4.89,11.8Zm0,0"></path>
                    </svg>
                </span>
                <div class="vmpfence-firewall-feature-box-content">
                    <h3>All Firewall Options</h3>
                    <p>Manage global and advanced firewall options</p>
                </div>
            </div>
        </a>
    </div>

    <!-- Analytics Grid: 2 columns x 3 rows -->
    <div class="vmpfence-analytics-grid">
        <!-- Row 1, Column 1: Top IPs Blocked -->
        <div class="vmpfence-analytics-card vmpfence-top-ips-card" data-chart="top-ips">
            <h3 style="margin: 0 0 20px 0; font-size: 16px; font-weight: 600; color: #333;">Top IPs Blocked</h3>
            <div class="vmpfence-filter-tabs">
                <button class="vmpfence-filter-tab active">24 Hours</button>
                <button class="vmpfence-filter-tab">7 Days</button>
                <button class="vmpfence-filter-tab">30 Days</button>
            </div>
            <div class="top-ips-content">
                <div style="text-align: center; padding: 40px 20px; color: #999; font-style: italic;">
                    No blocks have been recorded
                </div>
            </div>
        </div>

        <!-- Row 1, Column 2: Firewall Summary Table -->
        <div class="vmpfence-analytics-card">
            <h3 style="margin: 0 0 20px 0; font-size: 16px; font-weight: 600; color: #333;">
                Firewall Summary: 
                <span style="font-weight: 400; color: #666;">Attacks Blocked for <?php echo esc_html($_SERVER['SERVER_NAME'] . parse_url(home_url(), PHP_URL_PATH)); ?></span>
            </h3>
            
            <?php
            // Get attack data for the summary table
            global $wpdb;
            $waf_table = $wpdb->prefix . 'vmpfence_waf_log';
            $blocked_ips_table = $wpdb->prefix . 'vmpfence_blocked_ips';
            
            // Today's attacks by type
                $today_complex = (int) $wpdb->get_var("SELECT COUNT(*) FROM $waf_table WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(CURDATE()) AND actionDescription LIKE '%WAF block:%'");
                $today_brute = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(CURDATE()) AND reason LIKE '%brute force%' AND source = 'local'");
                $today_blocklist = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(CURDATE()) AND source = 'local'");
                $today_total = $today_complex + $today_brute + $today_blocklist;
                
                
                // Week's attacks by type
                $week_complex = (int) $wpdb->get_var("SELECT COUNT(*) FROM $waf_table WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 7 DAY)) AND actionDescription LIKE '%WAF block:%'");
                $week_brute = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 7 DAY)) AND reason LIKE '%brute force%' AND source = 'local'");
                $week_blocklist = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 7 DAY)) AND source = 'local'");
                $week_total = $week_complex + $week_brute + $week_blocklist;
                                
                // Month's attacks by type
                $month_complex = (int) $wpdb->get_var("SELECT COUNT(*) FROM $waf_table WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 30 DAY)) AND actionDescription LIKE '%WAF block:%'");
                $month_brute = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 30 DAY)) AND reason LIKE '%brute force%' AND source = 'local'");
                $month_blocklist = (int) $wpdb->get_var("SELECT COUNT(*) FROM $blocked_ips_table WHERE blocked_at >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 30 DAY)) AND source = 'local'");
                $month_total = $month_complex + $month_brute + $month_blocklist;
                           
            // Check if premium
            $is_premium = (VMPFence_License::get_license_type() === VMPFence_Constants::LICENSE_PREMIUM);
            ?>
            
            <table style="width: 100%; border-collapse: collapse; margin-top: 15px;">
                <thead>
                    <tr style="border-bottom: 1px solid #e0e0e0;">
                        <th style="padding: 12px 15px; text-align: left; font-weight: 600; color: #333; font-size: 14px;">Block Type</th>
                        <th style="padding: 12px 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;">Complex</th>
                        <th style="padding: 12px 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;">Brute Force</th>
                        <th style="padding: 12px 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;">Blocklist</th>
                        <th style="padding: 12px 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;">Total</th>
                    </tr>
                </thead>
                <tbody>
                    <tr style="border-bottom: 1px solid #f0f0f0;">
                        <td style="padding: 15px; font-weight: 600; color: #333; font-size: 14px;">Today</td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($today_complex); ?></td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($today_brute); ?></td>
                        <td style="padding: 15px; text-align: center;">
                            <?php if ($is_premium): ?>
                                <span style="color: #555; font-size: 14px;"><?php echo number_format($today_blocklist); ?></span>
                            <?php else: ?>
                                <div style="color: #999; font-size: 14px; margin-bottom: 8px;">—</div>
                            <?php endif; ?>
                        </td>
                        <td style="padding: 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;"><?php echo number_format($today_total); ?></td>
                    </tr>
                    <tr style="border-bottom: 1px solid #f0f0f0;">
                        <td style="padding: 15px; font-weight: 600; color: #333; font-size: 14px;">Week</td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($week_complex); ?></td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($week_brute); ?></td>
                        <td style="padding: 15px; text-align: center;">
                            <?php if ($is_premium): ?>
                                <span style="color: #555; font-size: 14px;"><?php echo number_format($week_blocklist); ?></span>
                            <?php else: ?>
                                <button style="background: #191970; color: white; border: none; padding: 8px 20px; border-radius: 4px; font-size: 13px; font-weight: 500; cursor: pointer;">Premium</button>
                            <?php endif; ?>
                        </td>
                        <td style="padding: 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;"><?php echo number_format($week_total); ?></td>
                    </tr>
                    <tr>
                        <td style="padding: 15px; font-weight: 600; color: #333; font-size: 14px;">Month</td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($month_complex); ?></td>
                        <td style="padding: 15px; text-align: center; color: #555; font-size: 14px;"><?php echo number_format($month_brute); ?></td>
                        <td style="padding: 15px; text-align: center;">
                            <?php if ($is_premium): ?>
                                <span style="color: #555; font-size: 14px;"><?php echo number_format($month_blocklist); ?></span>
                            <?php else: ?>
                                <div style="color: #999; font-size: 14px; margin-bottom: 8px;">—</div>
                            <?php endif; ?>
                        </td>
                        <td style="padding: 15px; text-align: center; font-weight: 600; color: #333; font-size: 14px;"><?php echo number_format($month_total); ?></td>
                    </tr>
                </tbody>
            </table>
            
            <!-- <div style="margin-top: 20px; text-align: right;">
                <a href="#" style="color: #0073aa; text-decoration: none; font-size: 13px; display: inline-flex; align-items: center; gap: 5px;">
                    <span style="display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #0073aa; font-size: 12px; font-weight: 600;">?</span>
                    How are these categorized?
                </a>
            </div> -->
        </div>

        <!-- Row 2, Column 1: Top Countries -->
        <div class="vmpfence-analytics-card vmpfence-top-countries-card">
            <h3 style="margin: 0 0 20px 0; font-size: 16px; font-weight: 600; color: #333;">Top Countries by Number of Attacks - Last 7 Days</h3>
            <div class="vmpfence-top-countries-content">
                <div style="text-align: center; padding: 40px 20px; color: #999; font-style: italic;">
                    No blocks have been recorded
                </div>
            </div>
        </div>

        <!-- Row 2, Column 2: Total Attacks Blocked Graph -->
        <div class="vmpfence-analytics-card">
            <h3>Total Attacks Blocked: <span>VMP Security Network</span></h3>
            <div class="vmpfence-chart-controls">
                <button class="vmpfence-chart-btn vmpfence-active" id="chart-24h">24 Hours</button>
                <button class="vmpfence-chart-btn" id="chart-30d">30 Days</button>
            </div>
            <div class="vmpfence-chart-container" style="position: relative; height: 300px; margin-top: 20px;">
                <canvas id="attacksChart"></canvas>
            </div>
            <div style="text-align: center; margin-top: 15px;">
                <span id="vmpfence-chart-timestamp" style="color: #d68a00; font-style: italic; font-size: 13px;">Loading...</span>
            </div>
        </div>

        <!-- Row 3, Column 1: Empty -->
        
        <div class="vmpfence-analytics-card" style="background: transparent; border: none; box-shadow: none;">
            <!-- Intentionally left empty -->
        </div>
        <!-- Row 3, Column 2: Login Attempts -->
        <?php
        // Get all login attempts for JavaScript from audit log and security attempts
        global $wpdb;
        $audit_table = $wpdb->prefix . 'vmpfence_audit_log';
        $security_table = $wpdb->prefix . 'vmpfence_security_attempts';
        
        $successful_logins = array();
        $failed_logins = array();
        
        // Get successful logins from audit log
        if ($wpdb->get_var("SHOW TABLES LIKE '$audit_table'") == $audit_table) {
            $successful_logins = $wpdb->get_results(
                "SELECT 
                    SUBSTRING_INDEX(SUBSTRING_INDEX(message, 'User ', -1), ' logged', 1) as username,
                    INET6_NTOA(source_ip) as ip_address, 
                    FROM_UNIXTIME(time) as attempted_at
                FROM $audit_table 
                WHERE event_type = 'login_success'
                  AND message LIKE 'User % logged in successfully'
                ORDER BY time DESC 
                LIMIT 10", 
                ARRAY_A
            );
        }
        
        // Get failed logins from security attempts
        if ($wpdb->get_var("SHOW TABLES LIKE '$security_table'") == $security_table) {
            $failed_logins = $wpdb->get_results(
                "SELECT 
                    username, 
                    ip_address, 
                    attempt_time as attempted_at
                FROM $security_table 
                WHERE event_type IN ('failed_login', 'invalid_username', 'blocked_username')
                ORDER BY attempt_time DESC 
                LIMIT 10", 
                ARRAY_A
            );
        }
        ?>
        <div class="vmpfence-analytics-card">
            <h3 style="margin: 0 0 20px 0; font-size: 16px; font-weight: 600; color: #333;">Login Attempts</h3>
            <div class="vmpfence-filter-tabs">
                <button class="vmpfence-filter-tab active" data-filter="successful">Successful</button>
                <button class="vmpfence-filter-tab" data-filter="failed">Failed</button>
            </div>
            <div style="margin-top: 20px;">
                <table style="width: 100%; border-collapse: collapse;">
                    <thead>
                        <tr style="border-bottom: 1px solid #e0e0e0;">
                            <th style="padding: 10px; text-align: left; font-weight: 600; color: #333; font-size: 13px;">Username</th>
                            <th style="padding: 10px; text-align: left; font-weight: 600; color: #333; font-size: 13px;">IP</th>
                            <th style="padding: 10px; text-align: left; font-weight: 600; color: #333; font-size: 13px;">Date</th>
                        </tr>
                    </thead>
                    <tbody id="login-attempts-tbody">
                        <?php
                        // Show successful logins by default
                        if (!empty($successful_logins)):
                            foreach ($successful_logins as $attempt):
                        ?>
                            <tr style="border-bottom: 1px solid #f0f0f0;">
                                <td style="padding: 12px 10px; font-size: 13px; color: #555;"><?php echo esc_html($attempt['username']); ?></td>
                                <td style="padding: 12px 10px; font-size: 13px; color: #555;"><?php echo esc_html($attempt['ip_address']); ?></td>
                                <td style="padding: 12px 10px; font-size: 13px; color: #555;"><?php echo esc_html($attempt['attempted_at']); ?></td>
                            </tr>
                        <?php
                            endforeach;
                        else:
                        ?>
                            <tr>
                                <td colspan="3" style="padding: 20px; text-align: center; color: #999; font-style: italic;">No login attempts recorded</td>
                            </tr>
                        <?php
                        endif;
                        ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Recent Blocked Attacks Table -->
    <div class="vmpfence-firewall-table-section">
        <?php
        
        // Get filter parameter
        $filter = isset($_GET['attack_filter']) ? sanitize_text_field($_GET['attack_filter']) : 'today';
        ?>
        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
            <h3 style="margin: 0;">Firewall Detailed  Summary: Attacks Blocked for <?php echo esc_html($_SERVER['SERVER_NAME'] . parse_url(home_url(), PHP_URL_PATH)); ?></h3>
            <div class="attack-filter-controls">
                <button class="attack-filter-btn <?php echo ($filter === 'today') ? 'active' : ''; ?>" data-filter="today">Today</button>
                <button class="attack-filter-btn <?php echo ($filter === '7days') ? 'active' : ''; ?>" data-filter="7days">Last 7 Days</button>
                <button class="attack-filter-btn <?php echo ($filter === '30days') ? 'active' : ''; ?>" data-filter="30days">Last 30 Days</button>
                <button class="attack-filter-btn <?php echo ($filter === 'all') ? 'active' : ''; ?>" data-filter="all">All Time</button>
            </div>
        </div>
        
        <div id="firewall-summary-content">
        <?php
        // Get attack counts for stats
        global $wpdb;
        $table_name = $wpdb->prefix . 'vmpfence_waf_log';
        
        $stats_today = $wpdb->get_var("SELECT COUNT(*) FROM $table_name WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(CURDATE())");
        $stats_7days = $wpdb->get_var("SELECT COUNT(*) FROM $table_name WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 7 DAY))");
        $stats_30days = $wpdb->get_var("SELECT COUNT(*) FROM $table_name WHERE action LIKE 'block%' AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 30 DAY))");
        $stats_all = $wpdb->get_var("SELECT COUNT(*) FROM $table_name WHERE action LIKE 'block%'");
        ?>
        <div style="background: #f8f9fa; padding: 15px; border-radius: 6px; margin-bottom: 20px;">
            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; text-align: center;">
                <div>
                    <div style="font-size: 28px; font-weight: 700; color: #191970; margin-bottom: 5px;"><?php echo number_format($stats_today); ?></div>
                    <div style="font-size: 13px; color: #666;">Blocked Today</div>
                </div>
                <div>
                    <div style="font-size: 28px; font-weight: 700; color: #191970; margin-bottom: 5px;"><?php echo number_format($stats_7days); ?></div>
                    <div style="font-size: 13px; color: #666;">Last 7 Days</div>
                </div>
                <div>
                    <div style="font-size: 28px; font-weight: 700; color: #191970; margin-bottom: 5px;"><?php echo number_format($stats_30days); ?></div>
                    <div style="font-size: 13px; color: #666;">Last 30 Days</div>
                </div>
                <div>
                    <div style="font-size: 28px; font-weight: 700; color: #191970; margin-bottom: 5px;"><?php echo number_format($stats_all); ?></div>
                    <div style="font-size: 13px; color: #666;">All Time</div>
                </div>
            </div>
        </div>
        
        <?php
        
        // Build time condition based on filter
        $time_condition = '';
        switch ($filter) {
            case 'today':
                $time_condition = 'AND attackLogTime >= UNIX_TIMESTAMP(CURDATE())';
                break;
            case '7days':
                $time_condition = 'AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 7 DAY))';
                break;
            case '30days':
                $time_condition = 'AND attackLogTime >= UNIX_TIMESTAMP(DATE_SUB(NOW(), INTERVAL 30 DAY))';
                break;
            default:
                $time_condition = '';
        }
        
        // Get recent blocked attacks from WAF log
        global $wpdb;
        $table_name = $wpdb->prefix . 'vmpfence_waf_log';
        $recent_attacks = $wpdb->get_results(
            "SELECT 
                id,
                DATE_FORMAT(FROM_UNIXTIME(attackLogTime), '%Y-%m-%d %H:%i:%s') as created_at,
                INET6_NTOA(IP) as ip_address,
                actionDescription as attack_description,
                actionData,
                logMsg,
                action,
                severity
            FROM $table_name 
            WHERE action LIKE 'block%' {$time_condition}
            GROUP BY id
            ORDER BY attackLogTime DESC 
            LIMIT 50",
            ARRAY_A
        );
        
        // Parse violations from actionData
        foreach ($recent_attacks as &$attack) {
            $data = json_decode($attack['actionData'], true);
            if (!empty($data['violated_rules']) && is_array($data['violated_rules'])) {
                $first_violation = reset($data['violated_rules']);
                $attack['attack_type'] = isset($first_violation['category']) ? $first_violation['category'] : 'Unknown';
                $attack['rule_id'] = isset($first_violation['rule_id']) ? $first_violation['rule_id'] : 'N/A';
            } else {
                $attack['attack_type'] = 'Unknown';
                $attack['rule_id'] = 'N/A';
            }
        }
        ?>
        <table class="wp-list-table widefat striped" style="table-layout: auto;">
            <thead>
                <tr>
                    <th style="width: 140px;">Date/Time</th>
                    <th style="width: 130px;">IP Address</th>
                    <th style="width: 120px;">Attack Type</th>
                    <!-- <th style="width: 10%;">Rule ID</th> -->
                    <th style="width: auto;">Description</th>
                    <th style="width: 90px;">Status</th>
                </tr>
            </thead>
            <tbody>
                <?php if (!empty($recent_attacks)): ?>
                    <?php foreach ($recent_attacks as $attack): ?>
                    <tr>
                        <td><?php echo esc_html($attack['created_at']); ?></td>
                        <td><?php echo esc_html($attack['ip_address'] ?: 'Unknown'); ?></td>
                        <td>
                            <span class="badge badge-<?php echo esc_attr(strtolower($attack['attack_type'])); ?>">
                                <?php echo esc_html($attack['attack_type']); ?>
                            </span>
                        </td>
                        <!-- <td><code><?php echo esc_html($attack['rule_id']); ?></code></td> -->
                        <td style="word-wrap: break-word; overflow-wrap: break-word; white-space: normal; max-width: 400px;"><?php echo esc_html($attack['logMsg']); ?></td>
                        <td><span class="vmpfence-status-blocked">Blocked</span></td>
                    </tr>
                    <?php endforeach; ?>
                <?php else: ?>
                    <tr>
                        <td colspan="6" style="text-align: center; padding: 20px;">
                            <em><?php _e('No blocked attacks recorded yet. The firewall is active and monitoring your site.', 'vmpfence-security'); ?></em>
                        </td>
                    </tr>
                <?php endif; ?>
            </tbody>
        </table>
        </div>
    </div>
</div>

<script>
jQuery(document).ready(function($) {
    // Store login data
    var loginData = {
        successful: <?php echo json_encode($successful_logins); ?>,
        failed: <?php echo json_encode($failed_logins); ?>
    };
    
    // Handle tab switching
    $('.vmpfence-filter-tab').on('click', function() {
        var filter = $(this).data('filter');
        
        // Update active state
        $('.vmpfence-filter-tab').removeClass('active');
        $(this).addClass('active');
        
        // Get the data for this filter
        var data = loginData[filter];
        var tbody = $('#login-attempts-tbody');
        
        // Clear current content
        tbody.empty();
        
        // Populate with new data
        if (data && data.length > 0) {
            $.each(data, function(index, attempt) {
                var row = $('<tr style="border-bottom: 1px solid #f0f0f0;"></tr>');
                row.append($('<td style="padding: 12px 10px; font-size: 13px; color: #555;"></td>').text(attempt.username));
                row.append($('<td style="padding: 12px 10px; font-size: 13px; color: #555;"></td>').text(attempt.ip_address));
                row.append($('<td style="padding: 12px 10px; font-size: 13px; color: #555;"></td>').text(attempt.attempted_at));
                tbody.append(row);
            });
        } else {
            tbody.append('<tr><td colspan="3" style="padding: 20px; text-align: center; color: #999; font-style: italic;">No login attempts recorded</td></tr>');
        }
    });
});
</script>

<?php
// Enqueue admin styles (includes firewall status styles)
wp_enqueue_style(
    'vmpfence-admin',
    plugin_dir_url(dirname(__FILE__)) . 'assets/css/admin.css',
    array(),
    VMPFENCE_VERSION
);
?>
