<form class="{{cssClass}}" autocomplete="off">
  {{>'systems/foundryvtt-reve-de-dragon/templates/scripts/autocomplete-script.hbs'}}

    {{!-- Sheet Header --}}
    <header class="sheet-header">
      <div class="header-fields">
        <div class="flexcol">
          <div class="flexrow">
            <h1 class="charname"><input name="name" type="text" value="{{name}}" placeholder="Name"/></h1>
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/header-buttons.html"}}
          </div>
          <div class="flexrow">
            <img class="profile-img" src="{{img}}" data-edit="img" data-tooltip="{{name}}" />
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/header-compteurs.html"}}
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/header-etat.html"}}
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/header-hautreve.html"}}
          </div>
        </div>
      </div>
    </header>

    {{!-- Sheet Tab Navigation --}}
    <nav class="sheet-tabs tabs" data-group="primary">
      {{#if options.isObserver}}
      <a class="item" data-tab="carac" data-tooltip="Caractéristiques">Carac.</a>
      <a class="item" data-tab="competences" data-tooltip="Caractéristiques">Compétences</a>
      <a class="item" data-tab="combat" data-tooltip="Combat et santé">Combat</a>
      <a class="item" data-tab="connaissances" data-tooltip="Savoirs et tâches">Savoirs&Taches</a>
      <a class="item" data-tab="hautreve" data-tooltip="Haut-rêve">Haut-Rêve</a>
      {{/if}}
      <a class="item" data-tab="items" data-tooltip="Liste d'équipement">Équipement</a>
      <a class="item" data-tab="description" data-tooltip="Description et compagnons">Description</a>
    </nav>

    {{!-- Sheet Body --}}
    <section class="sheet-body">
      {{#if options.isObserver}}{{!-- Carac Tab --}}
      <div class="tab items" data-group="primary" data-tab="carac">
        <div class="flexrow">
          {{>"systems/foundryvtt-reve-de-dragon/templates/actor/vue-detaillee.html"}}
        </div>
        <div class="grid grid-2col">
          <div class="flex-group-left flexcol">
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/carac-main.html"}}
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/carac-total.html"}}
          </div>
          <div class="flex-group-left flexcol" >
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/carac-derivee.html"}}
          </div>
        </div>
      </div>
      {{/if}}
      {{#if options.isObserver}}{{!-- Compétences Tab --}}
      <div class="tab competences" data-group="primary" data-tab="competences">
        <div class="flexrow">
          <span>
            {{>"systems/foundryvtt-reve-de-dragon/templates/actor/vue-detaillee.html"}}
          </span>
          <span class="flexrow"><a class="show-hide-competences">
            {{#if options.showCompNiveauBase}}
            <i class="fa-regular fa-filter-slash"></i> Montrer tout
            {{else}}
            <i class="fa-regular fa-filter"></i> Filtrer
            {{/if}}
          </a></span>
          <span class="embed-inline">
            <input class="recherche flex-grow" type="text" value="{{options.recherche.text}}" name="recherche" size="8" data-dtype="String" placeholder=""/>
          </span>
          <span>
            {{#if options.vueDetaillee}}
              &nbsp;&nbsp;
              {{#if @root.options.vueArchetype}}
              <a class="competence-archetype toggle-archetype chat-card-button-pushed" data-tooltip="Retour à la vue détaillée des compétences">
                <i class="fa-solid fa-up-right-from-square"></i>Incarnation
              </a>
              {{else}}
              <a class="competence-archetype toggle-archetype chat-card-button" data-tooltip="Gestion de l'archétype et de la réincarnation">
                <i class="fa-solid fa-people-line"></i>Archétype
              </a>
              {{/if}}
            {{/if}}
          </span>
        </div>
        <div class="grid {{#if (and options.vueDetaillee options.vueArchetype)}}grid-competence-archetype{{else}}grid-2col{{/if}}">
          <div class="competence-column">
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.generale) categorie="Compétences générales"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.particuliere) categorie="Compétences Particulières"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.specialisee) categorie="Compétences Spécialisées"}}
          </div>
          <div class="competence-column">
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/xp-competences.html"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.melee) categorie="Compétences de Mêlée"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.tir) categorie="Compétences de Tir"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.lancer) categorie="Compétences de Lancer"}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.connaissance) categorie="Connaissances"}}
            {{#if (or system.attributs.hautrevant.value options.vueDetaillee)}}
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/competence-categorie.html" competences=(filtreTriCompetences byCateg.draconic) categorie="Draconic"}}
            {{/if}}
          </div>
          {{#if (and options.vueDetaillee options.vueArchetype)}}
          <div>
            {{> "systems/foundryvtt-reve-de-dragon/templates/actor/archetype.hbs"}}
          </div>
          {{/if}}
        </div>
      </div>
      {{/if}}
      {{#if options.isObserver}}{{!-- Combat Tab --}}
      <div class="tab combat" data-group="primary" data-tab="combat">
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/combat.html"}}<hr>
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/blessures.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/maladies-poisons.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/possessions.html"}}
      </div>
      {{/if}}

      {{#if options.isObserver}}{{!-- Connaissances Tab --}}
      <div class="tab connaissances" data-group="primary" data-tab="connaissances">
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/astrologie.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/taches.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/chirurgie.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/oeuvres.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/jeux.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/alchimie.html"}}
      </div>
      {{/if}}
      {{#if options.isObserver}}{{!-- hautreve Tab --}}
      <div class="tab hautreve " data-group="primary" data-tab="hautreve" style="height:200px">
        <div>
          {{#if system.attributs.hautrevant.value}}
          <h3>Haut rêvant</h3>
          {{> "systems/foundryvtt-reve-de-dragon/templates/actor/haut-revant.html"}}
          {{else}}
          <h3>Vous n'avez pas le don de haut-rêve</h3>
          <p>Attribuer la Tête de Dragon 'Don de Haut Rêve' pour rendre le personnage Haut-Rêvant.</p>
          {{> "systems/foundryvtt-reve-de-dragon/templates/actor/non-haut-revant.html"}}
          {{/if}}
          <br><br>
        </div>
      </div>
      {{/if}}

      {{!-- Equipment Tab --}}
      <div class="tab items" data-group="primary" data-tab="items">
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/inventaire-monnaie.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/inventaire.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-animaux.hbs"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-vehicules.hbs"}}
      </div>
      
      {{!-- Biography Tab --}}
      <div class="tab biography" data-group="primary" data-tab="description">        
        <article class="flexrow">
          <ul class="item-list alterne-list">
            <li class="item flexrow list-item">
              <label for="system.race">Race :</label>
              <input class="flex-grow" type="text" name="system.race" value="{{system.race}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.sexe">Sexe :</label>
              <input class="flex-grow" type="text" name="system.sexe" value="{{system.sexe}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.age">Age :</label>
              <input class="flex-grow" type="text" name="system.age" value="{{system.age}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.taille">Taille :</label>
              <input class="flex-grow" type="text" name="system.taille" value="{{system.taille}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.poids">Poids :</label>
              <input class="flex-grow" type="text" name="system.poids" value="{{system.poids}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.metier">Métier :</label>
              <input class="flex-grow" type="text" name="system.metier" value="{{system.metier}}" data-dtype="String"/>
            </li>
          </ul>
          <ul class="item-list alterne-list">
            <li class="item flexrow list-item">
              <label for="system.main">Main directrice :</label>
              <div class="autocomplete">
                <input type="text" class="selection-main-directrice" name="system.main" value="{{system.main}}" data-dtype="String"/>
                {{>'systems/foundryvtt-reve-de-dragon/templates/scripts/autocomplete.hbs' proposals=options.mainsDirectrices className='selection-main-directrice'}}
              </div>
            </li>
            <li class="item flexrow list-item">
              <label for="system.heure">Heure de naissance :</label>
              <select type="text" name="system.heure" value="{{system.heure}}" data-dtype="String">
                {{#select system.heure}}
                {{>"systems/foundryvtt-reve-de-dragon/templates/enum-heures.html"}}
                {{/select}}
              </select>
            </li>
            <li class="item flexrow list-item">
              <label>Beauté :</label>
              <input type="text" value="{{system.beaute}}" data-dtype="String" disabled/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.cheveux">Cheveux :</label>
              <input class="flex-grow" type="text" name="system.cheveux" value="{{system.cheveux}}" data-dtype="String"/>
            </li>
            <li class="item flexrow list-item">
              <label for="system.yeux">Yeux :</label>
              <input class="flex-grow" type="text" name="system.yeux" value="{{system.yeux}}" data-dtype="String"/>
            </li>
            <a class="chat-card-button description-aleatoire" data-tooltip="Déterminer aléatoirement les détails de description">Description <i class="fa-solid fa-dice-d20"></i></a>
          </ul>
        </article>

        <article class="flexcol">
          {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-suivants.hbs"}}
        </article>

        <article class="flexcol">
          <h3>Biographie : </h3>
          <div class="form-group large-editor">
            {{editor biographie target="system.biographie" button=true owner=options.isOwner editable=options.editable engine="prosemirror"}}
          </div>
          <h3>Notes : </h3>
          <div class="form-group large-editor">
            {{editor notes target="system.notes" button=true owner=options.isOwner editable=options.editable engine="prosemirror"}}
          </div>
          {{> "systems/foundryvtt-reve-de-dragon/templates/actor/xp-journal.html"}}
          {{> "systems/foundryvtt-reve-de-dragon/templates/actor/editor-notes-mj.html"}}
        </article>
      </div>

    </section>
</form>