<form class="{{cssClass}}" autocomplete="off">

    {{!-- Sheet Header --}}
    <header class="sheet-header">
      <div class="header-fields">
        <div class="flexrow">
          <img class="profile-img" src="{{img}}" data-edit="img" title="{{name}}" />
          <h1 class="charname"><input name="name" type="text" value="{{name}}" placeholder="Name"/></h1>
        </div>
        <div class="flexrow">
          <ul class="flex-group-center flex-compteurs">
            <li>
              <label class="compteur">
                <a class="jet-vie">Vie</a>
                <a class="vie-moins"><i class="fas fa-minus-square"></i></a>
                <input class="resource-content" type="text" name="system.sante.vie.value" value="{{system.sante.vie.value}}" data-dtype="Number"/>
                <span>/ {{system.sante.vie.max}}</span>
                <a class="vie-plus"><i class="fas fa-plus-square"></i></a>
              </label>
            </li>
            <li>
              <label class="compteur">
                <a class="jet-endurance">Endurance</a>
                <a class="endurance-moins"><i class="fas fa-minus-square"></i></a>
                <input class="resource-content" type="text" name="system.sante.endurance.value" value="{{system.sante.endurance.value}}" data-dtype="Number"/>
                <span>/ {{system.sante.endurance.max}}</span>
                <a class="endurance-plus"><i class="fas fa-plus-square"></i></a>
              </label>
            </li>
            <li>
              <label class="appliquerFatigue compteur tooltip">
                <span class="tooltiptext ttt-fatigue">{{{calc.fatigue.html}}}</span>
                Fatigue
                <a class="fatigue-moins"><i class="fas fa-minus-square"></i></a>
                <input class="resource-content" id="fatigue-value" type="text" name="system.sante.fatigue.value" value="{{system.sante.fatigue.value}}" data-dtype="Number" />
                <span>/ {{system.sante.fatigue.max}}</span>
                <a class="fatigue-plus"><i class="fas fa-plus-square"></i></a>
              </label>
            </li>
            <li>
              <label class="compteur">
                <span class="ptreve-actuel"><a>Rêve</a></span>
                <a class="ptreve-actuel-moins"><i class="fas fa-minus-square"></i></a>
                <input class="resource-content" id="pointsreve-value" type="text" name="system.reve.reve.value" value="{{system.reve.reve.value}}" data-dtype="Number" />
                <span>/ {{system.reve.seuil.value}}</span>
                <a class="ptreve-actuel-plus"><i class="fas fa-plus-square"></i></a>
              </label>
            </li>
          </ul>
          <div class="flex-group-center  flex-actions-bar">
            <div>
              <span class="encaisser-direct"><a title="Encaisser des dommages"><img class="button-img" src="icons/svg/bones.svg" alt="Encaisser des dommages"/></a></span>
              <span class="gm-only remise-a-neuf"><a title="Remise à neuf"><img class="button-img" src="icons/svg/regen.svg" alt="Remise à neuf"/></a></span>
              <span class="repos"><a title="Repos"><img class="button-img" src="icons/svg/sleep.svg" alt="Se reposer"/></a></span>
              {{#if system.attributs.hautrevant.value}}
              <span class="monte-tmr"><a title="Montée dans les Terres M&eacute;dianes !" {{#if hautreve.isDemiReve}}disabled{{/if}}><img class="button-img" src="systems/foundryvtt-reve-de-dragon/styles/img/ui/icon-tmr-normal.svg" alt="Montée dans les Terres M&eacute;dianes !"/></a></span>
              <span class="monte-tmr-rapide"><a title="Montée accélérée dans les Terres M&eacute;dianes !"><img class="button-img" src="systems/foundryvtt-reve-de-dragon/styles/img/ui/icon-tmr-rapide.svg" alt="Montée accélérée dans les Terres M&eacute;dianes !"/></a></span>
              <span class="visu-tmr"><a title="Regarder les Terres M&eacute;dianes"><img class="button-img" src="systems/foundryvtt-reve-de-dragon/styles/img/ui/icon-tmr-view.svg" alt="Regarder les Terres M&eacute;dianes"/></a></span>
              {{/if}}
            </div>
            <div class="flexrow">
              <span class="appliquerFatigue tooltip tooltip-dotted">Malus de fatigue : {{calc.fatigue.malus}}
                <span class="tooltiptext ttt-fatigue">{{{calc.fatigue.html}}}</span>
              </span>
              <span>{{calc.resumeBlessures}}</span>
            </div>
            <div class="flexrow">
              <span>{{system.compteurs.etat.label}}: {{system.compteurs.etat.value}}</span>
              <span>{{system.compteurs.surenc.label}}: {{system.compteurs.surenc.value}}</span>
            </div>
            <div class="flexrow">
              {{>"systems/foundryvtt-reve-de-dragon/templates/actor/effects.html"}}
            </div>
          </div>
        </div>
      </div>
    </header>

    {{!-- Sheet Tab Navigation --}}
    <nav class="sheet-tabs tabs" data-group="primary">
        <a class="item" data-tab="carac">Carac.</a>
        <a class="item" data-tab="competences">Compétences</a>
        <a class="item" data-tab="combat">Combat</a>
        <a class="item" data-tab="connaissances">Savoirs&Taches</a>
        <a class="item" data-tab="hautreve">Haut-Rêve</a>
        <a class="item" data-tab="items">Équipement</a>
        <a class="item" data-tab="description">Description</a>
    </nav>

    {{!-- Sheet Body --}}
    <section class="sheet-body">

        {{!-- Carac Tab --}}
        <div class="tab items" data-group="primary" data-tab="carac">
          <div class="flexrow">
            <span><a class="vue-detaillee">
              <i class="fas {{#if options.vueDetaillee}}fa-eye-slash{{else}}fa-eye{{/if}}"></i>
              {{#if options.vueDetaillee}}Vue simplifiée{{else}}Vue détaillée{{/if}}</a>
            </span>
          </div>
          <div class="grid grid-2col">
            <div class="flex-group-left flexcol">
              <ul class="carac-list alterne-list">
                {{#each system.carac as |carac key|}}
                    {{#if carac.isLevelUp}}
                    <li class="caracteristique flexrow item-list xp-level-up" data-attribute="{{key}}">
                    {{else}}
                    <li class="caracteristique flexrow list-item" data-attribute="{{key}}">
                    {{/if}}
                    {{#if (eq key 'taille')}}
                      <span class="carac-label" name="system.carac.{{key}}.label">{{carac.label}}</span>
                      <input class="carac-value" type="text" name="system.carac.{{key}}.value" value="{{carac.value}}" data-dtype="{{carac.type}}" {{#unless @root.options.vueDetaillee}}disabled{{/unless}} />
                      <label class="carac-xp"/>
                    {{else}}
                        {{#if carac.derivee}}
                        <span class="carac-label" name="system.carac.{{key}}.label"> <a name={{key}}>{{carac.label}}</a></span>
                        <label class="competence-value">{{carac.value}}</label>
                        <label class="carac-xp"/>
                        {{else}}
                          {{#if carac.isLevelUp}}
                            <span class="carac-label tooltip" name="system.carac.{{key}}.label">
                              <span class="tooltiptext ttt-xp">
                              Vous pouvez dépenser {{carac.xpNext}} points d'Experience pour augmenter de 1 votre caractéristique {{carac.label}}
                            </span>
                            <a name={{key}}>{{carac.label}}</a></span>
                          {{else}}
                            <span class="carac-label tooltip" name="system.carac.{{key}}.label"><a name={{key}}>{{carac.label}}</a></span>
                          {{/if}}
                          <input class="carac-value" type="text" name="system.carac.{{key}}.value" value="{{carac.value}}" data-dtype="{{carac.type}}" {{#unless @root.options.vueDetaillee}}disabled{{/unless}} />
                          <span class="carac-xp tooltip">
                          <input class="carac-xp" type="text" name="system.carac.{{key}}.xp" value="{{carac.xp}}" data-dtype="number" {{#unless @root.options.vueDetaillee}}disabled{{/unless}} />
                          <span class="tooltiptext ttt-xp">Vous devez acquérir {{carac.xpNext}} points d'Experience pour augmenter de 1 votre {{carac.label}}</span>      
                          </span>
                          {{#if carac.isLevelUp}}
                          <a class="carac-xp-augmenter" name="augmenter.{{key}}" title="Augmenter">
                            <i class="fas fa-arrow-alt-circle-up"></i>
                          </a>
                          {{/if}}
                        {{/if}}
                    {{/if}}
                    </li>
                {{/each}}
                <li class="caracteristique flexrow">
                  <span class="carac-label" name="carac-total">Total Caractéristiques </span>
                  <span class="competence-value total" name="carac-total-value">{{calc.caracTotal}} </span>
                </li>
              </ul>
            </div>
            <div class="flex-group-left flexcol" >
              <ul class="carac-list">
                <li class="caracteristique flexrow list-item">
                  <span class="carac-label" name="beaute">Beauté&nbsp;:</span>
                  <input class="description-value" type="text" name="system.beaute" value="{{system.beaute}}" data-dtype="String" {{#unless @root.options.vueDetaillee}}disabled{{/unless}}/>
                  <label class="carac-xp"/>
                </li>
                {{#each system.attributs as |attr key|}}
                {{#unless (eq key 'hautrevant')}}
                <li class="caracteristique flexrow  list-item" data-attribute="{{key}}">
                  <span class="carac-label" name="system.attributs.{{key}}.label">{{attr.label}}&nbsp;:</span>
                  {{#if (eq key 'protection')}}
                  <input class="description-value" id="attribut-protection-edit" type="text" name="{{key}}" value="{{attr.value}}" data-dtype="number"/>
                  {{else}}
                  <input class="description-value" type="text" disabled name="system.attributs.{{key}}." value="{{attr.value}}" data-dtype="number"/>
                  {{/if}}
                  <label class="carac-xp"/>
                </li>
                {{/unless}}
                {{/each}}
              </ul>
              <ul class="carac-list alterne-list">
                <li class="caracteristique flexrow list-item">
                  <span class="attribut-label chance-actuelle"><a>Chance actuelle</a></span>
                  <input class="description-value compteur-edit" type="text" name="chance" value="{{system.compteurs.chance.value}}" data-dtype="number"/>
                  <span class="utiliser-attribut" style="padding-left: 5px"><a class="chance-appel">Utiliser</a></span>
                </li>
                {{#each system.compteurs as |compteur key|}}
                  {{#if (eq compteur.label 'Chance')}}
                  {{else if (eq compteur.label 'Experience')}}
                  {{else if compteur.isInput}}
                    <li class="caracteristique flexrow list-item">
                      <span class="attribut-label">{{compteur.label}}</span>
                      {{#if (eq compteur.label 'Ethylisme')}}
                      <select class="description-value" name="system.compteurs.ethylisme.value" id="ethylisme" data-dtype="Number">
                        {{#select compteur.value}}
                        {{>"systems/foundryvtt-reve-de-dragon/templates/niveau-ethylisme.html"}}
                        {{/select}}
                      </select>          
                      {{else}}
                      <input class="description-value compteur-edit" id="{{key}}-edit" type="text" name="{{key}}" value="{{compteur.value}}" data-dtype="number"/>
                      {{/if}}
                      <span class="utiliser-attribut" style="padding-left: 5px">
                        {{#if compteur.isStress}}
                        <a class="stress-test" title="Transformer">Transformer</a>
                        {{else if (eq compteur.label 'Ethylisme')}}
                        <a class="ethylisme-test" id="ethylisme-test" title="Jet d'Ethylisme">Boire</a>
                        {{else if (eq compteur.label 'Moral')}}
                        <a class="moral-malheureux" title="Jet de moral situation malheureuse"><img class="small-button-container" src="systems/foundryvtt-reve-de-dragon/icons/moral-malheureux.svg" alt="Jet de moral situation malheureuse"/></a>
                        <a class="moral-neutre" title="Jet de moral situation neutre"><img class="small-button-container" src="systems/foundryvtt-reve-de-dragon/icons/moral-neutre.svg" alt="Jet de moral situation neutre"/></a>
                        <a class="moral-heureux" title="Jet de moral situation heureuse"><img class="small-button-container" src="systems/foundryvtt-reve-de-dragon/icons/moral-heureux.svg" alt="Jet de moral situation heureuse"/></a>
                        {{else}}
                        <label></label>
                      {{/if}}
                      </span>
                    </li>
                  {{/if}}
                {{/each}}
              </ul>
<!--              <ul class="carac-list"></ul>-->
            </div>
          </div>
        </div>
        
        {{!-- Compétences Tab --}}
        <div class="tab competences" data-group="primary" data-tab="competences">
          <div class="flexrow">
            <span><a class="vue-detaillee">
              <i class="fas {{#if options.vueDetaillee}}fa-eye-slash{{else}}fa-eye{{/if}}"></i>
              {{#if options.vueDetaillee}}Vue simplifiée{{else}}Vue détaillée{{/if}}</a>
            </span>
            <span><a class="show-hide-competences"><img class="small-button-container"
              src="systems/foundryvtt-reve-de-dragon/icons/{{#if options.showCompNiveauBase}}no-filter.svg{{else}}filter.svg{{/if}}" alt="filter/montrer tout">
              {{#if options.showCompNiveauBase}}Montrer tout{{else}}Filtrer{{/if}}</a>
            </span>
            <span class="flexrow">
              <i class="fas fa-search flex-shrink"></i>
              <input class="recherche flex-grow" type="text" value="{{options.recherche.text}}" name="recherche" 
              size="8" data-dtype="String" placeholder="chercher"/>
            </span>
          </div>
          <div class="grid grid-2col">
            <div class="flex-group-left flexcol competence-column">
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.generale) categorie="Compétences générales"}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.particuliere) categorie="Compétences Particulières"}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.specialisee) categorie="Compétences Spécialisées"}}
            </div>

            <div class="flex-group-left flexcol competence-column">
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.melee) categorie="Compétences de Mêlée"}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.tir) categorie="Compétences de Tir"}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.lancer) categorie="Compétences de Lancer"}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.connaissance) categorie="Connaissances"}}
              {{#if (or system.attributs.hautrevant.value options.vueDetaillee)}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/categorie-competences.html" competences=(filtreTriCompetences byCateg.draconic) categorie="Draconic"}}
              {{/if}}
              {{> "systems/foundryvtt-reve-de-dragon/templates/actor/xp-competences.html"}}
            </div>
          </div>
        </div>

        {{!-- 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>
      
      {{!-- Connaissances Tab --}}
      <div class="tab connaissances" data-group="primary" data-tab="connaissances">
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/taches.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>
      
      {{!-- 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>

      {{!-- Equipment Tab --}}
      <div class="tab items" data-group="primary" data-tab="items">
        
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/inventaire.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-animaux.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-suivants.html"}}
        {{> "systems/foundryvtt-reve-de-dragon/templates/actor/liens-vehicules.html"}}

      </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.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.taille">Taille :</label>
              <input class="flex-grow" type="text" name="system.taille" value="{{system.taille}}" data-dtype="String"/>
            </li>
          </ul>
          <ul class="item-list alterne-list">
            <li class="item flexrow list-item">
              <label for="system.main">Main directrice :</label>
              <input type="text" name="system.main" value="{{system.main}}" data-dtype="String"/>
            </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/heures-select-option.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>
          </ul>
        </article>

        <article class="flexcol">
          <h3>Biographie : </h3>
          <div class="form-group editor">
            {{editor biographie target="system.biographie" button=true owner=owner editable=editable}}
          </div>
          <h3>Notes : </h3>
          <div class="form-group editor">
            {{editor notes target="system.notes" button=true owner=owner editable=editable}}
          </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>