<form class="mgt2-npc-form">

  <nav class="tabs" data-group="primary">
    <a class="item active" data-tab="npc">
      <i class="fas fa-user"></i> PNJ rapide
    </a>
    <a class="item" data-tab="encounter">
      <i class="fas fa-random"></i> Rencontre
    </a>
    <a class="item" data-tab="mission">
      <i class="fas fa-briefcase"></i> Client & mission
    </a>
  </nav>

  <section class="tab-content">
    <div class="tab active" data-tab="npc">
      <h3><i class="fas fa-user"></i> Générateur de PNJ rapide</h3>
      <p class="npc-intro">Génère un rôle, une particularité et un niveau d’expérience jouable en quelques secondes.</p>

      <fieldset>
        <legend>Cadre du PNJ</legend>
        <div class="form-group-row">
          <div class="form-group">
            <label for="npc-relation">Relation aux Voyageurs</label>
            <select id="npc-relation" name="npc.relation">
              {{#each relations}}
              <option value="{{key}}" {{#if (eq ../npc.relation key)}}selected{{/if}}>{{label}}</option>
              {{/each}}
            </select>
          </div>
          <div class="form-group">
            <label for="npc-experience-bias">Type d’expérience</label>
            <select id="npc-experience-bias" name="npc.experienceBias">
              <option value="random" {{#if (eq npc.experienceBias "random")}}selected{{/if}}>Aléatoire</option>
              <option value="noncombatant" {{#if (eq npc.experienceBias "noncombatant")}}selected{{/if}}>Non-combattant</option>
              <option value="combatant" {{#if (eq npc.experienceBias "combatant")}}selected{{/if}}>Combattant</option>
            </select>
          </div>
        </div>
      </fieldset>

      <fieldset>
        <legend>Création de fiche</legend>
        <div class="form-group checkbox-group">
          <label>
            <input type="checkbox" name="npc.createActor" {{#if npc.createActor}}checked{{/if}}>
            Créer aussi une fiche PNJ dans les Acteurs
          </label>
        </div>
        <div class="form-group-row">
          <div class="form-group">
            <label for="npc-actor-name">Nom de la fiche <span class="hint">(facultatif)</span></label>
            <input id="npc-actor-name" name="npc.actorName" type="text" value="{{npc.actorName}}" placeholder="PNJ — Médecin">
          </div>
        </div>
        <div class="form-group checkbox-group">
          <label>
            <input type="checkbox" name="npc.openCreatedActor" {{#if npc.openCreatedActor}}checked{{/if}}>
            Ouvrir automatiquement la fiche créée
          </label>
        </div>
      </fieldset>

      <div class="form-footer">
        <button type="button" class="btn-calculate" data-action="generate-npc">
          <i class="fas fa-dice-d6"></i> Générer le PNJ
        </button>
      </div>
    </div>

    <div class="tab" data-tab="encounter">
      <h3><i class="fas fa-random"></i> Rencontre aléatoire</h3>
      <p class="npc-intro">Utilise les tables d’astroport, de campagne ou d’environnement urbain.</p>

      <fieldset>
        <legend>Contexte</legend>
        <div class="form-group-row">
          <div class="form-group">
            <label for="encounter-context">Lieu de la rencontre</label>
            <select id="encounter-context" name="encounter.context">
              <option value="starport" {{#if (eq encounter.context "starport")}}selected{{/if}}>Astroport</option>
              <option value="rural" {{#if (eq encounter.context "rural")}}selected{{/if}}>Rural</option>
              <option value="urban" {{#if (eq encounter.context "urban")}}selected{{/if}}>Urbain</option>
            </select>
          </div>
        </div>
        <div class="form-group checkbox-group">
          <label>
            <input type="checkbox" name="encounter.includeFollowUp" {{#if encounter.includeFollowUp}}checked{{/if}}>
            Ajouter automatiquement les détails liés si la table appelle un client ou un PNJ
          </label>
        </div>
      </fieldset>

      <div class="form-footer">
        <button type="button" class="btn-calculate" data-action="generate-encounter">
          <i class="fas fa-dice-d6"></i> Générer la rencontre
        </button>
      </div>
    </div>

    <div class="tab" data-tab="mission">
      <h3><i class="fas fa-briefcase"></i> Client & mission</h3>
      <p class="npc-intro">Tire un client, une mission, une cible et une opposition pour lancer une intrigue.</p>

      <fieldset>
        <legend>Sortie générée</legend>
        <div class="npc-checklist">
          <div><i class="fas fa-check"></i> Client aléatoire (D66)</div>
          <div><i class="fas fa-check"></i> Mission aléatoire (D66)</div>
          <div><i class="fas fa-check"></i> Cible (D66)</div>
          <div><i class="fas fa-check"></i> Opposition / complication (D66)</div>
        </div>
      </fieldset>

      <div class="form-footer">
        <button type="button" class="btn-calculate" data-action="generate-mission">
          <i class="fas fa-dice-d6"></i> Générer le contrat
        </button>
      </div>
    </div>
  </section>

</form>
