<?php
/**
 * Setup wizard shell — full-takeover layout without admin chrome.
 *
 * Vars in scope (set by SetupWizard::render_page()):
 *   $step      int — current step (1..6)
 *   $total     int — total steps (5 Free, 6 Pro)
 *   $completed bool — whether the wizard was completed at least once
 *
 * @package SkyEmagSync
 */

defined( 'ABSPATH' ) || exit;

$step_template = SkyEmagSync\Admin\SetupWizard::step_template( $step );
$is_done       = SkyEmagSync\Admin\SetupWizard::is_done_step( $step );

// Progress dots — one per step.
$dots = [];
for ( $i = 1; $i <= $total; $i++ ) {
	$dots[] = $i;
}
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title><?php esc_html_e( 'SkyServers Sync — Setup', 'skyservers-product-sync-for-emag' ); ?></title>
	<?php wp_admin_css( 'wp-admin', true ); ?>
	<?php wp_print_styles( [ 'skyemag-wizard' ] ); ?>
	<?php wp_print_head_scripts(); ?>
</head>
<body class="skyemag-wizard-fullscreen">

<div class="skyemag-wizard-shell">

	<header class="skyemag-wizard-header">
		<h1 class="skyemag-wizard-title">
			<?php esc_html_e( 'SkyServers Sync — Setup', 'skyservers-product-sync-for-emag' ); ?>
		</h1>
		<button type="button"
		        class="skyemag-wizard-close"
		        aria-label="<?php esc_attr_e( 'Skip the setup wizard', 'skyservers-product-sync-for-emag' ); ?>"
		        data-skyemag-wizard-skip>
			&times;
		</button>

		<div class="skyemag-wizard-progress" role="progressbar"
		     aria-valuemin="1" aria-valuemax="<?php echo (int) $total; ?>"
		     aria-valuenow="<?php echo (int) $step; ?>">
			<?php foreach ( $dots as $dot_index ) : ?>
				<span class="skyemag-wizard-dot <?php echo $dot_index === $step ? 'is-current' : ( $dot_index < $step ? 'is-done' : 'is-future' ); ?>"></span>
			<?php endforeach; ?>
		</div>
		<p class="skyemag-wizard-step-label">
			<?php
			printf(
				/* translators: %1$d current step, %2$d total steps */
				esc_html__( 'Step %1$d of %2$d', 'skyservers-product-sync-for-emag' ),
				(int) $step,
				(int) $total
			);
			?>
		</p>
	</header>

	<main class="skyemag-wizard-content">
		<?php
		$validation_error = get_transient( 'skyemag_setup_validation_error' );
		if ( $validation_error ) {
			delete_transient( 'skyemag_setup_validation_error' );
			?>
			<div class="notice notice-error" style="margin:0 0 18px;padding:10px 14px;">
				<p><strong>⚠</strong> <?php echo esc_html( $validation_error ); ?></p>
			</div>
			<?php
		}
		?>
		<?php
		if ( file_exists( $step_template ) ) {
			include $step_template;
		} else {
			echo '<p>' . esc_html__( 'Step template missing — please contact support.', 'skyservers-product-sync-for-emag' ) . '</p>';
		}
		?>
	</main>

</div>

<div id="skyemag-skip-modal" class="skyemag-modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="skyemag-skip-title">
	<div class="skyemag-modal">
		<h2 id="skyemag-skip-title"><?php esc_html_e( 'Skip the setup wizard?', 'skyservers-product-sync-for-emag' ); ?></h2>
		<p><?php esc_html_e( 'Your progress so far is saved — you can resume it any time from the Help page.', 'skyservers-product-sync-for-emag' ); ?></p>
		<div class="skyemag-modal-actions">
			<button type="button" class="button" data-skyemag-skip-cancel>
				<?php esc_html_e( 'Cancel', 'skyservers-product-sync-for-emag' ); ?>
			</button>
			<button type="button" class="button button-primary" data-skyemag-skip-confirm>
				<?php esc_html_e( 'Yes, skip', 'skyservers-product-sync-for-emag' ); ?>
			</button>
		</div>
	</div>
</div>

<?php wp_print_footer_scripts(); ?>
</body>
</html>
<?php
exit; // Prevent any trailing WP output.
