<section class="flexcol cde-sheet cde-actor {{cssClass}}">
  {{log 'actor-sheet' this}}

  <header class="cde-header cde-actor-header">
    <img class="profile-img" src="{{actor.img}}" data-action="editImage" data-edit="img" title="{{actor.name}}" />
    <div class="header-fields">
      <div class="cde-header-top">
        <h1 class="charname">
          <input name="name" type="text" value="{{actor.name}}" placeholder="{{ localize 'CDE.PCName' }}" />
        </h1>
        <button type="button" class="cde-icon-button click-prefs" title="{{ localize 'CDE.Preferences' }}">
          <i class="fas fa-gear"></i>
        </button>
      </div>
      <div class="cde-grid two">
        <div class="cde-field">
          <label>{{ localize "CDE.Concept" }}</label>
          <input type="text" name="system.concept" value="{{systemData.concept}}" placeholder="—" />
        </div>
        <div class="cde-field">
          <label>{{ localize "CDE.CelestialGuardian" }}</label>
          <select name="system.guardian">
            <option value="0" {{#if (eq systemData.guardian 0)}}selected{{/if}}>—</option>
            <option value="1" {{#if (eq systemData.guardian 1)}}selected{{/if}}>{{ localize "CDE.CelestialGuardian1" }}</option>
            <option value="2" {{#if (eq systemData.guardian 2)}}selected{{/if}}>{{ localize "CDE.CelestialGuardian2" }}</option>
            <option value="3" {{#if (eq systemData.guardian 3)}}selected{{/if}}>{{ localize "CDE.CelestialGuardian3" }}</option>
            <option value="4" {{#if (eq systemData.guardian 4)}}selected{{/if}}>{{ localize "CDE.CelestialGuardian4" }}</option>
            <option value="5" {{#if (eq systemData.guardian 5)}}selected{{/if}}>{{ localize "CDE.CelestialGuardian5" }}</option>
          </select>
        </div>
      </div>
      <div class="cde-quick-meta">
        <div class="cde-tag">
          <span class="cde-pill character">{{ localize "CDE.FatSi" }}</span>
          <span>Chroniques de l'Étrange</span>
        </div>
        <div class="cde-initiative-card">
          <div class="cde-initiative-header">
            <i class="fa-solid fa-bolt cde-initiative-icon"></i>
            <span class="cde-initiative-title">{{ localize "CDE.Initiative" }}</span>
          </div>
          <div class="cde-initiative-controls">
            <button
              type="button"
              class="click-initiative cde-init-btn cde-init-btn--minus"
              data-libel-id="minus"
              title="{{ localize 'CDE.MinusInitiative' }}"
            ><i class="fa-solid fa-chevron-down"></i></button>
            <div class="cde-initiative-values">
              <span class="cde-initiative-value">{{systemData.initiative}}</span>
              <span class="cde-anti-initiative-value"><i class="fa-solid fa-ranking-star"></i> {{systemData.anti_initiative}}</span>
            </div>
            <button
              type="button"
              class="click-initiative cde-init-btn cde-init-btn--roll"
              data-libel-id="create"
              title="{{ localize 'CDE.DeterminateInitiative' }}"
            ><i class="fa-solid fa-dice-d10"></i></button>
            <button
              type="button"
              class="click-initiative cde-init-btn cde-init-btn--plus"
              data-libel-id="plus"
              title="{{ localize 'CDE.PlusInitiative' }}"
            ><i class="fa-solid fa-chevron-up"></i></button>
          </div>
        </div>
      </div>
    </div>
  </header>

  <nav class="sheet-tabs tabs cde-neon-tabs" data-group="primary">
    <a class="item" data-action="tab" data-group="primary" data-tab="description">{{ localize "CDE.Description" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="nghang">{{ localize "CDE.NgHang" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="skills">{{ localize "CDE.Skills" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="treasures">{{ localize "CDE.Treasures" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="magics">{{ localize "CDE.Magics" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="kungfus">{{ localize "CDE.KungFu" }}</a>
    <a class="item" data-action="tab" data-group="primary" data-tab="items">{{ localize "CDE.Items" }}</a>
  </nav>

  <section class="sheet-body cde-tab-body">
    <div class="tab" data-group="primary" data-tab="description">
      <div class="cde-card cde-notes-editor">
        {{formInput systemFields.description enriched=descriptionHTML value=system.description name="system.description" toggled=true}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="nghang">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-nghang.html"}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="skills">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-skills.html"}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="treasures">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-treasures.html"}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="magics">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-magics.html"}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="kungfus">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-kungfus.html"}}
      </div>
    </div>

    <div class="tab" data-group="primary" data-tab="items">
      <div class="cde-card cde-data-table">
        {{> "systems/fvtt-chroniques-de-l-etrange/templates/actor/parts/cde-character-items.html"}}
      </div>
    </div>
  </section>
</section>
