<div id='encumbrance' class='gga-tableheader'>
  <div class='header encHeader'>
    {{#if ../isEditing}}
      <div class='enchead'>
        <span>{{localize 'GURPS.encumbranceMoveDodge'}}</span>
      </div>
      <div class='option'>
        <input id='showflightmove' type='checkbox' {{checked system.additionalresources.showflightmove}} />
        <label for='showflightmove'>{{localize 'GURPS.showFlightMove'}}</label>
      </div>
    {{else}}
      <div>
        {{localize 'GURPS.encumbranceMoveDodge'}}
      </div>
    {{/if}}
    <div style='margin-left: 5px'>
      {{#if (automaticEncumbrance)}}
        <i class='fa fa-lock' title='{{localize "GURPS.autoEncumbrance"}}: ON'></i>
      {{else}}
        <i class='fa fa-unlock' style='color: coral' title='{{localize "GURPS.autoEncumbrance"}}: OFF'></i>
      {{/if}}
    </div>
  </div>

  <div class='encmarker header'></div>
  <div class='enc header'>{{localize 'GURPS.level'}}</div>
  <div class='load header'>{{localize 'GURPS.maxload'}}</div>
  <div class='move header'>{{localize 'GURPS.move'}}</div>
  <div class='dodge header'>{{localize 'GURPS.dodge'}}</div>

  {{#each system.encumbrance}}
    <div class='encmarker {{include-if current "current"}}'></div>
    <div
      class='enc {{include-if current "current"}} {{key}} {{include-if (not (automaticEncumbrance)) "clickable"}}'
      data-key='{{@key}}'
    >
      {{{localizeKey (concat 'GURPS.encumbranceLevel-' @key)}}}
    </div>
    <div class='load gga-right {{include-if current "current"}}'>
      {{#if ../isEditing}}
        <input name='system.encumbrance.{{@key}}.weight' class='gcs-input' type='text' value='{{weight}}' />
      {{else}}
        {{displayDecimal weight number=1 removeZeros=true}}
      {{/if}}
    </div>
    <div class='move flex-center {{include-if current "current"}}'>
      {{#if ../isEditing}}
        <input name='system.encumbrance.{{@key}}.move' class='gcs-input' type='text' value='{{move}}' />
      {{else}}
        {{currentmovedisplay}}
      {{/if}}
    </div>
    {{#if ../isEditing}}
      <div class='dodge flex-center {{include-if current "current"}}'>
        <input name='system.encumbrance.{{@key}}.dodge' class='gcs-input' type='text' value='{{dodge}}' />
      </div>
    {{else}}
      <div class='dodge flex-center {{include-if current "current"}}' data-path='dodge'>
        {{#if current}}
          <span class='flex-center {{include-if current "rollable"}}' data-otf='Dodge'>{{currentdodge}}</span>
        {{else}}
          <span class='flex-center {{include-if current "rollable"}}'>{{currentdodge}}</span>
        {{/if}}
        {{#if ../system.defenses.dodge.bonus}}
          {{#if current}}
            <span
              class='flex-center bonus {{include-if current "rollable"}}'
              data-otf='Dodge {{{displayNumber ../system.defenses.dodge.bonus}}} DB'
            >
              {{{displayNumber ../system.defenses.dodge.bonus}}}</span>
          {{else}}
            <span class='flex-center bonus {{include-if current "rollable"}}'>
              {{{displayNumber ../system.defenses.dodge.bonus}}}</span>
          {{/if}}
        {{/if}}
      </div>
    {{/if}}
  {{/each}}

  <div id='move-mode-pair' class='label-field-pair header'>
    <div class='label' for='move-mode'>{{localize 'GURPS.moveMode'}}:</div>
    <div class='field' style='border: none'>
      <select id='move-mode' {{disabled (or isEditing (lt (length system.move) 2))}}>
        {{#each system.move as |this key|}}
          <option value='{{@key}}' {{select-if this.default true}}>{{localize this.mode}}</option>
        {{/each}}
      </select>
    </div>
    {{#if isEditing}}
      <button id='edit-move-modes' style='padding-bottom: 1px;'><i class='fas fa-pen'></i></button>
    {{/if}}
  </div>
</div>