<?php
/**
 * Forumax Analytics Locked Template
 *
 * @package Forumax
 * @since   2.3.0
 */

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

$upgrade_url = function_exists( 'bc_fs' )
	? bc_fs()->get_upgrade_url()
	: admin_url( 'admin.php?page=forumax-pricing' );
?>

<div class="wrap frmx-analytics-page">
	<div class="frmx-analytics-shell">
		<section class="frmx-analytics-topbar">
			<div class="frmx-analytics-topbar__main">
				<div class="frmx-analytics-topbar__logo">
					<img src="<?php echo esc_url( FORUMAX_IMG . 'logo.svg' ); ?>" alt="<?php esc_attr_e( 'Forumax Logo', 'forumax' ); ?>">
				</div>
				<div class="frmx-analytics-topbar__copy">
					<div class="frmx-analytics-kicker"><?php esc_html_e( 'Promax Feature', 'forumax' ); ?></div>
					<h1>
						<?php esc_html_e( 'Analytics', 'forumax' ); ?>
						<span class="frmx-analytics-plan"><?php esc_html_e( 'Promax', 'forumax' ); ?></span>
					</h1>
					<p><?php esc_html_e( 'A focused analytics workspace for understanding forum activity, contributors, and support quality.', 'forumax' ); ?></p>
				</div>
			</div>
			<div class="frmx-analytics-topbar__actions">
				<a href="<?php echo esc_url( $upgrade_url ); ?>" class="frmx-analytics-btn frmx-analytics-btn--accent">
					<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
					<?php esc_html_e( 'Upgrade to Promax', 'forumax' ); ?>
				</a>
			</div>
		</section>

		<section class="frmx-analytics-hero">
			<div class="frmx-analytics-hero__copy">
				<div class="frmx-analytics-hero__eyebrow">
					<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
					<?php esc_html_e( 'Forum Analytics Overview', 'forumax' ); ?>
				</div>
				<h2><?php esc_html_e( 'Understand how your forum is performing', 'forumax' ); ?></h2>
				<p><?php esc_html_e( 'See topic growth, reply activity, contributor participation, and support resolution in one focused analytics workspace built for communities.', 'forumax' ); ?></p>
				<div class="frmx-analytics-summary">
					<div class="frmx-analytics-summary__item">
						<div class="frmx-analytics-summary__icon frmx-analytics-summary__icon--blue">
							<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
						</div>
						<div>
							<strong><?php esc_html_e( 'Activity trends', 'forumax' ); ?></strong>
							<p><?php esc_html_e( 'Follow topic and reply volume over time.', 'forumax' ); ?></p>
						</div>
					</div>
					<div class="frmx-analytics-summary__item">
						<div class="frmx-analytics-summary__icon frmx-analytics-summary__icon--purple">
							<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
						</div>
						<div>
							<strong><?php esc_html_e( 'Top contributors', 'forumax' ); ?></strong>
							<p><?php esc_html_e( 'Identify the members driving discussion quality.', 'forumax' ); ?></p>
						</div>
					</div>
					<div class="frmx-analytics-summary__item">
						<div class="frmx-analytics-summary__icon frmx-analytics-summary__icon--green">
							<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
						</div>
						<div>
							<strong><?php esc_html_e( 'Resolution tracking', 'forumax' ); ?></strong>
							<p><?php esc_html_e( 'Measure solved topics and unanswered support gaps.', 'forumax' ); ?></p>
						</div>
					</div>
				</div>
				<div class="frmx-analytics-hero__actions">
					<a href="<?php echo esc_url( $upgrade_url ); ?>" class="frmx-analytics-btn frmx-analytics-btn--accent">
						<?php esc_html_e( 'Unlock Analytics', 'forumax' ); ?>
					</a>
					<a href="<?php echo esc_url( $upgrade_url ); ?>" class="frmx-analytics-btn frmx-analytics-btn--secondary">
						<?php esc_html_e( 'Compare Plans', 'forumax' ); ?>
					</a>
				</div>
			</div>

			<div class="frmx-analytics-preview" aria-hidden="true">
				<div class="frmx-analytics-preview__window">
					<div class="frmx-analytics-preview__top">
						<div class="frmx-analytics-preview__dots">
							<span></span>
							<span></span>
							<span></span>
						</div>
						<div class="frmx-analytics-preview__label"><?php esc_html_e( 'Last 30 days', 'forumax' ); ?></div>
					</div>
					<div class="frmx-analytics-preview__stats">
						<div class="frmx-analytics-preview__stat">
							<label><?php esc_html_e( 'Topics', 'forumax' ); ?></label>
							<strong>1.2K</strong>
							<div class="frmx-analytics-preview__sparkline">
								<svg viewBox="0 0 80 24" preserveAspectRatio="none">
									<polyline points="0,20 10,16 20,18 30,12 40,14 50,8 60,10 70,4 80,6" fill="none" stroke="#10b981" stroke-width="2"/>
								</svg>
							</div>
							<small class="frmx-analytics-badge frmx-analytics-badge--green">+18%</small>
						</div>
						<div class="frmx-analytics-preview__stat">
							<label><?php esc_html_e( 'Resolution', 'forumax' ); ?></label>
							<strong>84%</strong>
							<div class="frmx-analytics-preview__sparkline">
								<svg viewBox="0 0 80 24" preserveAspectRatio="none">
									<polyline points="0,18 10,14 20,16 30,10 40,12 50,8 60,6 70,8 80,4" fill="none" stroke="#8b5cf6" stroke-width="2"/>
								</svg>
							</div>
							<small class="frmx-analytics-badge frmx-analytics-badge--purple">+6%</small>
						</div>
						<div class="frmx-analytics-preview__stat">
							<label><?php esc_html_e( 'Active users', 'forumax' ); ?></label>
							<strong>326</strong>
							<div class="frmx-analytics-preview__sparkline">
								<svg viewBox="0 0 80 24" preserveAspectRatio="none">
									<polyline points="0,12 10,10 20,14 30,12 40,10 50,12 60,10 70,12 80,10" fill="none" stroke="#f59e0b" stroke-width="2"/>
								</svg>
							</div>
							<small class="frmx-analytics-badge frmx-analytics-badge--amber"><?php esc_html_e( 'Stable', 'forumax' ); ?></small>
						</div>
					</div>
					<div class="frmx-analytics-preview__chart">
						<div class="frmx-analytics-preview__chart-bars">
							<span class="frmx-bar frmx-bar-1"></span>
							<span class="frmx-bar frmx-bar-2"></span>
							<span class="frmx-bar frmx-bar-3"></span>
							<span class="frmx-bar frmx-bar-4"></span>
							<span class="frmx-bar frmx-bar-5"></span>
							<span class="frmx-bar frmx-bar-6"></span>
							<span class="frmx-bar frmx-bar-7"></span>
						</div>
						<div class="frmx-analytics-preview__lock">
							<div class="frmx-analytics-preview__lock-icon">
								<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>
							</div>
							<span><?php esc_html_e( 'Available in Promax', 'forumax' ); ?></span>
						</div>
					</div>
				</div>
			</div>
		</section>

		<section class="frmx-analytics-section">
			<div class="frmx-analytics-section__header">
				<div class="frmx-analytics-icon">
					<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.21 15.89A10 10 0 1 1 8 2.83"/><path d="M22 12A10 10 0 0 0 12 2v10z"/></svg>
				</div>
				<h2><?php esc_html_e( 'What you can measure', 'forumax' ); ?></h2>
				<p><?php esc_html_e( 'Forumax Analytics helps forum owners understand growth, content quality, member behavior, and support outcomes.', 'forumax' ); ?></p>
			</div>

			<div class="frmx-analytics-stats">
				<div class="frmx-analytics-stat">
					<div class="frmx-analytics-stat__icon frmx-analytics-stat__icon--indigo">
						<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
					</div>
					<strong><?php esc_html_e( 'Forums', 'forumax' ); ?></strong>
					<span><?php esc_html_e( 'See which forums drive the most activity', 'forumax' ); ?></span>
				</div>
				<div class="frmx-analytics-stat">
					<div class="frmx-analytics-stat__icon frmx-analytics-stat__icon--violet">
						<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/><polyline points="10 9 9 9 8 9"/></svg>
					</div>
					<strong><?php esc_html_e( 'Topics', 'forumax' ); ?></strong>
					<span><?php esc_html_e( 'Track topic creation trends over time', 'forumax' ); ?></span>
				</div>
				<div class="frmx-analytics-stat">
					<div class="frmx-analytics-stat__icon frmx-analytics-stat__icon--teal">
						<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
					</div>
					<strong><?php esc_html_e( 'Replies', 'forumax' ); ?></strong>
					<span><?php esc_html_e( 'Measure discussion depth and response activity', 'forumax' ); ?></span>
				</div>
				<div class="frmx-analytics-stat">
					<div class="frmx-analytics-stat__icon frmx-analytics-stat__icon--amber">
						<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
					</div>
					<strong><?php esc_html_e( 'Members', 'forumax' ); ?></strong>
					<span><?php esc_html_e( 'Identify your most engaged contributors', 'forumax' ); ?></span>
				</div>
			</div>
		</section>

		<section class="frmx-analytics-section frmx-analytics-section--soft">
			<div class="frmx-analytics-section__header">
				<div class="frmx-analytics-icon frmx-analytics-icon--blue">
					<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>
				</div>
				<h2><?php esc_html_e( 'Forum-focused reporting', 'forumax' ); ?></h2>
				<p><?php esc_html_e( 'Designed for communities, support forums, and discussion boards, not generic product dashboards.', 'forumax' ); ?></p>
			</div>

			<div class="frmx-analytics-grid">
				<article class="frmx-analytics-card">
					<div class="frmx-analytics-card__icon frmx-analytics-card__icon--indigo">
						<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/></svg>
					</div>
					<h3><?php esc_html_e( 'Topic Activity Overview', 'forumax' ); ?></h3>
					<p><?php esc_html_e( 'Monitor topic publishing trends, seasonal spikes, and the forums creating the most conversation.', 'forumax' ); ?></p>
				</article>
				<article class="frmx-analytics-card">
					<div class="frmx-analytics-card__icon frmx-analytics-card__icon--violet">
						<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
					</div>
					<h3><?php esc_html_e( 'Reply & Engagement Trends', 'forumax' ); ?></h3>
					<p><?php esc_html_e( 'See how actively members are responding and where conversations gain or lose momentum.', 'forumax' ); ?></p>
				</article>
				<article class="frmx-analytics-card">
					<div class="frmx-analytics-card__icon frmx-analytics-card__icon--teal">
						<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
					</div>
					<h3><?php esc_html_e( 'Solved vs Unanswered', 'forumax' ); ?></h3>
					<p><?php esc_html_e( 'Evaluate support quality by tracking answered threads, unresolved discussions, and resolution patterns.', 'forumax' ); ?></p>
				</article>
				<article class="frmx-analytics-card">
					<div class="frmx-analytics-card__icon frmx-analytics-card__icon--amber">
						<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>
					</div>
					<h3><?php esc_html_e( 'Top Contributors', 'forumax' ); ?></h3>
					<p><?php esc_html_e( 'Recognize the members driving replies, helpful answers, and ongoing participation in your forum.', 'forumax' ); ?></p>
				</article>
			</div>
		</section>

		<section class="frmx-analytics-footer">
			<div class="frmx-analytics-footer__glow" aria-hidden="true"></div>
			<div class="frmx-analytics-footer__content">
				<div class="frmx-analytics-kicker frmx-analytics-kicker--dark"><?php esc_html_e( 'Pro Analytics', 'forumax' ); ?></div>
				<h2><?php esc_html_e( 'Unlock full Forumax analytics', 'forumax' ); ?></h2>
				<p><?php esc_html_e( 'Upgrade to Pro to access the complete analytics dashboard and understand how your forum grows, engages members, and supports users.', 'forumax' ); ?></p>
			</div>
			<a href="<?php echo esc_url( $upgrade_url ); ?>" class="frmx-analytics-btn frmx-analytics-btn--primary">
				<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
				<?php esc_html_e( 'Get Forumax Pro', 'forumax' ); ?>
			</a>
		</section>
	</div>
</div>
