<div class="bio-tab border scroll-y" style="height: 100%; border-top: none;">
    <div class="grid-container" style="height: fit-content; border-top: none; grid-template-rows: auto auto; grid-template-columns: 1fr 1fr;">
        <div class="border grid-container" style="height: 100%; grid-row: 1/4; grid-template-rows: auto 1fr; height: fit-content; min-height: 200px;">
            <h2 style="margin-bottom: 0;">{{localize data.description.label}}</h2>
            <div class="description">
                {{editor content=data.description.value target="data.description.value" button=true owner=owner editable=editable}}
            </div>
        </div>
        <div class="border grid-container" style="grid-column-gap: 5px; grid-template-columns: 1fr auto; max-height: 163px; height: fit-content;">
            <label style="margin-top: auto; margin-bottom: auto;">{{localize data.crew.label}}:</label>
            <input name="data.crew.value" style="text-align: center;"  type="text" value="{{data.crew.value}}" placeholder="{{localize data.crew.label}}" />
        </div>

        <div class="spells border">
            <h1 class="item-list-header">{{localize "ITEM.TALENT"}}</h1>

            <div class="scroll-y" style="height: calc(100% - 20px);">
                <ul class="items">
                    <ul class="items-list">
                        {{#each actor.shiptalents as |talent key|}}
                        <li class="item flexrow" data-item-id="{{talent._id}}">
                            <div class="item-name">{{talent.name}}</div>
                            <div class="item-controls">
                                <a class="item-control item-edit" data-parent=".item" title="Edit Item"><i class="fas fa-edit"></i></a>
                                <a class="item-control item-delete" data-parent=".item" title="Delete Item"><i class="fas fa-trash"></i></a>
                            </div>
                        </li>
                        {{/each}}
                    </ul>
                </ul>
            </div>
        </div>
    </div>
</div>