<section
    class='tab {{tabs.features.cssClass}} {{tabs.features.id}}'
    data-tab='{{tabs.features.id}}'
    data-group='{{tabs.features.group}}'
>
    <div class="two-columns even">
        <fieldset class="drop-section hope-feature" data-type='hope'>
            <legend>{{localize "DAGGERHEART.ITEMS.Class.hopeFeatures"}} <a><i class="fa-solid fa-plus icon-button" data-type="hope" data-action="addFeature"></i></a></legend>
            <div class="feature-list">
                {{#each source.system.hopeFeatures as |feature|}}
                    {{> 'systems/daggerheart/templates/sheets/global/partials/feature-section-item.hbs' type='hope' feature=feature}}
                {{/each}}
            </div>
        </fieldset>

        <fieldset class="drop-section class-feature" data-type='class'>
            <legend>{{localize "DAGGERHEART.ITEMS.Class.classFeatures"}} <a><i class="fa-solid fa-plus icon-button" data-type="class" data-action="addFeature"></i></a></legend>
            <div class="feature-list">
                {{#each source.system.classFeatures as |feature|}}
                    {{> 'systems/daggerheart/templates/sheets/global/partials/feature-section-item.hbs' type='class' feature=feature}}
                {{/each}}
            </div>
        </fieldset>
    </div>

    {{#unless (eq document.parent.type 'character')}}
        <fieldset>
            <legend>{{localize "TYPES.Item.subclass"}}</legend>
            <div class="feature-list">
                {{#each source.system.subclasses as |subclass index|}}
                    <li class='feature-item'>
                        <div class='feature-line'>
                            <img class='image' src='{{subclass.img}}' />
                            <h4>
                                {{subclass.name}}
                            </h4>
                            <div class='controls'>
                                <a
                                    class='effect-control'
                                    data-action='editDoc'
                                    data-item-uuid={{subclass.uuid}}
                                    data-tooltip='{{localize "DAGGERHEART.UI.Tooltip.openItemWorld"}}'
                                >
                                    <i class="fa-solid fa-globe"></i>
                                </a>
                                <a
                                    class='effect-control'
                                    data-action='removeItemFromCollection'
                                    data-target="subclasses"
                                    data-uuid={{subclass.uuid}}
                                    data-tooltip='{{localize "CONTROLS.CommonDelete"}}'
                                >
                                    <i class='fas fa-trash'></i>
                                </a>
                            </div>
                        </div>
                    </li>
                {{/each}}
            </div>
        </fieldset>
    {{/unless}}
</div>