<?php
/**
 * Setup wizard shell view.
 *
 * @package Noesia_Smart_Waiter
 */

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

$noesia_swa_wizard_status       = isset( $context['wizard_status'] ) ? sanitize_key( (string) $context['wizard_status'] ) : 'pending';
$noesia_swa_wizard_logo_url     = isset( $context['logo_url'] ) ? esc_url( (string) $context['logo_url'] ) : '';
$noesia_swa_wizard_settings_url = isset( $context['settings_url'] ) ? esc_url( (string) $context['settings_url'] ) : '';
$noesia_swa_wizard_payload      = isset( $context['payload'] ) && is_array( $context['payload'] ) ? $context['payload'] : array();
$noesia_swa_wizard_payload_json = wp_json_encode( $noesia_swa_wizard_payload );

if ( ! is_string( $noesia_swa_wizard_payload_json ) ) {
    $noesia_swa_wizard_payload_json = '{}';
}
?>
<div class="ns-swa-wizard-root<?php echo in_array( $noesia_swa_wizard_status, array( 'completed', 'skipped' ), true ) ? ' ns-swa-wizard-hidden' : ''; ?>" data-ns-swa-wizard-root="1" data-ns-swa-wizard-status="<?php echo esc_attr( $noesia_swa_wizard_status ); ?>" aria-hidden="<?php echo in_array( $noesia_swa_wizard_status, array( 'completed', 'skipped' ), true ) ? 'true' : 'false'; ?>">
    <div class="ns-swa-wizard-backdrop" data-ns-swa-wizard-close-layer="1"></div>
    <div class="ns-swa-wizard-shell" role="dialog" aria-modal="true" aria-labelledby="ns-swa-wizard-title" tabindex="-1">
        <div class="ns-swa-wizard-topbar">
            <div class="ns-swa-wizard-brand">
                <span class="ns-swa-wizard-brand-chip"><?php esc_html_e( 'Noesia Matrix OS', 'noesia-smart-waiter' ); ?></span>
                <span class="ns-swa-wizard-brand-sub"><?php esc_html_e( 'Setup Wizard', 'noesia-smart-waiter' ); ?></span>
            </div>
            <div class="ns-swa-wizard-topbar-actions">
                <div class="ns-swa-wizard-progress" aria-hidden="true">
                    <span class="ns-swa-wizard-progress-dot is-active" data-ns-swa-wizard-progress="1"></span>
                    <span class="ns-swa-wizard-progress-dot" data-ns-swa-wizard-progress="2"></span>
                    <span class="ns-swa-wizard-progress-dot" data-ns-swa-wizard-progress="3"></span>
                    <span class="ns-swa-wizard-progress-dot" data-ns-swa-wizard-progress="4"></span>
                    <span class="ns-swa-wizard-progress-dot" data-ns-swa-wizard-progress="5"></span>
                </div>
                <button type="button" class="ns-swa-wizard-skip" data-ns-swa-wizard-action="skip"><?php esc_html_e( 'Skip', 'noesia-smart-waiter' ); ?></button>
            </div>
        </div>

        <div class="ns-swa-wizard-stage">
            <section class="ns-swa-wizard-step is-active" data-ns-swa-wizard-step="1" aria-labelledby="ns-swa-wizard-title">
                <div class="ns-swa-wizard-hero">
                    <div class="ns-swa-wizard-logo-orb">
                        <img src="<?php echo esc_url( $noesia_swa_wizard_logo_url ); ?>" alt="<?php esc_attr_e( 'Noesia logo', 'noesia-smart-waiter' ); ?>" class="ns-swa-wizard-logo" />
                    </div>
                    <div class="ns-swa-wizard-copy">
                        <span class="ns-swa-wizard-kicker"><?php esc_html_e( 'The Awakening', 'noesia-smart-waiter' ); ?></span>
                        <h1 id="ns-swa-wizard-title" class="ns-swa-wizard-title"><?php esc_html_e( 'Welcome to Noesia Matrix OS. Build your perfect workspace.', 'noesia-smart-waiter' ); ?></h1>
                        <p class="ns-swa-wizard-text"><?php esc_html_e( 'A cinematic first-run shell for module activation, diagnostics, interface routing, and live entry into the Matrix.', 'noesia-smart-waiter' ); ?></p>
                    </div>
                </div>
                <div class="ns-swa-wizard-actions ns-swa-wizard-actions--center">
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--primary" data-ns-swa-wizard-action="next"><?php esc_html_e( '[ Begin ]', 'noesia-smart-waiter' ); ?></button>
                </div>
            </section>

            <section class="ns-swa-wizard-step" data-ns-swa-wizard-step="2" aria-labelledby="ns-swa-wizard-modules-title" hidden>
                <div class="ns-swa-wizard-section-head">
                    <span class="ns-swa-wizard-kicker"><?php esc_html_e( 'Workspace Setup', 'noesia-smart-waiter' ); ?></span>
                    <h2 id="ns-swa-wizard-modules-title" class="ns-swa-wizard-title ns-swa-wizard-title--section"><?php esc_html_e( 'Choose the professional workspace and operating layers you need.', 'noesia-smart-waiter' ); ?></h2>
                    <p class="ns-swa-wizard-text"><?php esc_html_e( 'Professional areas appear first. Every switch uses the same visibility state as the Menu Box Manager, so your choices remain compatible with the live admin menu.', 'noesia-smart-waiter' ); ?></p>
                </div>
                <div class="ns-swa-wizard-module-grid" data-ns-swa-wizard-module-grid="1"></div>
                <div class="ns-swa-wizard-actions">
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--ghost" data-ns-swa-wizard-action="back"><?php esc_html_e( 'Back', 'noesia-smart-waiter' ); ?></button>
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--primary" data-ns-swa-wizard-action="next"><?php esc_html_e( '[ Next ]', 'noesia-smart-waiter' ); ?></button>
                </div>
            </section>

            <section class="ns-swa-wizard-step" data-ns-swa-wizard-step="3" aria-labelledby="ns-swa-wizard-interface-title" hidden>
                <div class="ns-swa-wizard-section-head">
                    <span class="ns-swa-wizard-kicker"><?php esc_html_e( 'The Interface Engine', 'noesia-smart-waiter' ); ?></span>
                    <h2 id="ns-swa-wizard-interface-title" class="ns-swa-wizard-title ns-swa-wizard-title--section"><?php esc_html_e( 'Customize your Matrix interface.', 'noesia-smart-waiter' ); ?></h2>
                    <p class="ns-swa-wizard-text"><?php esc_html_e( 'Choose how the shell should render when the wizard opens the real application underneath.', 'noesia-smart-waiter' ); ?></p>
                </div>

                <div class="ns-swa-wizard-style-grid" data-ns-swa-wizard-style-grid="1"></div>

                <div class="ns-swa-wizard-dock-card" data-ns-swa-wizard-dock-card="1">
                    <div class="ns-swa-wizard-dock-copy">
                        <span class="ns-swa-wizard-kicker ns-swa-wizard-kicker--small"><?php esc_html_e( 'OS Dock', 'noesia-smart-waiter' ); ?></span>
                        <h3 class="ns-swa-wizard-subtitle"><?php esc_html_e( 'Enable Noesia Dock', 'noesia-smart-waiter' ); ?></h3>
                        <p class="ns-swa-wizard-text ns-swa-wizard-text--small"><?php esc_html_e( 'The dock starts enabled by default. Switch it off here if you want a cleaner first entry.', 'noesia-smart-waiter' ); ?></p>
                    </div>
                    <label class="ns-swa-wizard-switch ns-swa-wizard-switch--dock">
                        <input type="checkbox" data-ns-swa-wizard-dock-toggle="1" checked />
                        <span class="ns-swa-wizard-switch-ui" aria-hidden="true"></span>
                    </label>
                    <div class="ns-swa-wizard-dock-preview-wrap">
                        <img src="" alt="<?php esc_attr_e( 'Dock preview', 'noesia-smart-waiter' ); ?>" class="ns-swa-wizard-dock-preview" data-ns-swa-wizard-dock-preview="1" />
                    </div>
                </div>

                <div class="ns-swa-wizard-inline-warning">
                    <strong><?php esc_html_e( 'Important', 'noesia-smart-waiter' ); ?></strong>
                    <span><?php esc_html_e( 'Wizard selections here update the live shell state. The dock starts ON unless you explicitly disable it.', 'noesia-smart-waiter' ); ?></span>
                </div>

                <div class="ns-swa-wizard-actions">
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--ghost" data-ns-swa-wizard-action="back"><?php esc_html_e( 'Back', 'noesia-smart-waiter' ); ?></button>
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--primary" data-ns-swa-wizard-action="next"><?php esc_html_e( '[ Next ]', 'noesia-smart-waiter' ); ?></button>
                </div>
            </section>

            <section class="ns-swa-wizard-step" data-ns-swa-wizard-step="4" aria-labelledby="ns-swa-wizard-diagnostics-title" hidden>
                <div class="ns-swa-wizard-section-head">
                    <span class="ns-swa-wizard-kicker"><?php esc_html_e( 'System Diagnostics', 'noesia-smart-waiter' ); ?></span>
                    <h2 id="ns-swa-wizard-diagnostics-title" class="ns-swa-wizard-title ns-swa-wizard-title--section"><?php esc_html_e( 'Running live environment diagnostics before Matrix entry.', 'noesia-smart-waiter' ); ?></h2>
                    <p class="ns-swa-wizard-text"><?php esc_html_e( 'This console performs real checks against your browser, WordPress runtime, storage layer, and REST channel. No mock output is used here.', 'noesia-smart-waiter' ); ?></p>
                </div>

                <div class="ns-swa-wizard-diagnostics-card">
                    <div class="ns-swa-wizard-diagnostics-terminal" data-ns-swa-wizard-diagnostics-terminal="1">
                        <div class="ns-swa-wizard-diagnostics-rain" data-ns-swa-wizard-diagnostics-rain="1" aria-hidden="true"></div>
                        <div class="ns-swa-wizard-diagnostics-overlay"></div>
                        <div class="ns-swa-wizard-diagnostics-lines" data-ns-swa-wizard-diagnostics-lines="1" aria-live="polite"></div>
                    </div>
                </div>

                <div class="ns-swa-wizard-actions">
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--ghost" data-ns-swa-wizard-action="back"><?php esc_html_e( 'Back', 'noesia-smart-waiter' ); ?></button>
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--primary is-disabled" data-ns-swa-wizard-action="next" data-ns-swa-wizard-diagnostics-next="1" disabled><?php esc_html_e( '[ Next ]', 'noesia-smart-waiter' ); ?></button>
                </div>
            </section>

            <section class="ns-swa-wizard-step" data-ns-swa-wizard-step="5" aria-labelledby="ns-swa-wizard-launch-title" hidden>
                <div class="ns-swa-wizard-launch-card">
                    <span class="ns-swa-wizard-kicker"><?php esc_html_e( 'The Launch Sequence', 'noesia-smart-waiter' ); ?></span>
                    <h2 id="ns-swa-wizard-launch-title" class="ns-swa-wizard-title ns-swa-wizard-title--section"><?php esc_html_e( 'System Initialized. Your workspace is ready.', 'noesia-smart-waiter' ); ?></h2>
                    <p class="ns-swa-wizard-text"><?php esc_html_e( 'Proceed directly into the Matrix or enter the settings surface for deeper language and general configuration.', 'noesia-smart-waiter' ); ?></p>

                    <div class="ns-swa-wizard-actions ns-swa-wizard-actions--stack">
                        <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--launch" data-ns-swa-wizard-action="launch"><?php esc_html_e( 'Enter the Noesia Matrix', 'noesia-smart-waiter' ); ?></button>
                        <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--ghost" data-ns-swa-wizard-action="settings"><?php esc_html_e( 'Enter the Noesia Settings', 'noesia-smart-waiter' ); ?></button>
                        <p class="ns-swa-wizard-hint"><?php esc_html_e( 'to configure language and general settings.', 'noesia-smart-waiter' ); ?></p>
                    </div>
                </div>
                <div class="ns-swa-wizard-actions">
                    <button type="button" class="ns-swa-wizard-button ns-swa-wizard-button--ghost" data-ns-swa-wizard-action="back"><?php esc_html_e( 'Back', 'noesia-smart-waiter' ); ?></button>
                </div>
            </section>
        </div>

        <div class="ns-swa-wizard-finale" data-ns-swa-wizard-finale="1" hidden>
            <div class="ns-swa-wizard-finale-copy">
                <p class="ns-swa-wizard-finale-text"><?php esc_html_e( 'You are in. You have accessed the Noesia Matrix.', 'noesia-smart-waiter' ); ?></p>
                <p class="ns-swa-wizard-finale-hint"><?php esc_html_e( 'Click anywhere to reveal the live workspace.', 'noesia-smart-waiter' ); ?></p>
            </div>
        </div>

        <div class="ns-swa-wizard-status" data-ns-swa-wizard-status-text="1" aria-live="polite"></div>
    </div>

    <textarea id="ns-swa-wizard-payload" class="ns-swa-wizard-payload" hidden><?php echo esc_textarea( $noesia_swa_wizard_payload_json ); ?></textarea>
    <a href="<?php echo esc_url( $noesia_swa_wizard_settings_url ); ?>" class="ns-swa-wizard-settings-link" data-ns-swa-wizard-settings-link="1" hidden><?php esc_html_e( 'Settings', 'noesia-smart-waiter' ); ?></a>
</div>
