@* ~/Views/Components/CanvassMgmt/CanvassingTabPage/ForApproval.cshtml
   Tab 3 — For Approval
   Rendered by CanvassingTabPageViewComponent (id = 3).
   Wire up your endpoint + card builder here following the same pattern as ForCanvass.cshtml.
*@

<div class="cv-placeholder">
    <i class="fas fa-clock"></i>
    <h3>For Approval</h3>
    <p>Wire up your endpoint and card builder here — follow the same pattern as ForCanvass.cshtml.</p>
</div>

@*
  ── PATTERN TO FOLLOW ──────────────────────────────────────────────────────
  1. Copy the filter bar + grid + pagination HTML from ForCanvass.cshtml.
  2. Change all id prefixes from "fc-" to "fa-" to avoid DOM conflicts.
  3. In the <script> block change the fetch URL to your approval endpoint.
  4. Customise the card footer buttons (e.g. Approve / Reject).

  Example footer for this tab:
      H.buildCardHtml(item, i => `
          <button class="cv-btn cv-btn-primary btn-approve" data-id="${i.supplierId}">
              <i class="fas fa-check"></i> Approve
          </button>
          <button class="cv-btn cv-btn-outline btn-reject" data-id="${i.supplierId}" style="border-color:#ff5c5c;color:#ff5c5c;">
              <i class="fas fa-times"></i> Reject
          </button>`)
*@