<?php
/**
 * Pro Preview / Teaser Renderer.
 *
 * This class remains in the Free (wp.org) build.
 * It provides the "marketing" UI (previews, blurs, descriptions) without
 * containing any of the functional Pro logic.
 *
 * @package Leadite\Admin
 */

namespace Leadite\Admin;

use Leadite\Pro;

defined( 'ABSPATH' ) || exit;

class ProPreview {

	/**
	 * Render a locked mockup of the Timeline & Notes card.
	 */
	public static function render_timeline_card() {
		?>
		<div class="leadite-card leadite-timeline-card">
			<h2><?php esc_html_e( 'Timeline & Notes', 'leadite' ); ?> <span class="leadite-badge leadite-badge--pro">Pro</span></h2>
			
			<?php self::render_pro_notice( __( 'Timeline & Team Notes', 'leadite' ), __( 'Keep track of every interaction. Add internal comments, see status changes, and record team activity in a chronological feed.', 'leadite' ) ); ?>

			<div class="leadite-note-form-wrapper leadite-field-locked" style="pointer-events:none; opacity:0.6;">
				<textarea class="leadite-note-textarea leadite-field-locked" placeholder="<?php esc_attr_e( 'Type an internal note/comment...', 'leadite' ); ?>" disabled="disabled"></textarea>
				<button type="button" class="button button-primary leadite-field-locked" disabled="disabled"><?php esc_html_e( 'Add Note', 'leadite' ); ?></button>
			</div>

			<div class="leadite-timeline" style="opacity:0.4; pointer-events:none; filter: blur(1px);">
				<div class="leadite-timeline-item leadite-timeline-item--note">
					<div class="leadite-timeline-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg></div>
					<div class="leadite-timeline-content">
						<div class="leadite-timeline-meta"><span class="leadite-timeline-author"><?php esc_html_e( 'Manager', 'leadite' ); ?></span> <span class="leadite-timeline-date"><?php echo esc_html( wp_date( 'j M H:i' ) ); ?></span></div>
						<div class="leadite-timeline-body"><?php esc_html_e( 'Spoke with the lead. Interested in the premium package.', 'leadite' ); ?></div>
					</div>
				</div>
				<div class="leadite-timeline-item leadite-timeline-item--log">
					<div class="leadite-timeline-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg></div>
					<div class="leadite-timeline-content">
						<div class="leadite-timeline-meta"><span class="leadite-timeline-author"><?php esc_html_e( 'System', 'leadite' ); ?></span> <span class="leadite-timeline-date"><?php echo esc_html( wp_date( 'j M H:i', time() - 3600 ) ); ?></span></div>
						<div class="leadite-timeline-body"><?php esc_html_e( 'Changed status to: In Progress', 'leadite' ); ?></div>
					</div>
				</div>
			</div>
		</div>
		<?php
	}

	/**
	 * Render a Pro notice banner.
	 *
	 * @param string $title Feature title.
	 * @param string $desc  Feature description.
	 */
	public static function render_pro_notice( $title, $desc ) {
		?>
		<div class="leadite-pro-tab-notice" style="margin-top:16px; margin-bottom:16px;">
			<span class="leadite-pro-tab-notice__icon"><svg class="leadite-pro-notice-icon" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></span>
			<div class="leadite-pro-tab-notice__body">
				<strong><?php echo esc_html( $title ); ?></strong> — 
				<?php echo esc_html( $desc ); ?>
				<a href="<?php echo esc_url( \leadite_get_upgrade_url() ); ?>" target="_blank" rel="noopener noreferrer"><strong><?php esc_html_e( 'Get Pro →', 'leadite' ); ?></strong></a>
			</div>
		</div>
		<?php
	}

	/**
	 * Render a sidebar teaser for Pro features.
	 */
	public static function render_sidebar_teaser() {
		if ( ! Pro::is_showing_teaser() ) {
			return;
		}
		$pro_url = admin_url( 'admin.php?page=leadite-settings&tab=pro' );
		?>
		<div class="leadite-pro-sidebar-notice">
			<svg class="leadite-icon leadite-icon--pro-star" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" stroke="none" aria-hidden="true"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
			<?php esc_html_e( 'Pro: starred leads, assignments, notes & timeline, tags.', 'leadite' ); ?>
			<a href="<?php echo esc_url( $pro_url ); ?>"><?php esc_html_e( 'Learn more →', 'leadite' ); ?></a>
		</div>
		<?php
	}

	/**
	 * Render a mockup of the Follow-Up Guard sidebar block.
	 */
	public static function render_followup_teaser() {
		?>
		<div class="leadite-card leadite-card--fug leadite-card--locked" style="opacity:0.7; filter: grayscale(0.5);">
			<h2><?php esc_html_e( 'Follow-Up Guard', 'leadite' ); ?> <span class="leadite-badge leadite-badge--pro">Pro</span></h2>
			<div class="leadite-fug-score-teaser" style="display:flex; align-items:center; gap:12px; margin:15px 0;">
				<div class="leadite-fug-badge leadite-fug-badge--hot" style="width:40px; height:40px; font-size:18px;">🔥</div>
				<div>
					<strong><?php esc_html_e( 'Lead Scoring', 'leadite' ); ?></strong>
					<p class="description" style="margin:0;"><?php esc_html_e( 'Identify high-intent leads automatically.', 'leadite' ); ?></p>
				</div>
			</div>
			<p class="description"><?php esc_html_e( 'SLA monitoring, returning lead detection, and daily email digests are available in Leadite Pro.', 'leadite' ); ?></p>
			<a href="<?php echo esc_url( \leadite_get_upgrade_url() ); ?>" target="_blank" class="button button-secondary" style="width:100%; text-align:center; margin-top:10px;"><?php esc_html_e( 'Upgrade to Unlock', 'leadite' ); ?></a>
		</div>
		<?php
	}
}