<section class="tab sheet-body {{tab.cssClass}}" data-tab="skills" data-group="primary">

  <div class="grid grid-3col">

    {{#each skills as |category categkey|}}
    <div>
      <ul class="stat-list alternate-list item-list">
        <li class="item flexrow list-item items-title-bg">
          <span class="item-name-label-header impact-title">
            <h3>
              {{#if (eq @root.type "npc")}}
              <a data-action="rollSkillConfront" data-category-key="{{categkey}}" data-skill-key="rawnpc">
                <i class="fa-regular fa-swords"></i>
              </a>
              <a data-action="rollSkill" data-category-key="{{categkey}}" data-skill-key="rawnpc">
                <i class="fa-solid fa-dice-d6"></i>
              {{/if}}
              <label class="items-title-text">{{localize category.name}} ({{valueAtIndex @root.impactsMalus categkey}})</label>
              {{#if (eq @root.type "npc")}}
              </a>
              <select class="item-field-label-short-header"
                name="system.skills.{{categkey}}.pnjvalue">
                {{selectOptions @root.config.skillLevel selected=category.pnjvalue}}
              </select>
              {{/if}}
            </h3>
          </span>
        </li>

        {{#each category.skilllist as |skill skillkey|}}
        <li class="item flexrow list-item">
          <span class="item-name-label-long">
            <a data-action="rollSkillConfront" data-category-key="{{categkey}}" data-skill-key="{{skillkey}}">
              <i class="fa-regular fa-swords"></i>
            </a>
            <a data-action="rollSkill" data-category-key="{{categkey}}" data-skill-key="{{skillkey}}">
              <i class="fa-solid fa-dice-d6"></i>
              {{localize skill.name}}
            </a>
          </span>
          <select class="item-field-skill-level"
            name="system.skills.{{categkey}}.skilllist.{{skillkey}}.value"
            title="{{localize "ECRY.ui.transcendenceCurrent"}}">
            {{selectOptions @root.config.skillLevel selected=skill.value}}
          </select>
          <span class="skill-separator">/</span>
          <select class="item-field-skill-level"
            name="system.skills.{{categkey}}.skilllist.{{skillkey}}.max"
            title="{{localize "ECRY.ui.transcendenceMax"}}"
            {{#unless @root.editScore}}disabled{{/unless}}>
            {{selectOptions @root.config.skillLevel selected=skill.max}}
          </select>
        </li>
        <li class="item flexrow list-item">
          <ul class="ul-level1">
            {{#each skill.spec as |spec idx|}}
            <li class="item flexrow list-item" data-item-id="{{spec._id}}" data-item-type="specialization">
              <a data-action="rollSpec" data-category-key="{{categkey}}" data-skill-key="{{skillkey}}" data-spec-id="{{spec._id}}">
                <i class="fa-solid fa-dice-d6"></i>
                {{spec.name}}
              </a>
              <div class="item-controls item-controls-fixed">
                <a data-action="itemEdit" data-item-id="{{spec._id}}" title="{{localize 'ECRY.ui.edit'}}"><i class="fas fa-edit"></i></a>
                <a data-action="itemDelete" data-item-id="{{spec._id}}" title="{{localize 'ECRY.ui.delete'}}"><i class="fas fa-trash"></i></a>
              </div>
            </li>
            {{/each}}
          </ul>
        </li>
        {{/each}}

      </ul>
    </div>
    {{/each}}

  </div>

  <div class="skill-toolbar">
    <a data-action="lockUnlock" title="{{localize "ECRY.ui.toggleEditMax"}}">
      <i class="fas {{#if @root.editScore}}fa-lock-open{{else}}fa-lock{{/if}}"></i>
      {{localize "ECRY.ui.toggleEditMax"}}
    </a>
  </div>

</section>
