{{!--
  ApplicationV2 template for Sneak Action Preview Dialog
  Updated to support new enhanced sneak features
  Updated: row-timer-toggle button support
--}}

<div class="sneak-preview-content pf2e-visioner">
  {{!-- Sneaking Token Information Panel --}}
  <div class="sneaker-info">
    <div class="sneaker-image">
      <img src="{{sneaker.image}}" data-tooltip="{{sneaker.name}}" />
    </div>
    <div class="sneaker-details">
      <h3 class="sneaker-name">{{sneaker.name}}</h3>
      <p class="hint">{{sneaker.actionLabel}}</p>
      
      {{#if isEndOfTurnDialog}}
        <div class="end-of-turn-notice">
          <div class="notice-header">
            <i class="fas fa-clock"></i>
            <strong>End-of-Turn Position Validation</strong>
          </div>
          <p class="notice-text">
            Your Sneaky/Very Sneaky feat allowed chaining multiple sneaks this turn. 
            These are the final position checks for observers who passed their Perception rolls.
          </p>
        </div>
      {{/if}}
      
      {{#unless isEndOfTurnDialog}}
        {{#if prereqBadges}}
          <div class="action-context-badges">
        {{#each prereqBadges as |b|}}
          <span class="badge badge-feat" data-tooltip="{{b.tooltip}}">
            <i class="{{b.icon}}"></i>
            <span class="badge-label">{{b.label}}</span>
          </span>
        {{/each}}
          </div>
        {{/if}}
      {{/unless}}
      {{#if sneakDistance}}
        <div class="sneak-distance-indicator">
          <span class="distance-chip" data-tooltip="{{sneakDistance.tooltip}}">
            <i class="fas fa-shoe-prints"></i>
            <span>Max Sneak Distance: <strong>{{sneakDistance.maxFeet}} ft</strong></span>
            {{#if sneakDistance.movementLabel}}
              <span class="movement-chip {{sneakDistance.statusClass}}" data-tooltip="{{sneakDistance.supportTooltip}}"><i class="{{sneakDistance.movementIcon}}"></i> {{sneakDistance.movementLabel}}</span>
            {{/if}}
          </span>
        </div>
      {{/if}}
    </div>
  </div>

  {{!-- Enhanced Controls Section --}}
  <div class="enhanced-controls-section">
    {{#if showEncounterFilter}}
    <label class="encounter-filter-checkbox">
      <input type="checkbox" {{#if encounterOnly}}checked{{/if}} data-action="toggleEncounterFilter" data-tooltip="{{localize 'PF2E_VISIONER.UI.ENCOUNTER_FILTER_TOOLTIP'}}" />
      <span class="encounter-filter-label">{{localize "PF2E_VISIONER.UI.ENCOUNTER_FILTER_TEXT"}}</span>
    </label>
    {{/if}}
    <label class="filter-by-los-checkbox">
      <input type="checkbox" {{#if filterByDetection}}checked{{/if}} data-action="toggleFilterByDetection" data-tooltip="{{localize 'PF2E_VISIONER.UI.FILTER_BY_DETECTION_TOOLTIP'}}" />
      <span class="encounter-filter-label">{{localize 'PF2E_VISIONER.UI.FILTER_BY_DETECTION_LABEL'}}</span>
    </label>
    <label class="ignore-allies-filter-checkbox">
      <input type="checkbox" {{#if ignoreAllies}}checked{{/if}} data-action="toggleIgnoreAllies" data-tooltip="{{localize 'PF2E_VISIONER.UI.IGNORE_ALLIES_TOOLTIP'}}" />
      <span class="encounter-filter-label">{{localize "PF2E_VISIONER.UI.IGNORE_ALLIES"}}</span>
    </label>
    <label class="hide-foundry-hidden-filter-checkbox">
      <input type="checkbox" {{#if hideFoundryHidden}}checked{{/if}} data-action="toggleHideFoundryHidden" data-tooltip="{{localize 'PF2E_VISIONER.UI.HIDE_FOUNDRY_HIDDEN_TOOLTIP'}}" />
      <span class="encounter-filter-label">{{localize "PF2E_VISIONER.UI.HIDE_FOUNDRY_HIDDEN"}}</span>
    </label>
    <label class="show-only-changes-filter-checkbox">
      <input type="checkbox" {{#if showChangesOnly}}checked{{/if}} data-action="toggleShowOnlyChanges" data-tooltip="{{localize 'PF2E_VISIONER.UI.SHOW_ONLY_CHANGES_TOOLTIP'}}" />
      <span class="encounter-filter-label">{{localize "PF2E_VISIONER.UI.SHOW_ONLY_CHANGES"}}</span>
    </label>

  </div>

  {{!-- Bulk Actions Section - All buttons in a flex row --}}
  <div class="bulk-actions-container">
    {{!-- Bulk Defer Button --}}
    {{#if canBulkDefer}}
    <div class="bulk-action-group">
      <button type="button" class="bulk-defer-btn {{#if hasDeferableTokens}}available{{/if}}" 
              data-action="bulkDefer" 
              data-tooltip="{{localize 'PF2E_VISIONER.UI.DEFER_ALL_ELIGIBLE'}}">
        <i class="fas fa-hourglass-half"></i>
        <span>{{localize "PF2E_VISIONER.UI.DEFER_ALL_ELIGIBLE_LABEL"}}</span>
      </button>
    </div>
    {{/if}}



    {{!-- End-of-Turn Validation Button --}}
    {{#if canProcessEndTurn}}
    <div class="bulk-action-group">
      <button type="button" class="end-turn-validation-btn {{#if canProcessEndTurn}}available{{/if}}" 
              data-action="processEndTurnValidation" 
              data-tooltip="{{localize 'PF2E_VISIONER.UI.PROCESS_DEFERRED_CHECKS' count=deferredChecksCount s=(unless (eq deferredChecksCount 1) 's' '')}}">
        <i class="fas fa-clock"></i>
        <span>{{localize "PF2E_VISIONER.UI.END_TURN_VALIDATION"}} ({{deferredChecksCount}})</span>
      </button>
    </div>
    {{/if}}

    {{!-- Apply All Cover Group --}}
    <div class="bulk-action-group">
      <span class="bulk-action-label">{{localize "PF2E_VISIONER.UI.APPLY_ALL_COVER_LABEL"}}</span>
      <div class="apply-all-cover-buttons">
        <button type="button" class="apply-all-cover-btn module-style" data-action="applyAllCover" data-bonus="0" data-tooltip="{{localize 'PF2E_VISIONER.UI.APPLY_NO_COVER_ALL'}}">
          <i class="fas fa-shield-slash"></i> +0
        </button>
        <button type="button" class="apply-all-cover-btn module-style" data-action="applyAllCover" data-bonus="2" data-tooltip="{{localize 'PF2E_VISIONER.UI.APPLY_STANDARD_COVER_ALL'}}">
          <i class="fas fa-shield-alt"></i> +2
        </button>
        <button type="button" class="apply-all-cover-btn module-style" data-action="applyAllCover" data-bonus="4" data-tooltip="{{localize 'PF2E_VISIONER.UI.APPLY_GREATER_COVER_ALL'}}">
          <i class="fas fa-shield"></i> +4
        </button>
      </div>
    </div>

    {{!-- Bulk Set Visibility Group --}}
    {{#if bulkOverrideStates}}
    <div class="bulk-action-group">
      {{> "pf2e-visioner.bulk-override"}}
    </div>
    {{/if}}
  </div>

  {{!-- Results Table --}}
  <div class="results-table-container">
    <table class="visibility-table sneak-results-table">
      <thead>
        <tr>
          <th class="token-image">{{localize "PF2E_VISIONER.UI.TOKEN"}}</th>
          <th class="token-name">{{localize "PF2E_VISIONER.UI.NAME"}}</th>
          <th class="start-position">{{localize "PF2E_VISIONER.UI.START_POS"}}<br>
            <span class="legend-icon state-indicator visibility-hidden" data-state="hidden" data-tooltip="{{localize 'PF2E_VISIONER.UI.HIDDEN_OR_UNDETECTED'}}">
              <i class="fas fa-eye-slash" aria-hidden="true"></i><span class="legend-plus">+</span>
            </span>
          </th>
          <th class="end-position">{{localize "PF2E_VISIONER.UI.END_POS"}}<br>
            <span class="legend-icon state-indicator visibility-concealed" data-state="concealed" data-tooltip="{{#if sneakAllowExtendedEndStates}}{{localize 'PF2E_VISIONER.UI.CONCEALED_HIDDEN_UNDETECTED'}}{{else}}{{localize 'PF2E_VISIONER.BUTTONS.CONCEALED'}}{{/if}}">
              <i class="fas fa-cloud" aria-hidden="true"></i>{{#if sneakAllowExtendedEndStates}}<span class="legend-plus">+</span>{{/if}}
            </span>/<span class="legend-icon state-indicator cover-standard" data-state="standard-cover" data-tooltip="{{localize 'PF2E_VISIONER.UI.STANDARD_OR_GREATER_TOOLTIP'}}">
              <i class="fas fa-shield-alt" aria-hidden="true"></i><span class="legend-plus">+</span>
            </span>
          </th>
          <th class="cover-bonus">{{localize "PF2E_VISIONER.UI.COVER_BONUS"}}</th>
          <th class="roll-result">{{localize "PF2E_VISIONER.UI.STEALTH_VS_PERCEPTION"}}</th>
          <th class="outcome">{{localize "PF2E_VISIONER.UI.ROLL_OUTCOME"}}</th>
          <th class="visibility-change">{{localize "PF2E_VISIONER.UI.VISIBILITY_CHANGE"}}</th>
          <th class="actions">{{localize "PF2E_VISIONER.UI.ACTIONS"}}</th>
        </tr>
      </thead>
      <tbody>
        {{#each outcomes as |outcome|}}
          <tr class="token-row result-{{outcome.outcome}} {{#if outcome.hasPositionData}}has-position-data{{/if}} {{#if outcome.isDeferred}}deferred-row{{/if}}" 
              data-token-id="{{outcome.token.id}}" 
              data-outcome="{{outcome.outcome}}"
              data-result-type="{{outcome.outcome}}"
              {{#if outcome.isDeferred}}data-deferred="true"{{/if}}>
            <td class="token-image">
              <span class="token-img-wrapper">
                <img src="{{outcome.tokenImage}}" width="28" height="28" />
                {{#if outcome.token.document.hidden}}
                  <span class="foundry-hidden-indicator" data-tooltip="{{localize 'PF2E_VISIONER.UI.FOUNDRY_HIDDEN'}}"><i class="fas fa-eye-slash"></i></span>
                {{/if}}
              </span>
            </td>
            <td class="token-name">
              <strong data-tooltip="{{outcome.token.name}}">{{outcome.token.name}}</strong>
              <span class="sr-only">Sneak result: {{outcome.outcomeLabel}}</span>
            </td>
            <td class="start-position">
              {{#if outcome.hasPositionData}}
                <div class="position-requirements-row">
                  {{!-- Start Position Requirements - Interactive Buttons --}}
                  <button type="button" class="position-requirement-btn {{#if outcome.positionDisplay.startPosition.qualifies}}position-check active{{else}}position-x{{/if}}" 
                          data-action="toggleStartPosition" 
                          data-token-id="{{outcome.token.id}}" 
                          data-requirement="start"
                          {{#if outcome.isDeferred}}disabled{{/if}}
                          data-tooltip="{{#if (and consecutiveSneaks (gt consecutiveSneaks 1))}}{{localize 'PF2E_VISIONER.UI.START_POS_PREVIOUS_SNEAK'}}{{else}}{{#if outcome.positionDisplay.startPosition.qualifies}}{{localize 'PF2E_VISIONER.UI.START_POS_QUALIFIES'}}{{else}}{{localize 'PF2E_VISIONER.UI.START_POS_NOT_QUALIFIES'}}{{/if}}{{/if}}">
                    {{#if (and consecutiveSneaks (gt consecutiveSneaks 1))}}
                      <i class="fas fa-clock"></i>
                    {{else}}
                    {{#if outcome.positionDisplay.startPosition.qualifies}}
                      <i class="fas fa-check"></i>
                    {{else}}
                      <i class="fas fa-times"></i>
                    {{/if}}
                    {{/if}}
                  </button>
                </div>
              {{else}}
                <div class="no-position-data" data-tooltip="{{localize 'PF2E_VISIONER.UI.START_POSITION_NOT_AVAILABLE'}}">
                  <i class="fas fa-question-circle"></i>
                </div>
              {{/if}}
            </td>
            <td class="end-position">
              {{#if outcome.hasPositionData}}
                <div class="position-requirements-row">
                  {{!-- End Position Requirements - Interactive Buttons --}}
                  <button type="button" class="position-requirement-btn {{#if outcome.positionDisplay.endPosition.qualifies}}position-check active{{else}}position-x{{/if}}" 
                          data-action="toggleEndPosition" 
                          data-token-id="{{outcome.token.id}}" 
                          data-requirement="end"
                          data-tooltip="{{#if (and consecutiveSneaks (gt consecutiveSneaks 1))}}{{localize 'PF2E_VISIONER.UI.END_POS_CHECK_END_TURN'}}{{else}}{{#if outcome.positionDisplay.endPosition.qualifies}}{{#if (and sneakAllowExtendedEndStates (or (eq outcome.positionDisplay.endPosition.visibility 'hidden') (eq outcome.positionDisplay.endPosition.visibility 'undetected')))}}{{localize 'PF2E_VISIONER.UI.END_POS_QUALIFIES_EXTENDED'}}{{else}}{{localize 'PF2E_VISIONER.UI.END_POS_QUALIFIES'}}{{/if}}{{else}}{{localize 'PF2E_VISIONER.UI.END_POS_NOT_QUALIFIES'}}{{/if}}{{/if}}">
                    {{#if (and consecutiveSneaks (gt consecutiveSneaks 1))}}
                      <i class="fas fa-clock"></i>
                    {{else}}
                      {{#if outcome.positionDisplay.endPosition.qualifies}}
                        <i class="fas fa-check"></i>
                      {{else}}
                        <i class="fas fa-times"></i>
                      {{/if}}
                    {{/if}}
                  </button>
                  
                  {{!-- Defer Button for Sneaky/Very Sneaky Feat --}}
                  {{#if outcome.isDeferred}}
                    {{#if outcome.canDefer}}
                      {{!-- Deferred but can defer again (manual end position change) --}}
                      <button type="button" class="defer-btn" 
                              data-action="toggleDefer" 
                              data-token-id="{{outcome.token.id}}"
                              data-tooltip="{{localize 'PF2E_VISIONER.UI.DEFER_TO_END_OF_TURN'}}">
                        <i class="fas fa-hourglass"></i>
                      </button>
                    {{else}}
                      {{!-- Currently deferred and cannot defer again --}}
                      <button type="button" class="defer-btn deferred active" 
                              data-action="toggleDefer" 
                              data-token-id="{{outcome.token.id}}"
                              data-tooltip="{{localize 'PF2E_VISIONER.UI.CURRENTLY_DEFERRED'}}" disabled>
                        <i class="fas fa-clock"></i>
                      </button>
                    {{/if}}
                  {{else}}
                    {{!-- Not deferred --}}
                    <button type="button" class="defer-btn {{#unless outcome.canDefer}}hidden{{/unless}}" 
                            data-action="toggleDefer" 
                            data-token-id="{{outcome.token.id}}"
                            data-tooltip="{{localize 'PF2E_VISIONER.UI.DEFER_TO_END_OF_TURN'}}">
                      <i class="fas fa-hourglass"></i>
                    </button>
                  {{/if}}
                </div>
              {{else}}
                <div class="no-position-data" data-tooltip="{{localize 'PF2E_VISIONER.UI.END_POSITION_NOT_AVAILABLE'}}">
                  <i class="fas fa-question-circle"></i>
                </div>
              {{/if}}
            </td>
            <td class="cover-bonus">
              <div class="cover-bonus-controls">
                {{!-- Cover Bonus Selection Buttons --}}
                <button type="button" class="cover-bonus-btn module-style {{#unless outcome.appliedCoverBonus}}active{{else}}{{#if (eq outcome.appliedCoverBonus 0)}}active{{/if}}{{/unless}}" 
                        data-action="setCoverBonus" 
                        data-token-id="{{outcome.token.id}}" 
                        data-bonus="0"
                        data-tooltip="{{localize 'PF2E_VISIONER.UI.NO_COVER_BONUS'}}">
                  <i class="fas fa-shield-slash"></i>
                </button>
                <button type="button" class="cover-bonus-btn module-style {{#if (eq outcome.appliedCoverBonus 2)}}active{{/if}}" 
                        data-action="setCoverBonus" 
                        data-token-id="{{outcome.token.id}}" 
                        data-bonus="2"
                        data-tooltip="{{localize 'PF2E_VISIONER.UI.STANDARD_COVER_BONUS'}}">
                  <i class="fas fa-shield-alt"></i>
                </button>
                <button type="button" class="cover-bonus-btn module-style {{#if (eq outcome.appliedCoverBonus 4)}}active{{/if}}" 
                        data-action="setCoverBonus" 
                        data-token-id="{{outcome.token.id}}" 
                        data-bonus="4"
                        data-tooltip="{{localize 'PF2E_VISIONER.UI.GREATER_COVER_BONUS'}}">
                  <i class="fas fa-shield"></i>
                </button>
              </div>
            </td>
            <td class="roll-result">
              <div class="roll-vs-dc">
                <div class="roll-dc-line">
                  <span class="roll-total" data-base-total="{{outcome.baseRollTotal}}">{{outcome.rollTotal}}</span>
                  <span class="vs-text">{{localize "PF2E_VISIONER.UI.VS_DC"}}</span>
                  <span class="dc-value">{{outcome.dc}}</span>
                </div>
              </div>
            </td>
            <td class="outcome {{outcome.outcome}}">
              <div class="final-result-display">
                <div class="outcome-primary sneak-result-{{outcome.outcome}}">
                  {{#if outcome.sneakAdeptApplied}}
                    <span class="outcome-text-crossed" >{{localize "PF2E_VISIONER.UI.FAILURE_LABEL"}}</span>
                    <span class="outcome-text">{{localize "PF2E_VISIONER.UI.SUCCESS_LABEL"}}</span>
                  {{else}}
                    <span class="outcome-text">{{outcome.outcomeLabel}}</span>
                  {{/if}}
                </div>
              </div>
            </td>
            <td class="visibility-change">
              <div class="visibility-change-with-override">
                <span class="old-visibility-state {{#if outcome.isOldStateAvsControlled}}avs-controlled{{/if}}">
                  {{{visibilityIcon outcome.oldVisibility}}}
                  {{#if outcome.isOldStateAvsControlled}}
                    <span class="avs-tag-small" data-tooltip="{{localize 'PF2E_VISIONER.UI.AVS_CONTROLLED'}}">
                      <i class="fas fa-bolt-auto"></i>
                    </span>
                  {{/if}}
                </span>
                <i class="fas fa-arrow-right position-arrow" aria-hidden="true"></i>
                <div class="override-icons {{#if outcome.isDeferred}}disabled{{/if}}" data-token-id="{{outcome.token.id}}">
                  {{#each outcome.availableStates as |state|}}
                    <button type="button" class="state-icon {{#if state.selected}}selected{{/if}} {{#if state.calculatedOutcome}}calculated-outcome{{/if}} {{state.cssClass}}" 
                            data-action="overrideState"
                            data-state="{{state.value}}" data-token-id="{{outcome.token.id}}" 
                            {{#if outcome.isDeferred}}disabled{{/if}}
                            data-tooltip="{{#if outcome.isDeferred}}{{localize 'PF2E_VISIONER.UI.DEFERRED_ACTIONS_DISABLED'}}{{else if state.calculatedOutcome}}{{localize 'PF2E_VISIONER.UI.AVS_RECOMMENDED' label=state.label}}{{else}}{{state.label}}{{/if}}">
                      <i class="{{state.icon}}"></i>
                    </button>
                  {{/each}}
                  <input type="hidden" name="override.{{outcome.token.id}}" value="{{outcome.overrideState}}" />
                </div>
              </div>
              {{#if (and outcome.shouldShowOverride outcome.originalNewVisibility)}}
                <div class="original-visibility-change">
                  <span>{{localize "PF2E_VISIONER.UI.ORIGINAL_CHANGE"}}</span>
                  <span class="state-icon" data-state="{{outcome.originalNewVisibility}}" data-tooltip="{{localize 'PF2E_VISIONER.UI.ORIGINAL_COVER' state=outcome.originalNewVisibility}}">
                    {{{visibilityIcon outcome.originalNewVisibility}}}
                  </span>
                </div>
              {{/if}}
            </td>
            <td class="actions">
              {{#if outcome.isDeferred}}
                <div class="deferred-actions-container" data-debug="deferred-container-{{outcome.token.id}}">
                  <span class="deferred-action" data-tooltip="{{localize 'PF2E_VISIONER.UI.DEFERRED_ACTIONS_DISABLED'}}">
                    <i class="fas fa-clock"></i> Deferred
                  </span>
                  <button type="button" class="undefer-btn" 
                          data-action="undeferCheck" 
                          data-token-id="{{outcome.token.id}}"
                          data-tooltip="{{localize 'PF2E_VISIONER.UI.REMOVE_DEFER_PROCESS_NOW'}}"
                          data-debug="undefer-btn-{{outcome.token.id}}"
                          style="pointer-events: auto !important; z-index: 999; position: relative;">
                    <i class="fas fa-times"></i>
                    Undefer
                  </button>
                </div>
              {{else if outcome.hasActionableChange}}
                <button type="button" class="row-timer-toggle" data-token-id="{{outcome.token.id}}" data-tooltip="{{localize 'PF2E_VISIONER.TIMED_OVERRIDE.SET_DURATION_FOR_ROW'}}">
                  <i class="fas fa-clock"></i>
                </button>
                <button type="button" class="row-action-btn apply-change" 
                {{#if outcome.isDeferred}}disabled{{/if}}
                data-action="applyChange" data-token-id="{{outcome.token.id}}" data-tooltip="{{localize 'PF2E_VISIONER.UI.APPLY_VISIBILITY_CHANGE'}}">
                  <i class="fas fa-check"></i>
                </button>
                <button type="button" class="row-action-btn revert-change" 
                {{#if outcome.isDeferred}}disabled{{/if}}
                data-action="revertChange" data-token-id="{{outcome.token.id}}" data-tooltip="{{localize 'PF2E_VISIONER.UI.REVERT_TO_ORIGINAL'}}">
                  <i class="fas fa-undo"></i>
                </button>
              {{else}}
                <span class="no-action">{{localize "PF2E_VISIONER.UI.NO_CHANGE_LABEL"}}</span>
              {{/if}}
            </td>
          </tr>
        {{/each}}
      </tbody>
    </table>
  </div>

  {{!-- Summary and Bulk Actions --}}
  <div class="sneak-preview-dialog-bulk-actions-header">
    <div class="sneak-preview-dialog-bulk-actions-info">
      <span class="sneak-preview-dialog-changes-count">{{changesCount}}</span> of <span class="sneak-preview-dialog-total-count">{{totalCount}}</span> observers will have visibility changes.
    </div>
    
    <div class="sneak-preview-dialog-bulk-actions-buttons">
      {{#if isEndOfTurnDialog}}
        <button type="button" class="bulk-action-btn apply-all" data-action="applyAll" data-tooltip="{{localize 'PF2E_VISIONER.UI.ACKNOWLEDGE_END_TURN'}}">
          <i class="fas fa-check-circle"></i> Acknowledge Results
        </button>
        <button type="button" class="bulk-action-btn close-dialog" data-action="close" data-tooltip="{{localize 'PF2E_VISIONER.UI.CLOSE_DIALOG'}}">
          <i class="fas fa-times"></i> Close
        </button>
      {{else}}
        <button type="button" class="bulk-action-btn apply-all" data-action="applyAll" data-tooltip="{{localize 'PF2E_VISIONER.UI.APPLY_ALL_CHANGES'}}">
          <i class="fas fa-check-circle"></i> {{localize "PF2E_VISIONER.UI.APPLY_ALL"}}
        </button>
        <button type="button" class="bulk-action-btn revert-all" data-action="revertAll" data-tooltip="{{localize 'PF2E_VISIONER.UI.REVERT_ALL_CHANGES'}}">
          <i class="fas fa-undo"></i> {{localize "PF2E_VISIONER.UI.REVERT_ALL"}}
        </button>
        {{#if canBulkUndefer}}
        <button type="button" class="bulk-action-btn undefer-all {{#if hasDeferredTokens}}available{{/if}}" 
                data-action="bulkUndefer" 
                data-tooltip="{{localize 'PF2E_VISIONER.UI.UNDEFER_ALL'}}">
          <i class="fas fa-clock"></i> Undefer All
        </button>
        {{/if}}
      {{/if}}
    </div>
  </div>
</div>
