<?php
// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals
// phpcs:disable WordPress.Security.NonceVerification
// phpcs:disable WordPress.Security.ValidatedSanitizedInput
// phpcs:disable WordPress.WP.EnqueuedResourceParameters
// phpcs:disable WordPress.DB.PreparedSQL
// phpcs:disable WordPress.DB.PreparedSQLPlaceholders
// phpcs:disable WordPress.DB.DirectDatabaseQuery
// phpcs:disable WordPress.DB.SlowDBQuery
// phpcs:disable PluginCheck.Security.DirectDB
// phpcs:disable PluginCheck.CodeAnalysis
// phpcs:disable WordPressVIPMinimum

/**
 * Analytics Dashboard UI
 * Self-contained UI for analytics display
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

// $analytics variable is passed from render_dashboard()
?>

<div class="gt-bogo-analytics-dashboard" style="margin: 20px 0;">
	
	<!-- License Status Banner -->
	<div style="background: #070C1C; padding: 20px; border-radius: 8px; margin-bottom: 20px;">
		<div style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px;">
			<div>
				<h3 style="color: #fff; margin: 0 0 5px 0;">License Status</h3>
				<?php if ( $has_pro ) : ?>
					<span style="color: #4CAF50; font-size: 14px;">✓ PRO Features Active</span>
				<?php else : ?>
					<span style="color: #F44336; font-size: 14px;">✗ PRO Features Locked</span>
				<?php endif; ?>
			</div>
			<div>
				<?php if ( ! $has_pro ) : ?>
					<a href="<?php echo esc_url( admin_url( 'admin.php?page=gt-bogo-settings#license' ) ); ?>" 
						class="button button-primary" 
						style="background: #E10000; border-color: #E10000;">
						Activate License
					</a>
				<?php else : ?>
					<?php
					$status = $license_manager->get_status_details();
					if ( isset( $status['expires_human'] ) ) :
						?>
						<span style="color: #ccc;">Expires: <?php echo esc_html( $status['expires_human'] ); ?></span>
					<?php endif; ?>
				<?php endif; ?>
			</div>
		</div>
	</div>
	
	<!-- Analytics Cards -->
	<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-bottom: 20px;">
		
		<!-- Total Customers -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				Total Customers
			</div>
			<div style="color: #fff; font-size: 32px; font-weight: bold;">
				<?php echo number_format( $analytics['total_customers'] ); ?>
			</div>
		</div>
		
		<!-- Total Revenue -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				Total Revenue
			</div>
			<div style="color: #4CAF50; font-size: 32px; font-weight: bold;">
				$<?php echo number_format( $analytics['total_revenue'], 2 ); ?>
			</div>
		</div>
		
		<!-- Active Licenses -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				Active Licenses
			</div>
			<div style="color: #fff; font-size: 32px; font-weight: bold;">
				<?php echo number_format( $analytics['active_licenses'] ); ?>
			</div>
			<div style="color: #888; font-size: 12px; margin-top: 5px;">
				of <?php echo number_format( $analytics['total_licenses'] ); ?> total
			</div>
		</div>
		
		<!-- PRO Packs Sold -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				PRO Packs Sold
			</div>
			<div style="color: #fff; font-size: 32px; font-weight: bold;">
				<?php echo number_format( $analytics['total_packs'] ); ?>
			</div>
		</div>
		
	</div>
	
	<!-- Secondary Metrics -->
	<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px;">
		
		<!-- Avg Customer Value -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				Avg Customer Value
			</div>
			<div style="color: #fff; font-size: 24px; font-weight: bold;">
				$<?php echo number_format( $analytics['avg_customer_value'], 2 ); ?>
			</div>
		</div>
		
		<!-- Avg Order Value -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				Avg Order Value
			</div>
			<div style="color: #fff; font-size: 24px; font-weight: bold;">
				$<?php echo number_format( $analytics['avg_order_value'], 2 ); ?>
			</div>
		</div>
		
		<!-- License Active Rate -->
		<div style="background: #070C1C; padding: 20px; border-radius: 8px;">
			<div style="color: #888; font-size: 12px; text-transform: uppercase; margin-bottom: 10px;">
				License Active Rate
			</div>
			<div style="color: #fff; font-size: 24px; font-weight: bold;">
				<?php echo number_format( $analytics['license_renewal_rate'], 1 ); ?>%
			</div>
		</div>
		
	</div>
	
	<?php if ( ! $has_pro ) : ?>
	<div style="background: #070C1C; padding: 30px; border-radius: 8px; margin-top: 20px; text-align: center;">
		<h3 style="color: #fff; margin: 0 0 10px 0;">Unlock Full Analytics</h3>
		<p style="color: #ccc; margin: 0 0 20px 0;">
			Get detailed customer insights, revenue tracking, and advanced analytics with PRO
		</p>
		<a href="<?php echo esc_url( admin_url( 'admin.php?page=gt-bogo-settings#license' ) ); ?>" 
			class="button button-primary" 
			style="background: #E10000; border-color: #E10000; padding: 10px 30px; height: auto;">
			Activate PRO License
		</a>
	</div>
	<?php endif; ?>
	
</div>
