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

  {{!-- if dnd5e supports putting activity name look at replacing this by inserting the dnd5e template --}}
  <section class="card-header description collapsible" {{#if description.concealed}}data-concealed{{/if}}>
    <header class="summary">
      <img class="gold-icon" src="{{ item.img }}" alt="{{ item.name }}">
      <div class="name-stacked border">
        {{#if activity.midiProperties.displayActivityName}}
        <span class="title">{{ item.name }}: {{activity.name}}</span>
        {{else}}
        <span class="title">{{ item.name }}</span>
        {{/if}}
        {{#if subtitle}}
        <span class="subtitle">{{{ subtitle }}}</span>
        {{/if}}
      </div>
      {{#unless hideItemDetails}}
      <i class="fa-solid fa-chevron-down fa-fw" inert></i>
      {{/unless}}
    </header>
    {{#unless hideItemDetails}}
    <section class="details collapsible-content card-content">
      <div class="wrapper">{{{ description.chat }}}</div>
    </section>
    {{/unless}}
  </section>

  {{!-- Item Actions --}}
  {{#if hasButtons}}
  <div class="card-buttons midi-buttons">
    {{!-- Attacks --}}
    {{#if hasAttack}}
    {{#if mergeCardMulti}}
    <div class="midi-qol-attack-buttons flexrow 5">
      <button data-action="rollAttackDisadvantage" style="flex: 1 1 0"
        data-tooltip="{{localize 'DND5E.Disadvantage'}}"><i class="fas fa-caret-down"></i><i
          class="fas fa-dice-d20"></i><i class="fas fa-dice-d20"></i></button>
      <button data-action="rollAttack" style="flex: 3 1 0">{{ localize "DND5E.Attack" }}</button>
      <button data-action="rollAttackAdvantage" style="flex: 1 1 0" data-tooltip="{{localize 'DND5E.Advantage'}}"><i
          class="fas fa-caret-up"></i><i class="fas fa-dice-d20"></i><i class="fas fa-dice-d20"></i></button>
    </div>
    {{else}}
    <div class="midi-qol-attack-buttons flexrow 1">
      <button type="button" data-action="rollAttack"><span>{{ localize "DND5E.Attack" }}</span></button>
    </div>
    {{/if}}
    {{/if}}

    {{!-- Damage / Healing --}}
    {{#if hasDamage}}
    {{#if mergeCardMulti}}
    <div class="midi-qol-damage-buttons flexrow 5">
      <button data-action="rollDamageNoCritical" style="flex: 1 1 0" data-tooltip="{{localize 'DND5E.Normal'}}"><i
          class="fas fa-dice-d6"></i></button>
      <button data-action="rollDamage" style="flex:3 1 0">{{ dmgBtnText }}</button>
      <button data-action="rollDamageCritical" style="flex: 1 1 0" data-tooltip="{{localize 'DND5E.Critical'}}"><i
          class="fas fa-dice-d6"></i><i class="fas fa-dice-d6"></i></button>
    </div>
    {{else}}
    <div class="midi-qol-damage-buttons flexrow 1">
      <button data-action="rollDamage"><span>{{ dmgBtnText }}</span></button>
    </div>
    {{/if}}
    {{/if}}

    {{!-- Apply Effects --}}
    {{#if hasEffects}}
    <button data-action="midiApplyEffects">{{ localize "midi-qol.ApplyEffects" }}</button>
    {{/if}}
    {{#if confirmAttackDamage}}
    {{#if hasAttackRoll}}
    <div class="midi-qol-confirm-damage-roll">
      <div class="flexrow 3">
        <button class="midi-qol-confirm-damage-roll-complete-miss"
          data-action="confirmDamageRollCompleteMiss">{{localize "midi-qol.ConfirmMiss"}}</button>
        <button class="midi-qol-confirm-damage-roll-complete" data-action="confirmDamageRollComplete">{{localize
          "midi-qol.ConfirmRoll"}}</button>
        <button class="midi-qol-confirm-damage-roll-complete-hit" data-action="confirmDamageRollCompleteHit">{{localize
          "midi-qol.ConfirmHit"}}</button>
      </div>
      {{#if canCancel}}
      <button class="midi-qol-confirm-damage-roll-cancel" data-action="confirmDamageRollCancel">{{localize
        "Cancel"}}</button>
      {{/if}}
    </div>
    {{else}}
    <div class="midi-qol-confirm-damage-roll flexrow 1">
      <button class="midi-qol-confirm-damage-roll-complete" data-action="confirmDamageRollComplete">{{localize
        "midi-qol.ConfirmRoll"}}</button>
      {{#if canCancel}}
      <button class="midi-qol-confirm-damage-roll-cancel" data-action="confirmDamageRollCancel">{{localize
        "Cancel"}}</button>
      {{/if}}
    </div>
    {{/if}}
    {{/if}}
    {{/if}}


    {{!-- Insert dnd5e buttons on card --}}
    {{!-- Utility Activity rollFormula - just use the dnd5e button --}}
    {{#if buttons}}
    <div class="midi-dnd5e-buttons">
      <div class="card-buttons">
        {{#each buttons}}
        <button type="button" {{ isDisabled }} {{ dnd5e-dataset dataset }}>
          {{{ icon }}} <span>{{{ label }}}</span>
        </button>
        {{/each}}
      </div>
    </div>
    <div class="end-midi-dnd5e-buttons">
    </div>
    {{/if}}

    {{!-- Midi results --}}
    <div class="midi-results">
      {{#if condensed}}
      <div class="flexrow 2">
        <div class="midi-qol-attack-roll">
          <div class="end-midi-qol-attack-roll"></div>
        </div>
        <div class="midi-qol-damage-roll">
          <div class="end-midi-qol-damage-roll"></div>
        </div>
      </div>
      <div class="midi-qol-hits-display">
        <div class="end-midi-qol-hits-display"></div>
      </div>
      <div class="midi-qol-saves-display">
        <div class="end-midi-qol-saves-display"></div>
      </div>
      {{else}}
      <div class="midi-qol-attack-roll">
        <div class="end-midi-qol-attack-roll"></div>
      </div>
      <div class="midi-qol-hits-display">
        <div class="end-midi-qol-hits-display"></div>
      </div>
      <div class="midi-qol-damage-roll">
        <div class="end-midi-qol-damage-roll"></div>
      </div>
      {{/if}}
      <div class="midi-qol-other-damage-roll">
        <div class="end-midi-qol-other-damage-roll"></div>
      </div>
      <div class="midi-qol-bonus-damage-roll">
        <div class="end-midi-qol-bonus-bonus-roll"></div>
      </div>
      <div class="midi-qol-utility-roll">
        <div class="end-midi-qol-utility-roll"></div>
      </div>
      <div class="midi-qol-saves-display">
        <div class="end-midi-qol-saves-display"></div>
      </div>
    </div>

    {{#each supplements}}
    <p class="supplement">{{{ this }}}</p>
    {{/each}}

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