<i class="macroBtn pointer createicon fa-solid fa-square-plus item-create" title="{{localize "wod.labels.add.item"}}" aria-hidden="true" data-itemtype="All" data-origin="note"></i>

<div class="sheet-area flex-columns">
    <div class="headlineRow headlineList splatFont feature-itemlist">
        <div class="largeBox">{{localize "TYPES.Item.Feature"}}</div>                
    </div>

    <div>

        {{#each (getNotes actor) as |item id|}}

            <div class="item-row-area feature-itemlist">
                <div class="dragrow headlineNormal feature-itemlist" data-itemid="{{item._id}}">
                    <div class="width-iconbox draggable"><i class="icon fa-solid fa-grip-vertical"></i></div>

                    <div class="item-activeBox"><input class="item-active pointer" name="item.system.isactive" type="checkbox" data-item-id="{{item._id}}" data-type="isactive" {{isChecked item.system.isactive}}></input></div>
                    <div class="largeBox {{#if item.system.isrollable}}vrollable{{/if}}"
                        data-type="{{../config.sheettype.mortal}}"
                        data-object="Trait"
                        {{#if item.system.isrollable}}data-rollitem="true"{{/if}}
                        data-itemid="{{item._id}}"
                        title="{{item.name}}">
                        {{#if (ne item.name "")}}
                            {{item.name}}
                        {{else}}
                            {{localize "wod.notes.unnamedbackground"}}
                        {{/if}}
                    </div>
                    <div class="largeBox">{{localize item.system.type}}</div>
                    <div class="width-valuebox">{{#if (gt item.system.level 0)}}{{item.system.level}}{{else}}&nbsp;{{/if}}</div>


                    
                </div>
                <div class="iconBox">         

                    <a class="send-chat" title="{{localize 'wod.labels.send'}}" data-itemid="{{item._id}}"><i class="icon fa-solid fa-comment-dots"></i></a>

                    {{#if (eq ../locked false)}}
                        <a class="item-edit" {{#if (eq item.system.type 'other')}}data-type="other"{{else}}data-type="Feature"{{/if}} data-item-id="{{item._id}}"><i class="icon fa-solid fa-pen-to-square"></i></a>
                        <a class="item-delete" {{#if (eq item.system.type 'other')}}data-type="other"{{else}}data-type="Feature"{{/if}} data-item-id="{{item._id}}"><i class="icon fa-solid fa-trash-can"></i></a>
                    {{/if}}

                    {{#if (showToolTip item)}}
                        <i class="pointer icon collapsible button fa-solid fa-expand"
                                title="{{localize 'wod.labels.show.description'}}"
                                data-itemid="{{item._id}}"></i>
                    {{else}}
                        <i class="icon no-description-disabled fa-solid fa-solid fa-expand"></i>
                    {{/if}}

                    <a class="pointer" title="LANG: Menu" data-itemid="{{item._id}}"><i class="icon fa-solid fa-ellipsis-vertical"></i></a>

                </div>                
            </div>
            <div class="description" data-itemid="{{item._id}}">

                {{{getToolTip_v2 item.system.description item.system.details item.system.bonuslist ../actor}}}

            </div>

        {{/each}}

    </div>
</div>        

<div class="sheet-area flex-columns">
    <div class="clearareaBox area-box">
        <div class="pullLeft" style="width:50%;">
            <div class="headlineRow splatFont">
                <div class="clearareaBox" style="width:100%">
                    <div class="pullLeft largeBox">{{localize "wod.labels.notes.expearned"}}</div>
                    <div class="pullLeft experienceValue">{{getTotalExperience actor "earned"}}</div>
                    <div class="pullRight pointer" style="margin-right: 15px;">
                        <i class="icon unfold button fa-solid fa-angles-right" title="{{localize 'wod.labels.show.experience'}}" data-sheet="{{config.sheettype.mortal}}" data-type="addexp"></i>
                    </div>                                            
                </div>
            </div>

            <div class="clearareaBox hide addexp" data-area="addexp">
                {{#each (getEarnedExperience actor) as |item id|}}
                    <div class="clearareaBox row note-row" style="margin-right: 5px;">
                        <div class="pullLeft notes-experienceHeadline headlineNormal">
                            {{#if (ne item.system.description "")}}
                                {{item.system.description}}
                            {{else}}
                                {{localize "wod.notes.descriptionmissing"}}
                            {{/if}}
                        </div>
                        <div class="pullLeft notes-valueBox headlineNormal">{{item.system.amount}}</div>
                        {{#if (eq ../locked false)}}
                            <div class="pullLeft">
                                <div class="pullLeft">
                                    <a class="item-edit" title="{{localize 'wod.labels.edit.experience'}}" data-type="Experience" data-item-id="{{item._id}}"><i class="icon fa-solid fa-pen-to-square"></i></a>
                                </div>
                                <div class="pullLeft">
                                    <a class="item-delete" title="{{localize 'wod.labels.remove.experience'}}" data-type="Experience" data-item-id="{{item._id}}"><i class="icon fa-solid fa-trash-can"></i></a>
                                </div>
                            </div>
                        {{/if}}
                    </div>                    
                {{/each}}            
            </div>
        </div>

        <div class="pullLeft" style="width:50%">
            <div class="headlineRow splatFont">
                <div class="clearareaBox" style="width:100%">
                    <div class="pullLeft largeBox">{{localize "wod.labels.notes.expspend"}}</div>
                    <div class="pullLeft experienceValue">{{getTotalExperience actor "spent"}}</div> 
                    <div class="pullRight pointer" style="margin-right: 15px;">
                        <i class="icon unfold button fa-solid fa-angles-right" title="{{localize 'wod.labels.show.spentexp'}}" data-sheet="{{config.sheettype.mortal}}" data-type="spentexp"></i>
                    </div>
                                           
                </div>
            </div>

            <div class="clearareaBox hide spentexp" data-area="spentexp">
                {{#each (getSpendExperience actor) as |item id|}}
                    <div class="clearareaBox row note-row">
                        <div class="pullLeft notes-experienceHeadline headlineNormal">
                            {{#if (ne item.system.description "")}}
                                {{item.system.description}}
                            {{else}}
                                {{localize "wod.notes.descriptionmissing"}}
                            {{/if}}
                        </div>
                        <div class="pullLeft notes-valueBox headlineNormal">
                            {{#if item.system.isspent}}
                                {{item.system.amount}}
                            {{else}}
                                {{localize "wod.notes.unspent"}}
                            {{/if}}
                        </div>
                        {{#if (eq ../locked false)}}
                            <div class="pullLeft">
                                <div class="pullLeft">
                                    <a class="item-edit" title="{{localize 'wod.labels.edit.experience'}}" data-type="Experience" data-item-id="{{item._id}}"><i class="icon fa-solid fa-pen-to-square"></i></a>
                                </div>
                                <div class="pullLeft">
                                    <a class="item-delete" title="{{localize 'wod.labels.remove.experience'}}" data-type="Experience" data-item-id="{{item._id}}"><i class="icon fa-solid fa-trash-can"></i></a>
                                </div>
                            </div>
                        {{/if}}
                    </div>
                {{/each}}
            </div>
        </div>

    </div>
</div>