<div class="flexrow-coc7">
  <div class="header-buttons"></div>
  <h2>{{localize 'CoC7.Skills'}}</h2>
  <div class="header-buttons">
    {{#unless data.system.flags.locked}}
      <a class="add-item" data-type="skill" title='{{localize "CoC7.AddSkill"}}'><i class="fas fa-plus"></i></a>
    {{/unless}}
    <a class="toggle-list-mode" title='{{#if skillListModeValue}}{{localize "CoC7.SortBySkillName"}}{{else}}{{localize "CoC7.SortBySkillValue"}}{{/if}}'><i class="fas {{#if skillListModeValue}}fa-sort-alpha-down{{else}}fa-sort-amount-down{{/if}}"></i></a>
    <a class="toggle-uncommon-mode" title='{{#if skillShowUncommon}}{{localize "CoC7.UncommonSkillsShow"}}{{else}}{{localize "CoC7.UncommonSkillsHide"}}{{/if}}'><i class="fas {{#if skillShowUncommon}}fa-toggle-on{{else}}fa-toggle-off{{/if}}"></i></a>
  </div>
</div>
{{#if skillListEmpty}}
  <h3 class="warning no-skills-warning">{{localize 'CoC7.EmptyCharacterSkillList'}}</h3>
{{/if}}

<ol class="item-list{{#if showPartValues}} show-part-values{{/if}}">
  {{#if skillListModeValue}}
    {{#each skillsByValue as |skill|}}
      <li class="item itemV2 skill flexrow-coc7" data-skill-id="{{skill._id}}" data-item-id="{{skill._id}}">
        <div class="item-image" style="background-image: url('{{skill.img}}')"></div>
        <div class="item-name skill-name rollable flex3" title="{{skill.name}}">{{skill.name}}</div>
        <div class="skill-value item-score">{{skill.system.value}}</div>
        <div class="skill-calc">({{calcHard skill.system.value 2}}/{{calcExtreme skill.system.value 1}})</div>
        <div class="skill-icons flex2">
          {{#unless skill.system.properties.noxpgain}}
            {{#if skill.system.flags.developement}}
              <a class="item-control development-flag active icon-upgrade"><i class="fas fa-circle-check"></i></a>
            {{else}}
              <a class="item-control development-flag icon-info"><i class="fa-light fa-circle"></i></a>
            {{/if}}
          {{/unless}}
          <a class="item-control item-popup icon-info" title="{{localize 'CoC7.SkillDetail'}}"><i class="fas fa-info-circle"></i></a>
        </div>
      </li>
    {{/each}}
  {{else}}
    {{#each skillList as |skill|}}
      {{#if skill.isSpecialization}}
        <li class="specialization-header flexrow-coc7"> {{skill.name}} </li>
      {{else}}
        <li class="item itemV2 skill flexrow-coc7 {{#if skill.system.properties.special}}specialization{{/if}}" data-skill-id="{{skill._id}}" data-item-id="{{skill._id}}">
          <div class="item-image" style="background-image: url('{{skill.img}}')"></div>
          {{#if ../data.system.flags.locked}}
            <div class="item-name skill-name rollable flex1">{{#if skill.system.properties.special}}{{skill.system.skillName}}{{else}}{{skill.name}}{{/if}}</div>
            <div class="skill-value item-score">{{skill.system.value}}</div>
            <div class="skill-calc">({{calcHard skill.system.value 2}}/{{calcExtreme skill.system.value 1}})</div>
            <div class="skill-icons">
              {{#unless skill.system.properties.noxpgain}}
                {{#if skill.system.flags.developement}}
                  <a class="item-control development-flag active icon-upgrade"><i class="fas fa-circle-check"></i></a>
                {{else}}
                  <a class="item-control development-flag icon-info"><i class="fa-light fa-circle"></i></a>
                {{/if}}
              {{/unless}}
              <a class="item-control item-popup" title="{{localize 'CoC7.SkillDetail'}}"><i class="fas fa-info-circle"></i></a>
            </div>
          {{else}}
            <div class="item-name">
              <input class="skill-name" type="text" value="{{#if skill.system.properties.special}}{{skill.system.skillName}}{{else}}{{skill.name}}{{/if}}" data-dtype="String">
            </div>
            <input class="npc-skill-score" type="text" value="{{skill.system.rawValue}}" data-dtype="Number">
            <div class="item-controls">
              <a class="item-control item-edit" title="{{localize 'CoC7.EditSkill'}}"><i class="fas fa-edit"></i></a>
              <a class="item-control item-delete" title="{{localize 'CoC7.DeleteSkill'}}"><i class="fas fa-trash"></i></a>
            </div>
          {{/if}}
        </li>
      {{/if}}
    {{/each}}
  {{/if}}
</ol>