<section data-tab="identity" data-group="{{tab.group}}" class="tab {{tab.cssClass}}">

  {{!-- Oaths --}}
  <fieldset>
    <legend>{{localize "OATHHAMMER.Label.Oaths"}}
      {{#unless isPlayMode}}<a data-action="createOath" class="create-btn"><i class="fa-solid fa-plus"></i></a>{{/unless}}
    </legend>
    {{#if oaths.length}}
    <ul class="item-list item-list--oath">
      <li class="item-list-header">
        <span></span>
        <span class="col-name">{{localize "OATHHAMMER.Label.Name"}}</span>
        <span class="col-oath-effect">{{localize "OATHHAMMER.Label.Boon"}} / {{localize "OATHHAMMER.Label.Bane"}}</span>
        <span>{{localize "OATHHAMMER.Label.Violated"}}</span>
        <span></span>
      </li>
      {{#each oaths as |oath|}}
      <li class="item-entry {{#if oath._violated}}oath--violated{{/if}}" data-item-id="{{oath.id}}" data-item-uuid="{{oath.uuid}}">
        <img src="{{oath.img}}" class="item-img" />
        <span class="item-name" {{#if oath._descTooltip}}data-tooltip="{{oath._descTooltip}}"{{/if}}>{{oath.name}}</span>
        <span class="item-oath-effect {{#if oath._violated}}oath-bane{{else}}oath-boon{{/if}}">
          {{#if oath._violated}}{{oath._baneText}}{{else}}{{oath._boonText}}{{/if}}
        </span>
        <span class="item-violated">{{#if oath._violated}}<i class="fa-solid fa-circle-xmark"></i>{{else}}<i class="fa-regular fa-circle-check"></i>{{/if}}</span>
        <div class="item-actions">
          <a data-action="edit" data-item-id="{{oath.id}}" data-item-uuid="{{oath.uuid}}"><i class="fa-solid fa-edit"></i></a>
          <a data-action="delete" data-item-id="{{oath.id}}" data-item-uuid="{{oath.uuid}}"><i class="fa-solid fa-trash"></i></a>
        </div>
      </li>
      {{/each}}
    </ul>
    {{else}}
    <p class="no-items">{{localize "OATHHAMMER.Label.NoOaths"}}</p>
    {{/if}}
  </fieldset>

  {{!-- Traits --}}
  <fieldset>
    <legend>{{localize "OATHHAMMER.Label.Traits"}}
      {{#unless isPlayMode}}<a data-action="createTrait" class="create-btn"><i class="fa-solid fa-plus"></i></a>{{/unless}}
    </legend>
    {{#if traits.length}}
    <ul class="item-list item-list--trait">
      <li class="item-list-header">
        <span></span>
        <span class="col-name">{{localize "OATHHAMMER.Label.Name"}}</span>
        <span>{{localize "OATHHAMMER.Label.Type"}}</span>
        <span>{{localize "OATHHAMMER.Label.Usage"}}</span>
        <span></span>
      </li>
      {{#each traits as |trait|}}
      <li class="item-entry" data-item-id="{{trait.id}}" data-item-uuid="{{trait.uuid}}" data-drag="true">
        <img src="{{trait.img}}" class="item-img" />
        <span class="item-name" {{#if trait._descTooltip}}data-tooltip="{{trait._descTooltip}}"{{/if}}>{{trait.name}}</span>
        <span class="item-type">{{trait._typeLabel}}</span>
        <span class="item-usage">{{trait._usageLabel}}</span>
        <div class="item-actions">
          <a data-action="edit" data-item-id="{{trait.id}}" data-item-uuid="{{trait.uuid}}"><i class="fa-solid fa-edit"></i></a>
          <a data-action="delete" data-item-id="{{trait.id}}" data-item-uuid="{{trait.uuid}}"><i class="fa-solid fa-trash"></i></a>
        </div>
      </li>
      {{/each}}
    </ul>
    {{else}}
    <p class="no-items">{{localize "OATHHAMMER.Label.NoTraits"}}</p>
    {{/if}}
  </fieldset>

</section>
