<div class="dnd5e2 chat-card item-card" data-actor-id="{{ actor.id }}" data-item-id="{{ item.id }}"
     {{#if tokenId}}data-token-id="{{tokenId}}"{{/if}} {{#if isSpell}}data-spell-level="{{ item.system.level }}"{{/if}}>

    {{!-- Collapsible Item Details --}}
    <section class="card-header description collapsible" {{#if data.description.concealed}}data-concealed{{/if}}>

        {{!-- Summary --}}
        <header class="summary">
            <img class="gold-icon" src="{{ item.img }}" alt="{{ item.name }}">
            <div class="name-stacked border">
                <span class="title">{{ item.name }}</span>
                {{#if data.subtitle}}
                <span class="subtitle">
                    {{{ data.subtitle }}}
                </span>
                {{/if}}
            </div>
            <i class="fas fa-chevron-down fa-fw"></i>
        </header>

        {{!-- Details --}}
        <section class="details collapsible-content card-content">
            <div class="wrapper">
                {{{ data.description.chat }}}
            </div>
        </section>
    </section>

    {{!-- Materials --}}
    {{#if data.materials.value}}
    <p class="supplement"><strong>{{ localize "DND5E.Materials" }}</strong>{{ data.materials.value }}</p>
    {{/if}}

    {{!-- Item Properties --}}
    {{#if data.hasProperties}}
    <ul class="card-footer pills unlist">
        {{#each data.tags}}
        <li class="pill transparent">
            <span class="label">{{ this }}</span>
        </li>
        {{/each}}
        {{#each data.properties}}
        <li class="pill transparent">
            <span class="label">{{ this }}</span>
        </li>
        {{/each}}
    </ul>
    {{/if}}
</div>
