<form class="{{cssClass}} {{actor.type}} flexcol form" autocomplete="off">

  {{!-- Sheet Header --}}
  <header class="sheet-header">
    <img class="profile-img" src="{{actor.img}}" data-edit="img" title="{{actor.name}}" height="100" width="100"/>
    <div class="header-fields">
      <div class="resources grid grid-3col">
        <h1 class="charname">
          <input name="name" type="text" value="{{actor.name}}" placeholder="Nom"/>
        </h1>
        <div class="resource-content flexrow row text-right">
          <label for="system.pack.value" class="resource-label">{{ localize 'ADVERSITY.pack'}}</label>
          <input type="number" name="system.pack.value" value="{{system.pack.value}}" data-dtype="Number" min="0" max="3" />      
        </div>
      </div>
      <div class="resources grid grid-3col">
        <div class="resource flex-group-center">
          <label for="system.threat.value" class="resource-label">{{ localize 'ADVERSITY.pattern'}}</label>
          <div class="resource-content">
            <input type="number" name="system.pattern.value" value="{{system.pattern.value}}" data-dtype="Number" min="1" max="4" />      
            <span>({{ patternLevel "label" system.pattern.value }})</span>      
          </div>
        </div>

        <div class="resource flex-group-center">
          <label for="system.experience.value" class="resource-label">{{ localize 'ADVERSITY.size'}}</label>
          <div class="resource-content">
            <input type="number" name="system.size.value" value="{{system.size.value}}" data-dtype="Number" min="0" max="3" />
          </div>
        </div>

        <div class="resource flex-group-center">
          <label for="system.cr" class="resource-label">{{ localize 'ADVERSITY.role'}}</label>
          <div class="resource-content">
            <input type="number" name="system.role.value" value="{{system.role.value }}" data-dtype="Number" min="1" max="3"/>
            <span>({{ roleLevel "label" system.role.value }})</span>      
          </div>
        </div>

      </div>
    </div>
  </header>

  {{!-- Sheet Tab Navigation --}}
  <nav class="sheet-tabs tabs" data-group="primary">
    {{!-- Default tab is specified in actor-sheet.mjs --}}
    <a class="item" data-tab="description">{{ localize 'VERMINE.abilities'}}</a>
    <a class="item" data-tab="effects">{{ localize 'VERMINE.combat'}}</a>
  </nav>

  {{!-- Sheet Body --}}
  <section class="sheet-body">

    {{!-- Biography Tab --}}
    <div class="tab stats" data-group="primary" data-tab="description">
      <section class="flexcol col gap-md">
        <h4 class="align-center">{{ localize 'IDENTITY.notes'}}</h4>        
        {{editor system.biography target="system.biography" button=true owner=owner editable=editable}}
      </section>
    </div>

    {{!-- Active Effects Tab --}}
    <div class="tab effects flexcol" data-group="primary" data-tab="effects">
      {{> "systems/vermine2047/templates/actor/creature/creature-combat.hbs"}}
    </div>

  </section>
</form>

