<section class="{{cssClass}} les-oublies-sheet creature-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" {{#if isPlayMode}}disabled{{/if}} /></h1>
      <div class="sheet-actions">
        <button type="button" data-action="openInitiative">{{localize "LESOUBLIES.rolls.initiative"}}</button>
        <button type="button" data-action="openThreadHarvest">Récolte de fils</button>
      </div>
    </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.overview.cssClass}}" data-tab="overview">
    <div class="sheet-grid sheet-grid-2">
      <section class="sheet-card summary-card">
        <h2>{{localize "LESOUBLIES.ui.derivedOverview"}}</h2>
        <div class="field-row"><label>{{localize "LESOUBLIES.labels.categorie"}}</label><input name="system.biodata.categorie" type="text" value="{{system.biodata.categorie}}" {{#if isPlayMode}}disabled{{/if}} /></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.labels.taille"}}</label><select name="system.size.value" {{#if isPlayMode}}disabled{{/if}}>{{#each choiceSets.creatureSizeOptions as |option|}}<option value="{{option.value}}" {{#if (eq option.value @root.system.size.value)}}selected{{/if}}>{{option.label}}</option>{{/each}}</select><span>{{derived.sizeLabel}}</span></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.ui.vie"}}</label><input name="system.hp.value" type="number" value="{{system.hp.value}}" {{#if isPlayMode}}disabled{{/if}} /><span>/ {{derived.hpMax}}</span></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.labels.hpAffichage"}}</label><input name="system.hp.display" type="text" value="{{system.hp.display}}" {{#if isPlayMode}}disabled{{/if}} /><span>{{derived.hpDisplay}}</span></div>
        <div class="field-row"><label>Protection</label><input name="system.protection" type="number" value="{{system.protection}}" {{#if isPlayMode}}disabled{{/if}} /></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.ui.songes"}}</label><input name="system.songes.value" type="number" value="{{system.songes.value}}" {{#if isPlayMode}}disabled{{/if}} /></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.labels.pointsSonges"}}</label><input name="system.songes.points" type="number" value="{{system.songes.points}}" {{#if isPlayMode}}disabled{{/if}} /><span>/ {{system.songes.max}}</span></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.ui.cauchemar"}}</label><input name="system.cauchemar.value" type="number" value="{{system.cauchemar.value}}" {{#if isPlayMode}}disabled{{/if}} /></div>
        <div class="field-row"><label>{{localize "LESOUBLIES.labels.pointsCauchemar"}}</label><input name="system.cauchemar.points" type="number" value="{{system.cauchemar.points}}" {{#if isPlayMode}}disabled{{/if}} /><span>/ {{system.cauchemar.max}}</span></div>
      </section>

      <section class="sheet-card ledger-card">
        <h2>{{localize "LESOUBLIES.labels.degats"}}</h2>
        {{formInput systemFields.statblock.fields.damage enriched=enriched.statblock.damage value=system.statblock.damage name="system.statblock.damage" toggled=true}}
        <h2>{{localize "LESOUBLIES.labels.reglesSpeciales"}}</h2>
        {{formInput systemFields.statblock.fields.special enriched=enriched.statblock.special value=system.statblock.special name="system.statblock.special" toggled=true}}
      </section>
    </div>
  </section>

  <section class="sheet-tab {{tabs.aptitudes.cssClass}}" data-tab="aptitudes">
    <section class="sheet-card profiles-card">
      <h2>{{localize "LESOUBLIES.labels.profilsOptionnels"}}</h2>
      <div class="profile-grid">
        {{#each system.profils as |value key|}}
          <div class="profile-cell">
            <button type="button" data-action="rollProfile" data-profile-key="{{key}}">{{profileLabel key}}</button>
            <input name="system.profils.{{key}}" type="number" value="{{value}}" {{#if @root.isPlayMode}}disabled{{/if}} />
          </div>
        {{/each}}
      </div>
    </section>

    <section class="sheet-card ledger-card">
      <div class="section-title-row">
        <h2>{{localize "LESOUBLIES.ui.competences"}}</h2>
        <button type="button" data-action="createItem" data-type="competence">+ {{localize "TYPES.Item.competence"}}</button>
      </div>
      {{#each skillGroups as |group|}}
        {{#if (count group.items)}}
          <div class="group-block">
            <h3>{{group.label}}</h3>
            <div class="item-list">
              {{#each group.items as |entry|}}
                <article class="item-card" data-item-id="{{entry.item.id}}" draggable="true">
                  <div><strong>{{entry.item.name}}</strong><div>{{localize "LESOUBLIES.labels.valeurFinale"}} {{entry.finalValue}}</div></div>
                  <div class="item-controls"><button type="button" data-action="rollSkill" data-item-id="{{entry.item.id}}">{{localize "LESOUBLIES.ui.roll"}}</button><button type="button" data-action="editItem" data-item-id="{{entry.item.id}}">Edit</button><button type="button" data-action="deleteItem" data-item-id="{{entry.item.id}}">Delete</button></div>
                </article>
              {{/each}}
            </div>
          </div>
        {{/if}}
      {{/each}}
    </section>
  </section>

  <section class="sheet-tab {{tabs.combat.cssClass}}" data-tab="combat">
    <div class="sheet-grid sheet-grid-2">
      <section class="sheet-card ledger-card">
        <h2>{{localize "LESOUBLIES.labels.sortilegesSonges"}}</h2>
        {{formInput systemFields.statblock.fields.spellSonges enriched=enriched.statblock.spellSonges value=system.statblock.spellSonges name="system.statblock.spellSonges" toggled=true}}
        <h2>{{localize "LESOUBLIES.labels.sortilegesCauchemar"}}</h2>
        {{formInput systemFields.statblock.fields.spellCauchemar enriched=enriched.statblock.spellCauchemar value=system.statblock.spellCauchemar name="system.statblock.spellCauchemar" toggled=true}}
      </section>

      <section class="sheet-card ledger-card">
        <div class="section-title-row">
          <h2>{{localize "LESOUBLIES.ui.combat"}}</h2>
          <div class="embed-buttons">
            <button type="button" data-action="openCombatPreset" data-preset="encourager">Encourager</button>
            <button type="button" data-action="openCombatPreset" data-preset="intimider">Intimider</button>
            <button type="button" data-action="openCombatPreset" data-preset="evaluer">Évaluer</button>
            <button type="button" data-action="openCombatPreset" data-preset="maitriser">Maîtriser</button>
            <button type="button" data-action="openCombatPreset" data-preset="seDeplacer">Se déplacer</button>
          </div>
        </div>
      </section>
    </div>

    <section class="sheet-card ledger-card">
      <div class="section-title-row">
        <h2>{{localize "LESOUBLIES.ui.equipement"}}</h2>
        <div class="embed-buttons">
          <button type="button" data-action="createItem" data-type="arme">+ {{localize "TYPES.Item.arme"}}</button>
          <button type="button" data-action="createItem" data-type="armure">+ {{localize "TYPES.Item.armure"}}</button>
          <button type="button" data-action="createItem" data-type="equipement">+ {{localize "TYPES.Item.equipement"}}</button>
          <button type="button" data-action="createItem" data-type="sortilege">+ {{localize "TYPES.Item.sortilege"}}</button>
        </div>
      </div>
      <div class="item-list">
        {{#each weapons as |item|}}
          <article class="item-card" data-item-id="{{item.id}}" draggable="true">
            <div><strong>{{item.name}}</strong><div>{{item.displayDamage}}</div></div>
            <div class="item-controls"><button type="button" data-action="useWeapon" data-item-id="{{item.id}}">Attaque</button><button type="button" data-action="resolveWeaponDamage" data-item-id="{{item.id}}">Dégâts</button><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}}
        {{#each armors as |item|}}
          <article class="item-card" data-item-id="{{item.id}}" draggable="true">
            <div><strong>{{item.name}}</strong><div>Prot {{item.system.protection}}</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}}
        {{#each equipment as |item|}}
          <article class="item-card" data-item-id="{{item.id}}" draggable="true">
            <div><strong>{{item.name}}</strong><div>{{localize "TYPES.Item.equipement"}} - {{item.system.category}}</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}}
        {{#each spells as |item|}}
          <article class="item-card" data-item-id="{{item.id}}" draggable="true">
            <div><strong>{{item.name}}</strong><div>{{item.system.tradition}} / {{item.system.polarity}}</div></div>
            <div class="item-controls"><button type="button" data-action="useSpell" data-item-id="{{item.id}}">Activer</button><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>
    </section>
  </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.biodata.fields.description enriched=enriched.biodata.description value=system.biodata.description name="system.biodata.description" toggled=true}}
      <h2>Habitat</h2>
      {{formInput systemFields.biodata.fields.habitat enriched=enriched.biodata.habitat value=system.biodata.habitat name="system.biodata.habitat" toggled=true}}
      <h2>{{localize "LESOUBLIES.labels.notes"}}</h2>
      {{formInput systemFields.biodata.fields.notes enriched=enriched.biodata.notes value=system.biodata.notes name="system.biodata.notes" toggled=true}}
      <h2>{{localize "LESOUBLIES.labels.gmnotes"}}</h2>
      {{formInput systemFields.biodata.fields.gmnotes enriched=enriched.biodata.gmnotes value=system.biodata.gmnotes name="system.biodata.gmnotes" toggled=true}}
    </section>
  </section>
</section>
