<section class="dnc-chat-card dnc-chat-card-initiative">
  <header class="initiative-header">
    <div class="chat-card-heading">
      <p class="chat-card-kicker">{{localize "DNC.Chat.Kicker.Initiative"}}</p>
      <h2>{{title}}</h2>
      <p class="chat-card-subtitle">{{actorName}}</p>
      {{#if modeLabel}}<p class="chat-card-subtitle">{{modeLabel}}</p>{{/if}}
    </div>
    <div class="initiative-total">
      <span class="initiative-total-label">{{localize "DNC.Chat.Total"}}</span>
      <strong>{{total}}</strong>
    </div>
  </header>

  <div class="initiative-breakdown">
    <div class="initiative-part">
      <span class="initiative-part-label">d20</span>
      <strong>{{die}}</strong>
    </div>
    <div class="initiative-operator">+</div>
    <div class="initiative-part">
      <span class="initiative-part-label">DEX</span>
      <strong>{{dex}}</strong>
    </div>
    <div class="initiative-operator">+</div>
    <div class="initiative-part">
      <span class="initiative-part-label">{{localize "DNC.Chat.Bonus"}}</span>
      <strong>{{bonus}}</strong>
    </div>
  </div>

  <p class="initiative-formula">{{formula}}</p>
  {{#if dieValues.[1]}}
    <p class="roll-values">{{localize "DNC.Chat.Rolls"}} : {{#each dieValues}}<span>{{this}}</span>{{/each}}</p>
  {{/if}}

  {{#if syncedCombat}}
    <div class="initiative-sync">
      <span class="chat-pill success">{{localize "DNC.Chat.CombatSynced"}}</span>
      <p>{{syncedCombat.name}} · rang {{syncedCombat.rank}} / {{syncedCombat.total}}</p>
    </div>
  {{/if}}
</section>
