<div class="roll-dialog-content">
  <!-- HIDDEN DATA -->
  <input type="hidden" name="speakerId" value="{{ speakerId }}" />

  <h4 class="npc-roll-label">{{ rollLabel }}</h4>

  <div class="npc-roll-pool">
    <span class="label">{{localize 'VERMINE.dice_pool'}}:</span>
    <span class="pool-value">{{ pool }}D</span>
    {{#if freeSuccesses}}
      <span class="free-successes-badge"><i class="fas fa-star"></i> +{{ freeSuccesses }} {{localize 'VERMINE.auto_successes'}}</span>
    {{/if}}
    {{#if rerolls}}
      <span class="rerolls-badge">{{localize 'ADVERSITY.rerolls'}}: {{ rerolls }}D</span>
    {{/if}}
  </div>

  <div class="dice-pool">

    <!-- DIFFICULTY -->
    <div class="flexcol difficulty-section">
      <label class="label" for="difficulty">{{localize 'VERMINE.difficulty'}}</label>
      <select
        class="info-value"
        data-roll="true"
        data-dtype="String"
        type="number"
        name="difficulty"
        id="difficulty"
        min="3"
        max="10"
        {{#if lockedDifficulty}}disabled{{/if}}
      >
        {{#each difficultyOptions}}
          <option value="{{ this.difficulty }}" {{#ife @root.defaultDifficulty this.difficulty}}selected{{/ife}}>
            {{ this.label }} ({{ this.difficulty }})
          </option>
        {{/each}}
      </select>
    </div>

    <!-- HANDICAP -->
    <div class="flexcol handicap-section">
      <label class="label" for="handicap">{{localize 'VERMINE.handicap'}}</label>
      <select
        class="info-value"
        data-roll="true"
        data-dtype="String"
        type="number"
        name="handicap"
        id="handicap"
        min="0"
        max="3"
      >
        <option value="1" selected>{{localize 'VERMINE.none'}}</option>
        <option value="2">(I)</option>
        <option value="3">(II)</option>
        <option value="4">(III)</option>
      </select>
    </div>

    <!-- BONUSES -->
    <details class="bonuses-section">
      <summary class="flexrow">
        <span class="label">{{localize 'VERMINE.bonuses'}}</span>
        <span class="bonus-count">+<span id="total-bonus">0</span>D</span>
      </summary>
      <div class="grid grid-2col bonus-grid">

        <div class="flexrow bonus-item">
          <input type="checkbox" data-roll="true" name="helped" id="helped" value="1" />
          <label class="label" for="helped">{{localize 'VERMINE.help'}} (+1D)</label>
        </div>

        <div class="flexrow bonus-item">
          <label class="label" for="group">{{localize 'VERMINE.bonus_supplementary'}}</label>
          <input type="number" data-roll="true" class="numeric-entry" style="text-align: center;"
            name="group" id="group" min="0" max="5" value="0" />
          <span>D</span>
        </div>

        <div class="flexrow bonus-item full-width">
          <label class="label" for="temporary-malus">{{localize 'VERMINE.temporary_malus'}}</label>
          <input type="number" data-roll="true" class="numeric-entry" style="text-align: center;"
            name="temporary-malus" id="temporary-malus" min="0" max="5" value="0" />
          <span>D</span>
        </div>

      </div>
    </details>

    <!-- TOTAL -->
    <div class="flexrow total-section">
      <label class="label">{{localize 'VERMINE.total'}}:</label>
      <span id="dice-pool-total" class="total-value">0D</span>
      {{#if freeSuccesses}}
        <span class="totem-selector">
          (+<span id="free-successes">{{ freeSuccesses }}</span> {{localize 'VERMINE.auto_successes'}})
        </span>
      {{/if}}
    </div>

  </div>

  <footer class="sheet-footer flexrow">
    <button type="button" data-action="cancel">
      <i class="fas fa-times"></i> {{localize "VERMINE.cancel"}}
    </button>
    <button type="button" data-action="roll">
      <i class="fas fa-dice-d10"></i> {{localize "VERMINE.roll"}}
    </button>
  </footer>
</div>
