<!-- FACTOR Plugin Setup Wizard -->
<div id="wizard_plugin_factor_mqtt" class="factor-wizard">
  <!-- Language Selector -->
  <div class="language-selector">
    <div class="btn-group" id="wizard-lang-selector">
      <button type="button" class="btn btn-mini" data-lang="en" title="English">
        🇺🇸 EN
      </button>
      <button type="button" class="btn btn-mini" data-lang="ko" title="한국어">
        🇰🇷 KO
      </button>
    </div>
  </div>

  <!-- Wizard Header -->
  <div class="wizard-header">
    <div class="wizard-icon">
      🏭
    </div>
    <h2 data-i18n="wizard.title">FACTOR</h2>
  </div>

  <!-- Main Content -->
  <div class="wizard-content">
    <p class="wizard-intro" data-i18n="wizard.intro">
      Blast off 🚀 with <strong>factor.io.kr</strong>! Access your full OctoPrint portal, printer controls, camera streams, and plugins from anywhere! FACTOR works on your desktop, laptop, tablet, phone, and your favorite OctoPrint apps!
    </p>

    <p class="wizard-tagline">
      <span data-i18n="wizard.tagline">FACTOR is <strong>free, secure, and super easy to setup!</strong></span>
    </p>

    <!-- QR Code Section -->
    <div class="wizard-qr-section">
      <div class="qr-container">
        <img id="wizard-qr-code" src="" alt="QR Code" style="display: none;" />
        <div id="wizard-qr-loading" class="qr-loading">
          <i class="icon-spinner icon-spin"></i>
          <span data-i18n="setup.qr.loading">Loading QR Code...</span>
        </div>
      </div>
    </div>

    <!-- Action Button -->
    <div class="wizard-actions">
      <a id="wizard-open-setup" href="#" target="_blank" class="btn btn-primary btn-large">
        <span data-i18n="wizard.button.setup">Finish Your 20 Second Setup Now!</span>
        <i class="icon-external-link"></i>
      </a>
    </div>

    <!-- Help Link -->
    <div class="wizard-help-link">
      <a href="#" data-i18n="wizard.help.link">Need help or want to send feedback?</a>
    </div>
  </div>
</div>
