<?php
/**
 * Help & documentation view (Alpine.js powered tabs).
 *
 * @package SuiteMkt3k
 */
defined( 'ABSPATH' ) || exit;
// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound

$svg = function ( string $paths ): string {
	return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' . $paths . '</svg>';
};

$tabs = array(
	'welcome'     => array(
		'icon'  => $svg( '<path d="M3 11l9-8 9 8"/><path d="M5 10v10h14V10"/>' ),
		'label' => __( 'Welcome', 'suitemkt3k' ),
	),
	'coupons'     => array(
		'icon'  => $svg( '<path d="M3 8a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v2a2 2 0 0 0 0 4v2a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-2a2 2 0 0 0 0-4z"/>' ),
		'label' => __( 'Coupons', 'suitemkt3k' ),
	),
	'newsletter'  => array(
		'icon'  => $svg( '<rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 7l9 6 9-6"/>' ),
		'label' => __( 'Newsletter & forms', 'suitemkt3k' ),
	),
	'cart'        => array(
		'icon'  => $svg( '<circle cx="9" cy="20" r="1"/><circle cx="18" cy="20" r="1"/><path d="M3 3h2l3 12h11l2-8H6"/>' ),
		'label' => __( 'Cart recovery', 'suitemkt3k' ),
	),
	'subscribers' => array(
		'icon'  => $svg( '<circle cx="9" cy="8" r="4"/><path d="M2 21a7 7 0 0 1 14 0"/><circle cx="17" cy="7" r="3"/><path d="M22 21a5 5 0 0 0-6-4.9"/>' ),
		'label' => __( 'Subscribers', 'suitemkt3k' ),
	),
	'stats'       => array(
		'icon'  => $svg( '<path d="M3 3v18h18"/><path d="M7 15l4-4 3 3 5-7"/>' ),
		'label' => __( 'Statistics & dashboard', 'suitemkt3k' ),
	),
	'settings'    => array(
		'icon'  => $svg( '<circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3h.1a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8v.1a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/>' ),
		'label' => __( 'Settings & SMTP', 'suitemkt3k' ),
	),
	'backup'      => array(
		'icon'  => $svg( '<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/>' ),
		'label' => __( 'Backup & restore', 'suitemkt3k' ),
	),
	'security'    => array(
		'icon'  => $svg( '<rect x="5" y="11" width="14" height="10" rx="2"/><path d="M8 11V8a4 4 0 1 1 8 0v3"/>' ),
		'label' => __( 'Security & privacy', 'suitemkt3k' ),
	),
	'shortcuts'   => array(
		'icon'  => $svg( '<polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>' ),
		'label' => __( 'Shortcuts & tips', 'suitemkt3k' ),
	),
);
?>
<div class="wmk-help-layout" x-data="{ tab: 'welcome' }">
	<aside class="wmk-card wmk-help-side">
		<h3><?php esc_html_e( 'Documentation', 'suitemkt3k' ); ?></h3>
		<p class="wmk-help"><?php esc_html_e( 'Pick a topic to learn how each module works.', 'suitemkt3k' ); ?></p>
		<nav class="wmk-help-tabs" role="tablist">
			<?php foreach ( $tabs as $key => $tab ) : ?>
				<button type="button"
					class="wmk-help-tab"
					:class="tab === '<?php echo esc_js( $key ); ?>' ? 'is-active' : ''"
					@click="tab = '<?php echo esc_js( $key ); ?>'">
					<span class="wmk-help-tab-icon" aria-hidden="true"><?php echo $tab['icon']; /* phpcs:ignore */ ?></span>
					<span><?php echo esc_html( $tab['label'] ); ?></span>
				</button>
			<?php endforeach; ?>
		</nav>
	</aside>

	<section class="wmk-card wmk-help-content">
		<article x-show="tab === 'welcome'" x-cloak>
			<h2><?php esc_html_e( 'Welcome to SuiteMkt3k', 'suitemkt3k' ); ?></h2>
			<p class="wmk-help-lead"><?php esc_html_e( 'SuiteMkt3k is an all-in-one marketing suite for WordPress + WooCommerce stores. Grow your contact list, run discount campaigns, send newsletters, recover abandoned checkouts and track everything from a single dashboard.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'What is included', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><strong><?php esc_html_e( 'Coupons.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Promotional campaigns synchronised with native WooCommerce coupons, displayed as top banners or popups (classic or opt-in).', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Newsletter.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Visual designer for marketing emails plus a configurable subscription form distributed via shortcode.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Abandoned cart recovery.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Automatic and manual recovery emails for orders that were started but not completed.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Subscribers.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Central database of contacts captured by every channel, with one-click unsubscribe.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Statistics.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Impressions, opens, clicks, conversions and recovered revenue per channel and per campaign.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Settings.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Company data, dedicated SMTP, default behaviour and language.', 'suitemkt3k' ); ?></li>
			</ul>
			<h3><?php esc_html_e( 'Quick start in 4 steps', 'suitemkt3k' ); ?></h3>
			<ol>
				<li><?php esc_html_e( 'Open Settings ▸ My company and enter the brand name, contact email and logo.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Configure your dedicated SMTP under Settings ▸ Email SMTP and send a test message.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Create your first coupon campaign or newsletter form and embed it on the site.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Monitor performance from Dashboard and Statistics.', 'suitemkt3k' ); ?></li>
			</ol>
		</article>

		<article x-show="tab === 'coupons'" x-cloak>
			<h2><?php esc_html_e( 'Coupons', 'suitemkt3k' ); ?></h2>
			<p><?php esc_html_e( 'Each coupon campaign is mirrored into a native WooCommerce coupon, so checkout, validation and reports keep working the same. You only build the promotion once.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'Designer tabs', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><strong><?php esc_html_e( 'Basic.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Internal name, public marketing text, discount type (%, €), value, usage limit and format.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Design.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Background, gradient, text and CTA colours, optional popup background image and labels for every CTA (classic, opt-in step 1, opt-in step 2).', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Display.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Toggle the top banner and/or popup and define when the popup appears.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Schedule.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Start/end dates plus campaign status (draft, scheduled, active, paused).', 'suitemkt3k' ); ?></li>
			</ul>
			<h3><?php esc_html_e( 'Formats', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><strong><?php esc_html_e( 'Classic.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Banner or popup with the discount visible immediately. The CTA copies the WooCommerce code to the clipboard.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Opt-in.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Two-step popup: step 1 invites the visitor to claim the coupon, step 2 collects name, email, birth date and consent before sending the discount by email.', 'suitemkt3k' ); ?></li>
			</ul>
			<p><?php esc_html_e( 'All impressions, clicks and opt-ins are tracked and aggregated into Statistics.', 'suitemkt3k' ); ?></p>
		</article>

		<article x-show="tab === 'newsletter'" x-cloak>
			<h2><?php esc_html_e( 'Newsletter & subscription forms', 'suitemkt3k' ); ?></h2>
			<h3><?php esc_html_e( 'Campaign designer', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'Choose a predefined template (Classic, Welcome, Reminder, Announce) with distinct layouts and sample copy. Customise heading, body, image, accent colour, CTA and footer line. The live preview shows the company logo from Settings on top.', 'suitemkt3k' ); ?></p>
			<ul>
				<li><?php esc_html_e( 'Images are picked from the native WordPress media library.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'The shortcode placeholders {{name}} and {{first_name}} get replaced per recipient.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Use "Send test" to validate the layout before sending to the whole list.', 'suitemkt3k' ); ?></li>
			</ul>
			<h3><?php esc_html_e( 'Subscription forms', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'The Forms tab lets you build a contact form with toggleable fields (name, phone, birth date), custom labels (which double as placeholders when titles are hidden), colours, border radius and CTA copy.', 'suitemkt3k' ); ?></p>
			<p><?php esc_html_e( 'Once saved, copy the shortcode shown beneath the preview and paste it on any page, post or widget area. Every submission is added to the Subscribers database with consent timestamp and IP hash.', 'suitemkt3k' ); ?></p>
		</article>

		<article x-show="tab === 'cart'" x-cloak>
			<h2><?php esc_html_e( 'Cart recovery', 'suitemkt3k' ); ?></h2>
			<p><?php esc_html_e( 'SuiteMkt3k captures shoppers that reached the checkout and provided contact details before abandoning the order.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'List & import', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><?php esc_html_e( 'New abandoned carts are tracked automatically the moment the customer fills the email field at checkout.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Use "List abandoned carts" to additionally import every cancelled/draft WooCommerce order that carries an email and is younger than the configured retention window.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Use "Delete all" to clean the table when you reorganise campaigns.', 'suitemkt3k' ); ?></li>
			</ul>
			<h3><?php esc_html_e( 'Email template', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'Each cart gets a recovery email rendered from the default template. You can adjust subject, preheader, heading, body, CTA, accent colour and optional discount.', 'suitemkt3k' ); ?></p>
			<p><?php esc_html_e( 'If you assign a saved coupon to the template, that fixed coupon is injected into every recovery email. Otherwise the template generates a one-shot percentage coupon valid for the configured number of hours.', 'suitemkt3k' ); ?></p>
			<p><?php esc_html_e( 'Send manual recovery emails from the list, or enable the automatic cron under Settings ▸ Cart recovery. A cart is marked as recovered only when the customer opens the recovery link from that email and then completes the order.', 'suitemkt3k' ); ?></p>
		</article>

		<article x-show="tab === 'subscribers'" x-cloak>
			<h2><?php esc_html_e( 'Subscribers', 'suitemkt3k' ); ?></h2>
			<p><?php esc_html_e( 'A single, GDPR-friendly database fed by every channel of the suite: coupon opt-ins, newsletter forms, manual additions and cart recovery follow-ups.', 'suitemkt3k' ); ?></p>
			<ul>
				<li><strong><?php esc_html_e( 'Search & filter.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Use the toolbar to filter by source, status or text.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Manual add.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Click "+ New" to register a contact manually (e.g. captured offline).', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Edit / delete.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Each row exposes Edit and Delete actions in a confirmation dialog.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Unsubscribe.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Every email includes a unique unsubscribe URL bound to a token. Clicking it permanently flags the contact and the database is updated in real time, as required by law.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Export.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Generate a CSV of the current list at any time.', 'suitemkt3k' ); ?></li>
			</ul>
		</article>

		<article x-show="tab === 'stats'" x-cloak>
			<h2><?php esc_html_e( 'Statistics & dashboard', 'suitemkt3k' ); ?></h2>
			<h3><?php esc_html_e( 'Dashboard counters', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'A quick overview of real subscribers, coupons created, newsletters created and abandoned carts pending recovery. The line chart shows impressions, clicks, opens and conversions during the last 30 days, and recent activity reports the latest plugin events.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'Statistics page', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><?php esc_html_e( 'Time range buttons: 7d, 30d, 90d, 180d or Total.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Category buttons: All marketing, Coupons, Newsletters, New subscribers, Abandoned carts.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'When Coupons or Newsletters is active, a breakdown table lists impressions, opens, clicks, conversions and uses per campaign.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'In Abandoned carts you see the revenue recovered and the number of orders that came back through the recovery email link.', 'suitemkt3k' ); ?></li>
			</ul>
		</article>

		<article x-show="tab === 'settings'" x-cloak>
			<h2><?php esc_html_e( 'Settings & SMTP', 'suitemkt3k' ); ?></h2>
			<ul>
				<li><strong><?php esc_html_e( 'My company.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Brand name, reply-to email, logo (used in newsletter and recovery emails) and physical address (for legal footers).', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Language.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Switch the entire plugin between Spanish and English with a single dropdown.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Coupons.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Defaults applied to every new coupon (background colour, anti-repeat cookie days).', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Newsletter.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Batch size, interval between batches and the default email footer.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Cart recovery.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Enable automatic sending, define the inactivity window and the retention horizon.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Email SMTP.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Dedicated SMTP credentials encrypted with AES-256-GCM. SuiteMkt3k uses them only for its own messages, avoiding clashes with other plugins. A "Send test" button validates the configuration immediately.', 'suitemkt3k' ); ?></li>
				<li><strong><?php esc_html_e( 'Backup.', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Export or restore the entire plugin dataset. See the Backup help topic for details.', 'suitemkt3k' ); ?></li>
			</ul>
		</article>

		<article x-show="tab === 'backup'" x-cloak>
			<h2><?php esc_html_e( 'Backup & restore', 'suitemkt3k' ); ?></h2>
			<p><?php esc_html_e( 'The Backup tab under Settings lets you download a single compressed file (.json.gz) containing every SuiteMkt3k table (coupons, designs, subscribers, newsletters, forms, abandoned carts, recovery templates, events, daily stats, rate limits, logs) plus plugin options (settings, secret key, versions).', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'Manual backup', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'Click "Download full backup now" to save a copy on the server and download it to your computer. Only the 5 most recent server copies are kept; older files are deleted automatically.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'Automatic backup', 'suitemkt3k' ); ?></h3>
			<p><?php esc_html_e( 'Enable scheduled backups and choose an interval in days. SuiteMkt3k checks once per day and creates a new archive when the interval has elapsed. Files are stored in wp-content/uploads/suitemkt3k/backups/ with .htaccess blocking direct web access.', 'suitemkt3k' ); ?></p>
			<h3><?php esc_html_e( 'Restore', 'suitemkt3k' ); ?></h3>
			<ul>
				<li><?php esc_html_e( 'From the stored list: click Restore on any server copy (you will be asked to confirm).', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'From your computer: upload a .json.gz file exported from SuiteMkt3k (same site or another installation).', 'suitemkt3k' ); ?></li>
			</ul>
			<p><strong><?php esc_html_e( 'Important:', 'suitemkt3k' ); ?></strong> <?php esc_html_e( 'Restore replaces all current SuiteMkt3k data. WooCommerce coupon posts referenced by wc_coupon_id are not recreated automatically — use backups on the same site when possible.', 'suitemkt3k' ); ?></p>
		</article>

		<article x-show="tab === 'security'" x-cloak>
			<h2><?php esc_html_e( 'Security & privacy', 'suitemkt3k' ); ?></h2>
			<ul>
				<li><?php esc_html_e( 'All admin actions verify capabilities and signed nonces before performing any change.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Sensitive data (SMTP password, encryption keys) is stored using AES-256-GCM with a per-site secret.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'IP addresses are stored only as salted SHA-256 hashes for rate limiting and audit, never as plain text.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Public endpoints (coupon opt-in, newsletter form, unsubscribe) have anti-abuse rate limiters, honeypots and explicit consent checkboxes.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Every email contains an RGPD-compliant unsubscribe link; opting out is immediate and irreversible.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Internal logs are stored in the database table wp_wmk_* (see Activity log). They are not plain text files on the server.', 'suitemkt3k' ); ?></li>
			</ul>
		</article>

		<article x-show="tab === 'shortcuts'" x-cloak>
			<h2><?php esc_html_e( 'Shortcuts & tips', 'suitemkt3k' ); ?></h2>
			<ul>
				<li><?php esc_html_e( 'Shortcode for subscription forms: copy it from the form designer once the form is saved.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Use {{name}} or {{first_name}} inside email bodies to personalise the greeting.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Hide a popup by clicking the × button or pressing Escape — the choice is remembered through the configurable "anti-repeat cookie".', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Color fields accept both a colour picker and a manual #RRGGBB value; the two are kept in sync.', 'suitemkt3k' ); ?></li>
				<li><?php esc_html_e( 'Statistics are aggregated every night by a cron event; you can still see live counters on the dashboard.', 'suitemkt3k' ); ?></li>
			</ul>
		</article>
	</section>
</div>
