<section class="npc-main npc-main-{{ifThen isPlayMode 'play' 'edit'}}">
  <fieldset>
    <legend>{{localize "OATHHAMMER.Label.NPC"}}</legend>
    <div class="npc-pc flexrow">
      <div class="npc-left">
        <img class="actor-img" src="{{actor.img}}" data-edit="img" data-action="editImage" data-tooltip="{{actor.name}}" />
        <fieldset>
          <div class="flexrow character-resource">
            <span class="resource-label">{{localize "OATHHAMMER.Label.Grit"}}</span>
            {{formInput systemFields.grit.fields.value value=system.grit.value name="system.grit.value" disabled=isPlayMode}}
            <span>/</span>
            <input type="text" value="{{system.grit.max}}" disabled />
          </div>
          <div class="flexrow character-resource">
            <span class="resource-label">{{localize "OATHHAMMER.Label.Defense"}}</span>
            {{formInput systemFields.defense.fields.value value=system.defense.value name="system.defense.value" disabled=isPlayMode}}
          </div>
          <div class="flexrow character-resource">
            <span class="resource-label">{{localize "OATHHAMMER.Label.Movement"}}</span>
            {{formInput systemFields.movement.fields.base value=system.movement.base name="system.movement.base" disabled=isPlayMode}}
          </div>
        </fieldset>
      </div>
      <div class="npc-right">
        <div class="character-name">
          {{formInput fields.name value=source.name rootId=partId disabled=isPlayMode}}
          <a class="control" data-action="toggleSheet" data-tooltip="OATHHAMMER.ToggleSheet" data-tooltip-direction="UP">
            <i class="fa-solid fa-user-{{ifThen isPlayMode 'lock' 'pen'}}"></i>
          </a>
        </div>
        <fieldset>
          <legend>{{localize "OATHHAMMER.Label.Stats"}}</legend>
          <div class="flexrow">
            <div class="form-group">
              <label>{{localize "OATHHAMMER.Label.CR"}}</label>
              {{formInput systemFields.challengeRating value=system.challengeRating name="system.challengeRating" disabled=isPlayMode}}
            </div>
            <div class="form-group">
              <label>{{localize "OATHHAMMER.Label.AttackBonus"}}</label>
              {{formInput systemFields.attackBonus value=system.attackBonus name="system.attackBonus" disabled=isPlayMode}}
            </div>
            <div class="form-group">
              <label>{{localize "OATHHAMMER.Label.DamageBonus"}}</label>
              {{formInput systemFields.damageBonus value=system.damageBonus name="system.damageBonus" disabled=isPlayMode}}
            </div>
            <div class="form-group">
              <label>{{localize "OATHHAMMER.Label.InitiativeBonus"}}</label>
              {{formInput systemFields.initiativeBonus value=system.initiativeBonus name="system.initiativeBonus" disabled=isPlayMode}}
            </div>
          </div>
        </fieldset>
        <fieldset>
          <legend>{{localize "OATHHAMMER.Label.Attributes"}}</legend>
          <div class="attributes-grid">
            {{#each system.attributes as |attr key|}}
            <div class="attribute-box">
              <label>{{localize (concat "OATHHAMMER.Attribute." (capitalize key))}}</label>
              {{formInput (lookup ../systemFields.attributes.fields key).fields.rank value=attr.rank name=(concat "system.attributes." key ".rank") disabled=../isPlayMode}}
            </div>
            {{/each}}
          </div>
        </fieldset>
      </div>
    </div>
  </fieldset>
</section>
