<section class="{{cssClass}} les-oublies-sheet compagnie-sheet" autocomplete="off">
  <header class="sheet-header hero-banner">
    <img class="profile-img" data-edit="img" data-action="editImage" src="{{actor.img}}" title="{{actor.name}}" />
    <div class="header-fields hero-copy">
      <button class="mode-button mode-button--icon" type="button" data-action="toggleSheet" title="{{#if isEditMode}}{{localize "LESOUBLIES.ui.playMode"}}{{else}}{{localize "LESOUBLIES.ui.editMode"}}{{/if}}" aria-label="{{#if isEditMode}}{{localize "LESOUBLIES.ui.playMode"}}{{else}}{{localize "LESOUBLIES.ui.editMode"}}{{/if}}">
        <i class="fa-solid {{#if isEditMode}}fa-eye{{else}}fa-pen-to-square{{/if}}"></i>
      </button>
      <h1 class="sheet-title"><input name="name" type="text" value="{{actor.name}}" placeholder="Nom de compagnie" {{#if isPlayMode}}disabled{{/if}} /></h1>
    </div>
  </header>

  <nav class="sheet-tabs" aria-label="Navigation de la fiche">
    {{#each tabs as |tab|}}
      <button type="button" class="sheet-tab-button {{tab.cssClass}}" data-action="switchTab" data-tab="{{tab.id}}">
        <i class="{{tab.icon}}"></i>
        <span>{{tab.label}}</span>
      </button>
    {{/each}}
  </nav>

  <section class="sheet-tab {{tabs.power.cssClass}}" data-tab="power">
    <section class="sheet-card summary-card">
      <h2>{{localize "LESOUBLIES.labels.pouvoir"}}</h2>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.powerName"}}</label>
        <input name="system.power.name" type="text" value="{{system.power.name}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.reserveSongesCompagnie"}}</label>
        <input name="system.power.sharedDreamPoints" type="number" value="{{system.power.sharedDreamPoints}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <h3>{{localize "LESOUBLIES.labels.threadReserves"}}</h3>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.threadSonges"}}</label>
        <input name="system.reserves.songesThreads" type="number" value="{{system.reserves.songesThreads}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.threadCauchemar"}}</label>
        <input name="system.reserves.cauchemarThreads" type="number" value="{{system.reserves.cauchemarThreads}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.emptyGlobes"}}</label>
        <input name="system.reserves.emptyGlobes" type="number" value="{{system.reserves.emptyGlobes}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.activation"}}</label>
        <input name="system.power.activationCondition" type="text" value="{{system.power.activationCondition}}" {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.capitaineVisible"}}</label>
        <input name="system.power.captainVisible" type="checkbox" {{checked system.power.captainVisible}} {{#if isPlayMode}}disabled{{/if}} />
      </div>
      <div class="field-row">
        <label>{{localize "LESOUBLIES.labels.capitaineTemoin"}}</label>
        <input name="system.power.captainNeedsWitness" type="checkbox" {{checked system.power.captainNeedsWitness}} {{#if isPlayMode}}disabled{{/if}} />
      </div>
      {{formInput systemFields.power.fields.description enriched=enriched.power.description value=system.power.description name="system.power.description" toggled=true}}
      <div class="section-title-row">
        <h3>Items de pouvoir</h3>
        <button type="button" data-action="createItem" data-type="pouvoircompagnie">+ {{localize "TYPES.Item.pouvoircompagnie"}}</button>
      </div>
      <div class="item-list">
        {{#each powers as |item|}}
          <article class="item-card" data-item-id="{{item.id}}" draggable="true">
            <div><strong>{{item.name}}</strong><div>{{item.system.activationCondition}}</div></div>
            <div class="item-controls"><button type="button" data-action="editItem" data-item-id="{{item.id}}">Edit</button><button type="button" data-action="deleteItem" data-item-id="{{item.id}}">Delete</button></div>
          </article>
        {{/each}}
      </div>
      {{#if primaryPower}}
        <div class="help-text">{{primaryPower.name}} — {{primaryPower.system.activationCondition}}</div>
      {{/if}}
    </section>
  </section>

  <section class="sheet-tab {{tabs.members.cssClass}}" data-tab="members">
    <div class="sheet-grid sheet-grid-2">
      <section class="sheet-card ledger-card">
        <h2>{{localize "LESOUBLIES.ui.membres"}}</h2>
        <div class="field-row">
          <label>{{localize "LESOUBLIES.labels.capitaine"}}</label>
          <select name="system.captainId" {{#if isPlayMode}}disabled{{/if}}>
            <option value="">—</option>
            {{#each choiceSets.captainOptions as |option|}}
              <option value="{{option.value}}" {{#if (eq option.value @root.system.captainId)}}selected{{/if}}>{{option.label}}</option>
            {{/each}}
          </select>
        </div>
        <div class="field-row">
          <label>{{localize "LESOUBLIES.labels.ombreDuTourment"}}</label>
          <select name="system.ombreDuTourmentId" {{#if isPlayMode}}disabled{{/if}}>
            <option value="">—</option>
            {{#each choiceSets.shadowOptions as |option|}}
              <option value="{{option.value}}" {{#if (eq option.value @root.system.ombreDuTourmentId)}}selected{{/if}}>{{option.label}}</option>
            {{/each}}
          </select>
        </div>
        <p class="help-text">Sélectionnez le capitaine et l'ombre du tourment parmi les personnages du monde.</p>
        {{#if captain}}<p><strong>Capitaine :</strong> {{captain.name}}</p>{{/if}}
        {{#if shadow}}<p><strong>Ombre :</strong> {{shadow.name}}</p>{{/if}}
        <ul class="reference-list">
          {{#each members as |member|}}
            <li>{{member.name}}</li>
          {{/each}}
        </ul>
      </section>

      <section class="sheet-card ledger-card">
        <h2>{{localize "LESOUBLIES.labels.liensNarratifs"}}</h2>
        <p class="help-text">{{localize "LESOUBLIES.ui.readOnlyCollection"}}</p>
        <ul class="reference-list">
          {{#each links as |link|}}
            <li><strong>{{link.label}}</strong> — {{link.sourceLabel}} -> {{link.targetLabel}} {{link.details}}</li>
          {{/each}}
        </ul>
      </section>
    </div>
  </section>

  <section class="sheet-tab {{tabs.notes.cssClass}}" data-tab="notes">
    <section class="sheet-card notes-card">
      <h2>{{localize "LESOUBLIES.labels.description"}}</h2>
      {{formInput systemFields.description enriched=enriched.description value=system.description name="system.description" toggled=true}}
      <h2>{{localize "LESOUBLIES.labels.notes"}}</h2>
      {{formInput systemFields.notes enriched=enriched.notes value=system.notes name="system.notes" toggled=true}}
    </section>
  </section>
</section>
