{# Confirm action panel — v0.61.72 (#6, AegisMark UX patterns roadmap).

   Irreversible-action consent primitive. Renders the canonical
   "Final authorisation" shape from AegisMark's SIMS-sync-opt-in
   prototype: a checklist of obligations the actor must affirm
   before the primary commit action becomes available, plus an
   optional secondary draft action and a revoke action shown only
   in the live state.

   The panel reads `state_value` (resolved at request time from the
   entity field named by `state_field`) and branches its visual
   mode:
     - off / pending / draft  → checklist + primary commit + secondary draft
     - live / active / on     → "Currently live" summary + revoke
     - revoked / disabled     → audit + (optional) re-enable
     - empty / unknown        → assume off (safest default)

   Card safety: region emits zero chrome + zero title. The dashboard
   slot owns both via region_card. Tone tints are NOT used here —
   this panel's emphasis comes from the dual-button asymmetry, not
   from a band tint.

   The audit footer auto-renders when the source entity has an
   `audit:` block declared (audit_enabled=true upstream). Authors
   don't need to write the disclosure copy by hand.

   v0.62 CSS refactor: inline Tailwind → semantic .dz-confirm-* classes
   (components/regions.css). Summary tone driven by
   `data-dz-confirm-tone="success|muted"` attribute selector; primary
   button disabled state via `is-disabled` class (Alpine :class is now
   a one-token swap rather than two parallel branch class strings). #}
{% from 'macros/region_wrapper.html' import region_card %}
{% call region_card(title) %}
<div class="dz-confirm-panel" data-dz-state-value="{{ state_value | default('off') }}">
  {% set _state = (state_value | default('off') or 'off') | lower %}
  {% set _is_live = _state in ('live', 'active', 'on', 'enabled') %}
  {% set _is_revoked = _state in ('revoked', 'disabled', 'off-revoked') %}

  {% if _is_live %}
    {# ── Live state: summary + revoke action ────────────────────── #}
    <div class="dz-confirm-summary" data-dz-confirm-tone="success">
      <div class="dz-confirm-summary-title">Currently live.</div>
      <div class="dz-confirm-summary-body">Action recorded; further changes require a new authorisation.</div>
    </div>
    {% if revoke_url %}
      <div class="dz-confirm-actions">
        <a href="{{ revoke_url }}" class="dz-confirm-revoke">Revoke</a>
      </div>
    {% endif %}
  {% elif _is_revoked %}
    {# ── Revoked state: audit + (optional) re-enable ──────────────── #}
    <div class="dz-confirm-summary" data-dz-confirm-tone="muted">
      <div class="dz-confirm-summary-title">Authorisation revoked.</div>
      <div class="dz-confirm-summary-body">Re-authorise to enable the integration again.</div>
    </div>
    {% if primary_action_url %}
      <div class="dz-confirm-actions">
        <a href="{{ primary_action_url }}" class="dz-confirm-primary">Re-enable</a>
      </div>
    {% endif %}
  {% else %}
    {# ── Off / pending / draft: checklist + dual button ────────────── #}
    {% if confirmations and confirmations | length > 0 %}
      <ul x-data="dzConfirmGate({{ confirmations | length }})"
          class="dz-confirm-checklist"
          data-dz-required-count="{{ confirmations | selectattr('required', 'equalto', true) | list | length }}">
        {% for item in confirmations %}
          <li class="dz-confirm-row" data-dz-required="{{ 'true' if item.required else 'false' }}">
            <input type="checkbox"
                   class="dz-confirm-checkbox"
                   {% if item.required %}@change="onToggle($event)"
                                          data-dz-required="true"{% endif %}
                   id="dz-confirm-{{ loop.index }}">
            <label for="dz-confirm-{{ loop.index }}" class="dz-confirm-row-label">
              <div class="dz-confirm-title">{{ item.title }}</div>
              {% if item.caption %}
                <div class="dz-confirm-caption">{{ item.caption }}</div>
              {% endif %}
            </label>
          </li>
        {% endfor %}

        {# ── Dual button ───────────────────────────────────────────── #}
        <li class="dz-confirm-actions">
          {% if secondary_action_url %}
            <a href="{{ secondary_action_url }}" class="dz-confirm-secondary">Save as draft</a>
          {% endif %}
          {% if primary_action_url %}
            <a :href="enabled ? '{{ primary_action_url }}' : null"
               :aria-disabled="!enabled"
               :class="{ 'is-disabled': !enabled }"
               class="dz-confirm-primary">
              Confirm and enable
            </a>
          {% endif %}
        </li>
      </ul>
    {% else %}
      {# No confirmations declared — show the dual button alone, primary
         enabled (no gate to satisfy). Useful for low-friction flows. #}
      <div class="dz-confirm-actions">
        {% if secondary_action_url %}
          <a href="{{ secondary_action_url }}" class="dz-confirm-secondary">Save as draft</a>
        {% endif %}
        {% if primary_action_url %}
          <a href="{{ primary_action_url }}" class="dz-confirm-primary">Confirm</a>
        {% endif %}
      </div>
    {% endif %}
  {% endif %}

  {# ── Audit footer (auto-detected from entity.audit) ────────────── #}
  {% if audit_enabled %}
    <p class="dz-confirm-audit">
      This action is recorded in the audit log with your account, IP address, and timestamp.
    </p>
  {% endif %}
</div>
{% endcall %}