<form class="{{cssClass}} flexcol-coc7" autocomplete="off">
  <header class="sheet-header flexrow-coc7" style="flex: 0 0 64px;padding-bottom: 2px;">
    <div class="header-details flexrow-coc7">
      <h1 class="name" style="height: 48px;">
        <input name="name" type="text" value="{{item.name}}" placeholder="{{localize 'CoC7.Name'}}" />
      </h1>

      <ul class="summary flexrow-coc7">
        <li class="flex2">
          <input type="text" name="system.source" value="{{data.system.source}}" placeholder="{{localize 'CoC7.Source'}}" />
        </li>
      </ul>

    </div>
    <img class="profile" src="{{item.img}}" data-edit="img" title="{{item.name}}" height="64" width="64" />
  </header>

  {{!-- Item Sheet Navigation --}}
  <nav style="flex: 0 0 24px;margin-bottom: 4px;font-family: 'Modesto Condensed', 'Palatino Linotype', serif;font-size: 16px;font-weight: 700;" class="sheet-navigation tabs" data-group="primary">
    <a style="line-height: 24px;" class="item active" data-tab="description">{{localize 'CoC7.Description'}}</a>
    <a style="line-height: 24px;" class="item" data-tab="details">{{localize 'CoC7.Details'}}</a>
    {{#if data.system.enableCharacterisitics}}<a style="line-height: 24px;" class="item" data-tab="characteristics">{{localize 'CoC7.Characteristics'}}</a>{{/if}}
    <a style="line-height: 24px;" class="item" data-tab="skills">{{localize 'CoC7.Skills'}}</a>
    {{#if isKeeper}}
      <a style="line-height: 24px;" class="item keeper-only-tab" data-tab="keeper" title="{{localize 'CoC7.GmNotes'}}"><i class="game-icon game-icon-tentacles-skull"></i></a>
    {{/if}}
  </nav>

  {{!-- Item Sheet Body --}}
  <section style="overflow: hidden;flex: 1;" class="sheet-body">

    {{!-- Description Tab --}}
    <div class="tab flexrow-coc7 active" data-group="primary" data-tab="description">

      <div class="item-properties">
        <ol class="properties-list">
          {{#each _eras as |era key|}}
            {{#if era.isEnabled}}
              <li>{{era.name}}</li>
            {{/if}}
          {{/each}}
        </ol>
      </div>

      {{editor enrichedDescriptionValue target="system.description.value" engine="prosemirror" button=true owner=owner editable=editable}}
    </div>

    {{!-- Details Tab --}}
    <div class="tab details" data-group="primary" data-tab="details">

      <div class="form-group">
        <label class="checkbox">
          <input type="checkbox" name="system.enableCharacterisitics" {{checked data.system.enableCharacterisitics}} /> {{localize 'CoC7.EnableCharacteristics'}}
        </label>
      </div>

      <h3 class="form-header">{{localize 'CoC7.Eras'}}</h3>
      <div class="skill-attributes" style="margin-bottom: 6px;" data-set="eras">
        {{#each _eras as |era key|}}
          <span class="toggle-switch {{#if era.isEnabled}} switched-on {{/if}}" data-property="{{era.id}}">{{localize era.name}}</span>
        {{/each}}
      </div>

      <h3 class="form-header">
        {{localize 'CoC7.MonetaryTitle'}}
        <a class="item-control add-monetary"><i class="fas fa-plus"></i></a>
      </h3>
      <div class="cash-assets">
        <div class="form-group">
          <label>{{localize 'CoC7.MonetaryFormatTitle'}}</label>
          <select name="system.monetary.format">
            {{selectOptions _monetaryFormats selected=data.system.monetary.format valueAttr="key" nameAttr="key" labelAttr="val"}}
          </select>
        </div>
        {{#if showCurrencySymbol}}
          <div class="form-group">
            <label>{{localize 'CoC7.MonetarySymbol'}}</label>
            <input type="text" name="system.monetary.symbol" value="{{data.system.monetary.symbol}}">
          </div>
        {{/if}}
        {{#each data.system.monetary.values as |value index|}}
          <div class="flexrow-coc7 form-group item" data-index="{{index}}">
            <input name="system.monetary.values.{{index}}.name" value="{{localize value.name}}" type="text" placeholder="{{localize 'CoC7.Name'}}">
            <input name="system.monetary.values.{{index}}.min" value="{{value.min}}" class="cash-assets-range" type="number" placeholder="{{localize 'CoC7.MonetaryCreditRatingMin'}}">
            <input name="system.monetary.values.{{index}}.max" value="{{value.max}}" class="cash-assets-range" type="number" placeholder="{{localize 'CoC7.MonetaryCreditRatingMax'}}">
            <select name="system.monetary.values.{{index}}.cashType" class="cash-assets-type">
              {{selectOptions ../_monetaryTypes selected=value.cashType valueAttr="key" nameAttr="key" labelAttr="val"}}
            </select>
            <input name="system.monetary.values.{{index}}.cashValue" value="{{value.cashValue}}" type="number" placeholder="{{localize 'CoC7.MonetaryValueCash'}}">
            <select name="system.monetary.values.{{index}}.assetsType" class="cash-assets-type">
              {{selectOptions ../_monetaryTypes selected=value.assetsType valueAttr="key" nameAttr="key" labelAttr="val"}}
            </select>
            <input name="system.monetary.values.{{index}}.assetsValue" value="{{value.assetsValue}}" type="number" placeholder="{{localize 'CoC7.MonetaryValueAssets'}}">
            <select name="system.monetary.values.{{index}}.spendingType" class="cash-assets-type">
              {{selectOptions ../_monetaryTypes selected=value.spendingType valueAttr="key" nameAttr="key" labelAttr="val"}}
            </select>
            <input name="system.monetary.values.{{index}}.spendingValue" value="{{value.spendingValue}}" type="number" placeholder="{{localize 'CoC7.MonetaryValueSpendingLevel'}}">
            <a class="item-control remove-monetary"><i class="fas fa-minus"></i></a>
          </div>
        {{/each}}
      </div>

      {{#if oneBlockBackStory}}
        <h3 class="form-header">
          {{localize 'CoC7.Background'}}
        </h3>
        <div class="backstory-editor">
          {{editor enrichedBackstory target="system.backstory" engine="prosemirror" button=true owner=owner editable=editable}}
        </div>
      {{else}}
        <h3 class="form-header">
          {{localize 'CoC7.BioSections'}}
          <a class="item-control add-bio"><i class="fas fa-plus"></i></a>
        </h3>
        {{#each data.system.bioSections as |value index|}}
          <div class="form-group item" data-index="{{index}}">
            <input type="text" name="system.bioSections.{{index}}" value="{{localize value}}" placeholder="{{localize 'CoC7.BioSectionName'}}" />
            <a class="item-control remove-section"><i class="fas fa-minus" style="line-height: 20px;"></i></a>
          </div>
        {{/each}}
      {{/if}}

      <div class='droppable main-skills'>
        <h3 class="form-header">{{localize 'CoC7.Items'}}</h3>

        {{#if itemsListEmpty}}
          <h3 class="warning">{{localize 'CoC7.EmptyItemList'}}</h3>
        {{/if}}

        <ol class="item-list">
          {{#each otherItems as |item|}}
            <li class="item flexrow-coc7" data-item-id="{{item._id}}" data-cocid="{{item.flags.CoC7.cocidFlag.id}}">
              <div class="item-name flexrow-coc7">
                <h4>{{item.name}} ({{item.type}})</h4>
              </div>

              <div class="item-controls">
                <a class="item-control item-delete" title="{{localize 'CoC7.DeleteItem'}}"><i class="fas fa-trash"></i></a>
              </div>
            </li>
          {{/each}}
        </ol>
      </div>
    </div>
    <div class="tab details" data-group="primary" data-tab="skills">
      <div class='droppable main-skills'>

        <h3 class="form-header">{{localize 'CoC7.CommonSkills'}}</h3>

        {{#if skillListEmpty}}
          <h3 class="warning">{{localize 'CoC7.EmptySkillList'}}</h3>
        {{/if}}

        <ol class="item-list">
          {{#each skills as |skill|}}
            <li class="item flexrow-coc7" data-item-id="{{skill._id}}" data-cocid="{{skill.flags.CoC7.cocidFlag.id}}">
              <div class="item-name flexrow-coc7">
                <h4>{{skill.name}} ({{skill.system.base}}%)</h4>
              </div>

              <div class="item-controls">
                <a class="item-control item-delete" title="{{localize 'CoC7.DeleteItem'}}"><i class="fas fa-trash"></i></a>
              </div>
            </li>
          {{/each}}
        </ol>
      </div>
    </div>

    <div class="tab details" data-group="primary" data-tab="characteristics">
      <h3 class="form-header">{{localize 'CoC7.Characteristics'}}</h3>
      <div class="form-group">
        <label>{{localize 'CoC7.UsePoints'}}</label>
        <label class="checkbox" style="text-align: center;"><input type="checkbox" name="system.characteristics.points.enabled" {{checked data.system.characteristics.points.enabled}} /></label>
      </div>
      <div class="form-group">
        <label>{{localize 'CoC7.CharacteristicsPoints'}}</label>
        <input type="text" name="system.characteristics.points.value" value="{{data.system.characteristics.points.value}}" placeholder="{{localize 'CoC7.Value'}}" />
      </div>
      <p>&nbsp;</p>
      <h3 class="form-header">{{localize 'CoC7.Characteristics'}}</h3>
      <div class="form-group">
        <label>{{localize 'CoC7.UseRolls'}}</label>
        <label class="checkbox" style="text-align: center;"><input type="checkbox" name="system.characteristics.rolls.enabled" {{checked data.system.characteristics.rolls.enabled}} /></label>
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Strengh'}}</label>
        <input type="text" name="system.characteristics.rolls.str" value="{{data.system.characteristics.rolls.str}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Constitution'}}</label>
        <input type="text" name="system.characteristics.rolls.con" value="{{data.system.characteristics.rolls.con}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Size'}}</label>
        <input type="text" name="system.characteristics.rolls.siz" value="{{data.system.characteristics.rolls.siz}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Dexterity'}}</label>
        <input type="text" name="system.characteristics.rolls.dex" value="{{data.system.characteristics.rolls.dex}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Appearance'}}</label>
        <input type="text" name="system.characteristics.rolls.app" value="{{data.system.characteristics.rolls.app}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Intelligence'}}</label>
        <input type="text" name="system.characteristics.rolls.int" value="{{data.system.characteristics.rolls.int}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Power'}}</label>
        <input type="text" name="system.characteristics.rolls.pow" value="{{data.system.characteristics.rolls.pow}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CHARAC.Education'}}</label>
        <input type="text" name="system.characteristics.rolls.edu" value="{{data.system.characteristics.rolls.edu}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
      <div class="form-group">
        <label>{{localize 'CoC7.Luck'}}</label>
        <input type="text" name="system.characteristics.rolls.luck" value="{{data.system.characteristics.rolls.luck}}" data-dtype="String" placeholder="{{localize 'CoC7.EnterFormula'}}" />
      </div>
    </div>
    {{#if isKeeper}}
      <div class="tab keeper flexcol-coc7" style="border-top: 2px groove #eeede0;padding: 0 5px;" data-group="primary" data-tab="keeper">
        {{editor enrichedDescriptionKeeper target="system.description.keeper" engine="prosemirror" button=true owner=owner editable=editable}}
      </div>
    {{/if}}
  </section>
</form>