<section>
  {{formGroup fields.icon value=appearance.icon localize=true}}
  {{formGroup fields.deactivate value=appearance.deactivate localize=true}}
  {{formGroup fields.icon_size value=appearance.icon_size localize=true}}

  <div class="combat-sidebar" id="preview-combat">
    <div class="themed theme-dark sidebar-tab combat-tracker" id="preview-combat">
      <div class="fake-combatant fake flexrow" style="border-color: {{appearance.player_color}}">
        <img class="token-image" src="icons/svg/mystery-man.svg" />
        <div class="token-name flexcol">
          <strong class="name">Icon Preview</strong>
          <div class="combatant-controls flexrow">
            <button
              type="button"
              class="inline-control combatant-control icon fa-solid fa-eye-slash"
            ></button>
            <button
              type="button"
              class="inline-control combatant-control icon fa-solid fa-skull"
            ></button>
            <button
              type="button"
              class="inline-control combatant-control icon fa-solid fa-bullseye-arrow"
            ></button>
          </div>
        </div>
        <div class="token-initiative">
          <a
            class="preview {{appearance.icon}}"
            style="color: {{appearance.player_color}}; font-size: {{appearance.icon_size}}rem"
          ></a>
        </div>
      </div>
    </div>
  </div>

  {{formGroup fields.player_color value=appearance.player_color localize=true}}
  {{formGroup fields.friendly_color value=appearance.friendly_color localize=true}}
  {{formGroup fields.neutral_color value=appearance.neutral_color localize=true}}
  {{formGroup fields.enemy_color value=appearance.enemy_color localize=true}}
  {{formGroup fields.secret_color value=appearance.secret_color localize=true}}
  {{formGroup fields.done_color value=appearance.done_color localize=true}}
</section>
