Datatable

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input type="text" placeholder="Search..." class="mv-input sm:w-48" data-mv-datatable-search="#mv_datatable_basic">
    </div>
    <div id="mv_datatable_basic" class="mv-card-table" data-mv-datatable="true" data-mv-datatable-page-size="5" data-mv-datatable-state-save="true">
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"><span class="mv-table-col-label">Label</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"><span class="mv-table-col-label">Method</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"><span class="mv-table-col-label">Status</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="lastSession">
                <span class="mv-table-col"><span class="mv-table-col-label">Last Session</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-16" data-mv-datatable-column="actions"></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select class="mv-select mv-select-sm w-16" name="perpage" data-mv-datatable-size="true"></select>per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div class="mv-datatable-pagination" data-mv-datatable-pagination="true"></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input type="text" placeholder="Search..." class="mv-input sm:w-48" data-mv-datatable-search="#mv_datatable_remote_source">
    </div>
    <div id="mv_datatable_remote_source" class="mv-card-table" data-mv-datatable-page-size="5" data-mv-datatable-state-save="true">
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"><span class="mv-table-col-label">Label</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"><span class="mv-table-col-label">Method</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"><span class="mv-table-col-label">Status</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="lastSession">
                <span class="mv-table-col"><span class="mv-table-col-label">Last Session</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="ipAddress">
                <span class="mv-table-col"><span class="mv-table-col-label">IP Address</span><span class="mv-table-col-sort"></span></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select class="mv-select mv-select-sm w-16" name="perpage" data-mv-datatable-size="true"></select>per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div class="mv-datatable-pagination" data-mv-datatable-pagination="true"></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>


<script>
'use strict';

/**
 * Remote Data Source Example
 *
 * This example demonstrates how to initialize a MVDataTable with a remote API data source.
 */
var MVDatatableRemoteDataDemo = (function () {
  // Track initialization state
  var isInitialized = false;
  var instance = null;

  // Resolve DataTable class from either legacy global or namespaced bundle export
  var resolveDataTableClass = function () {
    if (typeof window === 'undefined') {
      return null;
    }

    if (window.MVDataTable) {
      return window.MVDataTable;
    }

    if (window.MVUI && window.MVUI.MVDataTable) {
      return window.MVUI.MVDataTable;
    }

    return null;
  };

  // Main initialization function
  var init = function () {
    // Wait for MVDataTable to be available
    var MVDataTable = resolveDataTableClass();
    if (!MVDataTable) {
      console.warn('MVDataTable is not loaded yet. Retrying...');
      setTimeout(init, 100);
      return null;
    }

    // Prevent multiple initializations
    if (isInitialized && instance) {
      return instance;
    }

    // Get the datatable element
    var datatableEl = document.getElementById('mv_datatable_remote_source');
    if (!datatableEl) {
      return null;
    }

    // Clean up any previous instances
    if (datatableEl.hasAttribute('data-mv-datatable-initialized')) {
      if (
        typeof MVDataTable !== 'undefined' &&
        typeof MVDataTable.getInstance === 'function'
      ) {
        var oldInstance = MVDataTable.getInstance(datatableEl);
        if (oldInstance && typeof oldInstance.dispose === 'function') {
          oldInstance.dispose();
        }
      }

      datatableEl.removeAttribute('data-mv-datatable-initialized');
      if (datatableEl.instance) {
        delete datatableEl.instance;
      }
    }

    // Initialize datatable with remote data source
    var datatable = new MVDataTable(datatableEl, {
      apiEndpoint: 'http://localhost/pulse-core/dist/html/demo2/api/default.json',
      requestMethod: 'GET',
      requestHeaders: {
        'Content-Type': 'application/json',
        Accept: 'application/json',
      },

      // Format the API response, ensuring pagination data is properly mapped
      mapResponse: function (response) {
        if (response && response.data) {
          return {
            data: response.data,
            totalCount: response.totalCount,
            // Include pagination data from the API response
            page: response.page || 1,
            pageSize: response.pageSize || 5,
            totalPages:
              response.totalPages ||
              Math.ceil(response.totalCount / (response.pageSize || 5)),
          };
        } else if (Array.isArray(response)) {
          return {
            data: response,
            totalCount: response.length,
            page: 1,
            pageSize: 5,
            totalPages: Math.ceil(response.length / 5),
          };
        } else {
          return {
            data: [],
            totalCount: 0,
            page: 1,
            pageSize: 5,
            totalPages: 1,
          };
        }
      },

      // Custom templates for column rendering
      columns: {
        label: {
          title: 'Label',
        },
        method: {
          title: 'Method',
        },
        status: {
          render: function (value, row) {
            return (
              '<span class="mv-badge ' +
              row.status +
              '">' +
              row.statusLabel +
              ''
            );
          },
        },
        lastSession: {
          render: function (value) {
            return '<span class="text-gray-600">' + value + '';
          },
        },
        ipAddress: {
          title: 'IP Address',
        },
      },

      // Core configuration
      pageSize: 5,
      stateSave: true,

      // Add callbacks for pagination events
      callbacks: {
        afterDraw: function () {
          // Add any custom behavior after drawing the table
        },
      },
    });

    // Mark as initialized and store instance
    isInitialized = true;
    instance = datatable;

    return instance;
  };

  // Public API
  return {
    init: function () {
      return init();
    },
  };
})();

/**
 * Initialize the datatable when the page loads
 */
// Function to safely initialize only once
function safeInitialize() {
  var element = document.getElementById('mv_datatable_remote_source');
  if (!element) {
    return;
  }

  var instance = MVDatatableRemoteDataDemo.init();
  if (instance) {
    window.datatableInstance = instance;
  }
}

// Only attach the event listener once
if (document.readyState === 'loading') {
  document.addEventListener('DOMContentLoaded', safeInitialize, { once: true });
} else {
  // DOM is already loaded, initialize immediately
  setTimeout(safeInitialize, 1);
}
</script>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input type="text" placeholder="Search..." class="mv-input sm:w-48" data-mv-datatable-search="#mv_datatable_group_check">
    </div>
    <div id="mv_datatable_group_check" class="mv-card-table" data-mv-datatable="true" data-mv-datatable-page-size="5" data-mv-datatable-state-save="true">
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table mv-table-border" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-5">
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-check="true">
              </th>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"><span class="mv-table-col-label">Label</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"><span class="mv-table-col-label">Method</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col asc"><span class="mv-table-col-label">Status</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="lastSession">
                <span class="mv-table-col"><span class="mv-table-col-label">Last Session</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th scope="col" class="w-16" data-mv-datatable-column="actions"></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="0">
              </td>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="1">
              </td>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="2">
              </td>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="3">
              </td>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="4">
              </td>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="5">
              </td>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="6">
              </td>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="7">
              </td>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="8">
              </td>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="9">
              </td>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="10">
              </td>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="11">
              </td>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="12">
              </td>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="13">
              </td>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="14">
              </td>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="15">
              </td>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="16">
              </td>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
            <tr>
              <td>
                <input type="checkbox" class="mv-checkbox" data-mv-datatable-row-check="true" value="17">
              </td>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Edit">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil" aria-hidden="true">
                      <path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button><button type="button" class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline" aria-label="Delete">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash" aria-hidden="true">
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select class="mv-select mv-select-sm w-16" name="perpage" data-mv-datatable-size="true"></select>per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div class="mv-datatable-pagination" data-mv-datatable-pagination="true"></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input type="text" placeholder="Search..." class="mv-input sm:w-48" data-mv-datatable-search="#mv_datatable_locked_columns">
    </div>
    <div id="mv_datatable_locked_columns" class="mv-card-table">
      <div class="mv-table-wrapper mv-scrollable max-w-full overflow-auto">
        <table class="mv-table min-w-[980px]" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th data-mv-datatable-column="id">
                <span class="mv-table-col"><span class="mv-table-col-label">ID</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="label">
                <span class="mv-table-col"><span class="mv-table-col-label">Label</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="method">
                <span class="mv-table-col"><span class="mv-table-col-label">Method</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="status">
                <span class="mv-table-col"><span class="mv-table-col-label">Status</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="lastSession">
                <span class="mv-table-col"><span class="mv-table-col-label">Last Session</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="ipAddress">
                <span class="mv-table-col"><span class="mv-table-col-label">IP Address</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="region">
                <span class="mv-table-col"><span class="mv-table-col-label">Region</span><span class="mv-table-col-sort"></span></span>
              </th>
              <th data-mv-datatable-column="team">
                <span class="mv-table-col"><span class="mv-table-col-label">Team</span><span class="mv-table-col-sort"></span></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>Accounting</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
              <td>EU-West</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>2</td>
              <td>Compliance</td>
              <td>SSH</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
              <td>US-East</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>3</td>
              <td>Support</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
              <td>APAC</td>
              <td>Service</td>
            </tr>
            <tr>
              <td>4</td>
              <td>Legal</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
              <td>EU-Central</td>
              <td>Audit</td>
            </tr>
            <tr>
              <td>5</td>
              <td>Sales</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
              <td>US-West</td>
              <td>Growth</td>
            </tr>
            <tr>
              <td>6</td>
              <td>Finance</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
              <td>MEA</td>
              <td>Treasury</td>
            </tr>
            <tr>
              <td>7</td>
              <td>Operations</td>
              <td>OpenID</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
              <td>LATAM</td>
              <td>Platform</td>
            </tr>
            <tr>
              <td>8</td>
              <td>Marketing</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
              <td>ANZ</td>
              <td>Brand</td>
            </tr>
            <tr>
              <td>9</td>
              <td>Engineering</td>
              <td>Basic auth</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
              <td>EU-West</td>
              <td>Product</td>
            </tr>
            <tr>
              <td>10</td>
              <td>Procurement</td>
              <td>OAuth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
              <td>US-East</td>
              <td>Supply</td>
            </tr>
            <tr>
              <td>11</td>
              <td>HR</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
              <td>APAC</td>
              <td>People</td>
            </tr>
            <tr>
              <td>12</td>
              <td>IT</td>
              <td>LDAP</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
              <td>EU-Central</td>
              <td>Infra</td>
            </tr>
            <tr>
              <td>13</td>
              <td>Security</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
              <td>US-West</td>
              <td>Labs</td>
            </tr>
            <tr>
              <td>14</td>
              <td>Research</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
              <td>MEA</td>
              <td>Revenue</td>
            </tr>
            <tr>
              <td>15</td>
              <td>Logistics</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
              <td>LATAM</td>
              <td>Compliance</td>
            </tr>
            <tr>
              <td>16</td>
              <td>Customer Success</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
              <td>ANZ</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>17</td>
              <td>Partnerships</td>
              <td>Certificate</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
              <td>EU-West</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>18</td>
              <td>Platform</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
              <td>US-East</td>
              <td>Service</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select class="mv-select mv-select-sm w-16" name="perpage" data-mv-datatable-size="true"></select>per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div class="mv-datatable-pagination" data-mv-datatable-pagination="true"></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>
<script>
'use strict';

(function () {
  function resolveDataTableClass() {
    if (typeof window === 'undefined') return null;
    if (window.MVDataTable) return window.MVDataTable;
    if (window.MVUI && window.MVUI.MVDataTable) return window.MVUI.MVDataTable;
    return null;
  }

  function init() {
    var MVDataTable = resolveDataTableClass();
    var element = document.getElementById('mv_datatable_locked_columns');
    if (!MVDataTable || !element) {
      setTimeout(init, 100);
      return;
    }

    new MVDataTable(element, {
      pageSize: 5,
      stateSave: false,
      lockedLayout: {
        stickyHeader: true,
        stickyColumns: {
          left: ['id', 'label'],
          right: ['team'],
        },
      },
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init, { once: true });
  } else {
    setTimeout(init, 1);
  }
})();


</script>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input type="text" placeholder="Search..." class="mv-input sm:w-48" data-mv-datatable-search="#mv_datatable_locked_rows">
    </div>
    <div id="mv_datatable_locked_rows" class="mv-card-table">
      <div class="mv-table-wrapper mv-scrollable max-h-[420px] overflow-auto">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th data-mv-datatable-column="id">ID</th>
              <th data-mv-datatable-column="label">Label</th>
              <th data-mv-datatable-column="method">Method</th>
              <th data-mv-datatable-column="status">Status</th>
              <th data-mv-datatable-column="lastSession">Last Session</th>
              <th data-mv-datatable-column="ipAddress">IP Address</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>Accounting</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
            </tr>
            <tr>
              <td>2</td>
              <td>Compliance</td>
              <td>SSH</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
            </tr>
            <tr>
              <td>3</td>
              <td>Support</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
            </tr>
            <tr>
              <td>4</td>
              <td>Legal</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
            </tr>
            <tr>
              <td>5</td>
              <td>Sales</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
            </tr>
            <tr>
              <td>6</td>
              <td>Finance</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
            </tr>
            <tr>
              <td>7</td>
              <td>Operations</td>
              <td>OpenID</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
            </tr>
            <tr>
              <td>8</td>
              <td>Marketing</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
            </tr>
            <tr>
              <td>9</td>
              <td>Engineering</td>
              <td>Basic auth</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
            </tr>
            <tr>
              <td>10</td>
              <td>Procurement</td>
              <td>OAuth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
            </tr>
            <tr>
              <td>11</td>
              <td>HR</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
            </tr>
            <tr>
              <td>12</td>
              <td>IT</td>
              <td>LDAP</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
            </tr>
            <tr>
              <td>13</td>
              <td>Security</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
            </tr>
            <tr>
              <td>14</td>
              <td>Research</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
            </tr>
            <tr>
              <td>15</td>
              <td>Logistics</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
            </tr>
            <tr>
              <td>16</td>
              <td>Customer Success</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
            </tr>
            <tr>
              <td>17</td>
              <td>Partnerships</td>
              <td>Certificate</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
            </tr>
            <tr>
              <td>18</td>
              <td>Platform</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select class="mv-select mv-select-sm w-16" name="perpage" data-mv-datatable-size="true"></select>per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div class="mv-datatable-pagination" data-mv-datatable-pagination="true"></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<script>
'use strict';

(function () {
  function resolveDataTableClass() {
    if (typeof window === 'undefined') return null;
    if (window.MVDataTable) return window.MVDataTable;
    if (window.MVUI && window.MVUI.MVDataTable) return window.MVUI.MVDataTable;
    return null;
  }

  function init() {
    var MVDataTable = resolveDataTableClass();
    var element = document.getElementById('mv_datatable_locked_rows');
    if (!MVDataTable || !element) {
      setTimeout(init, 100);
      return;
    }

    new MVDataTable(element, {
      pageSize: 10,
      stateSave: false,
      lockedLayout: {
        stickyHeader: true,
        stickyRows: {
          top: 1,
          bottom: 1,
        },
      },
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init, { once: true });
  } else {
    setTimeout(init, 1);
  }
})();

</script>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_locked_combined"
      />
    </div>
    <div id="mv_datatable_locked_combined" class="mv-card-table">
      <div class="mv-table-wrapper mv-scrollable max-h-[420px] overflow-auto">
        <table class="mv-table min-w-[980px]" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th data-mv-datatable-column="id">ID</th>
              <th data-mv-datatable-column="label">Label</th>
              <th data-mv-datatable-column="method">Method</th>
              <th data-mv-datatable-column="status">Status</th>
              <th data-mv-datatable-column="lastSession">Last Session</th>
              <th data-mv-datatable-column="ipAddress">IP Address</th>
              <th data-mv-datatable-column="region">Region</th>
              <th data-mv-datatable-column="team">Team</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>Accounting</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
              <td>EU-West</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>2</td>
              <td>Compliance</td>
              <td>SSH</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
              <td>US-East</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>3</td>
              <td>Support</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
              <td>APAC</td>
              <td>Service</td>
            </tr>
            <tr>
              <td>4</td>
              <td>Legal</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
              <td>EU-Central</td>
              <td>Audit</td>
            </tr>
            <tr>
              <td>5</td>
              <td>Sales</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
              <td>US-West</td>
              <td>Growth</td>
            </tr>
            <tr>
              <td>6</td>
              <td>Finance</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
              <td>MEA</td>
              <td>Treasury</td>
            </tr>
            <tr>
              <td>7</td>
              <td>Operations</td>
              <td>OpenID</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
              <td>LATAM</td>
              <td>Platform</td>
            </tr>
            <tr>
              <td>8</td>
              <td>Marketing</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
              <td>ANZ</td>
              <td>Brand</td>
            </tr>
            <tr>
              <td>9</td>
              <td>Engineering</td>
              <td>Basic auth</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
              <td>EU-West</td>
              <td>Product</td>
            </tr>
            <tr>
              <td>10</td>
              <td>Procurement</td>
              <td>OAuth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
              <td>US-East</td>
              <td>Supply</td>
            </tr>
            <tr>
              <td>11</td>
              <td>HR</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
              <td>APAC</td>
              <td>People</td>
            </tr>
            <tr>
              <td>12</td>
              <td>IT</td>
              <td>LDAP</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
              <td>EU-Central</td>
              <td>Infra</td>
            </tr>
            <tr>
              <td>13</td>
              <td>Security</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
              <td>US-West</td>
              <td>Labs</td>
            </tr>
            <tr>
              <td>14</td>
              <td>Research</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
              <td>MEA</td>
              <td>Revenue</td>
            </tr>
            <tr>
              <td>15</td>
              <td>Logistics</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
              <td>LATAM</td>
              <td>Compliance</td>
            </tr>
            <tr>
              <td>16</td>
              <td>Customer Success</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
              <td>ANZ</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>17</td>
              <td>Partnerships</td>
              <td>Certificate</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
              <td>EU-West</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>18</td>
              <td>Platform</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
              <td>US-East</td>
              <td>Service</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<script>
'use strict';

(function () {
  function resolveDataTableClass() {
    if (typeof window === 'undefined') return null;
    if (window.MVDataTable) return window.MVDataTable;
    if (window.MVUI && window.MVUI.MVDataTable) return window.MVUI.MVDataTable;
    return null;
  }

  function init() {
    var MVDataTable = resolveDataTableClass();
    var element = document.getElementById('mv_datatable_locked_combined');
    if (!MVDataTable || !element) {
      setTimeout(init, 100);
      return;
    }

    new MVDataTable(element, {
      pageSize: 5,
      stateSave: false,
      lockedLayout: {
        stickyHeader: true,
        stickyRows: {
          top: 1,
        },
        stickyColumns: {
          left: ['id', 'label'],
          right: ['team'],
        },
      },
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init, { once: true });
  } else {
    setTimeout(init, 1);
  }
})();

</script>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#kt_datatable_non_sortable"
      />
    </div>
    <div
      id="kt_datatable_non_sortable"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
      data-mv-datatable-state-save="true"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-20"
                data-mv-datatable-column="method"
                data-mv-datatable-column-sort="false"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method (fixed)</span></span
                >
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-16"
                data-mv-datatable-column="actions"
              ></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div
      class="mv-card-header min-h-16 flex w-full flex-wrap items-center justify-between gap-3"
    >
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#kt_datatable_programmatic"
      /><button
        type="button"
        id="kt_datatable_programmatic_reload_btn"
        class="mv-btn mv-btn-sm mv-btn-primary shrink-0"
      >
        Reload
      </button>
    </div>
    <div
      id="kt_datatable_programmatic"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
      data-mv-datatable-state-save="true"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-16"
                data-mv-datatable-column="actions"
              ></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_events"
      />
    </div>
    <div
      id="mv_datatable_events"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
      data-mv-datatable-state-save="true"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-5">
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-check="true"
                />
              </th>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-16"
                data-mv-datatable-column="actions"
              ></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="0"
                />
              </td>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="1"
                />
              </td>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="2"
                />
              </td>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="3"
                />
              </td>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="4"
                />
              </td>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="5"
                />
              </td>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="6"
                />
              </td>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="7"
                />
              </td>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="8"
                />
              </td>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="9"
                />
              </td>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="10"
                />
              </td>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="11"
                />
              </td>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="12"
                />
              </td>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="13"
                />
              </td>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="14"
                />
              </td>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="15"
                />
              </td>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="16"
                />
              </td>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="17"
                />
              </td>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div
      class="mv-card-header border-b border-border py-2.5 text-xs font-medium text-muted-foreground"
    >
      Console — logs all events via both <code>.on()</code> and<!-- -->
      <code>addEventListener</code> patterns
    </div>
    <pre
      id="mv_datatable_events_log"
      class="mv-card-content max-h-48 overflow-y-auto p-4 font-mono text-xs leading-relaxed text-muted-foreground"
    >
Waiting for events…</pre
    >
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16 flex flex-wrap items-center gap-3">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input mv-input-sm sm:w-48"
        data-mv-datatable-search="#mv_datatable_remote_filters"
      /><label class="flex items-center gap-2 text-sm"
        ><span class="text-muted-foreground">Status</span
        ><select
          id="mv_datatable_remote_filters_status"
          class="mv-select mv-select-sm w-44"
        >
          <option value="" selected="">All</option>
          <option value="mv-badge-success">Active</option>
          <option value="mv-badge-destructive">Rejected</option>
          <option value="mv-badge-warning">Pending</option>
          <option value="mv-badge-primary">Verified</option>
          <option value="mv-badge-secondary">Draft</option>
          <option value="mv-badge-info">In Review</option>
          <option value="mv-badge-mono">Archived</option>
        </select></label
      ><button
        type="button"
        id="mv_datatable_remote_filters_apply"
        class="mv-btn mv-btn-sm mv-btn-primary"
      >
        Apply filter
      </button>
    </div>
    <div
      id="mv_datatable_remote_filters"
      class="mv-card-table relative"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="ipAddress">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">IP Address</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_remote_actions"
      />
    </div>
    <div
      id="mv_datatable_remote_actions"
      class="mv-card-table relative"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-28 text-end"
                data-mv-datatable-column="actions"
                data-mv-datatable-column-sort="false"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Actions</span></span
                >
              </th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search name, department, or office…"
        class="mv-input sm:w-72"
        data-mv-datatable-search="#mv_datatable_local_callbacks"
      />
    </div>
    <div
      id="mv_datatable_local_callbacks"
      class="mv-card-table"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-40" data-mv-datatable-column="name">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Name</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-32"
                data-mv-datatable-column="department"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Department</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="office">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Office</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-28 text-end"
                data-mv-datatable-column="salary"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Salary</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Ana Costa</td>
              <td>Engineering</td>
              <td>New York</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td class="text-end font-mono text-sm">$118,400</td>
            </tr>
            <tr>
              <td>Ben Okafor</td>
              <td>Design</td>
              <td>London</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td class="text-end font-mono text-sm">$96,200</td>
            </tr>
            <tr>
              <td>Chen Wei</td>
              <td>Support</td>
              <td>Singapore</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td class="text-end font-mono text-sm">$124,900</td>
            </tr>
            <tr>
              <td>Dana Singh</td>
              <td>Finance</td>
              <td>Austin</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td class="text-end font-mono text-sm">$72,500</td>
            </tr>
            <tr>
              <td>Eli Navarro</td>
              <td>Marketing</td>
              <td>Berlin</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td class="text-end font-mono text-sm">$131,000</td>
            </tr>
            <tr>
              <td>Fatima Noor</td>
              <td>Operations</td>
              <td>Dubai</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td class="text-end font-mono text-sm">$88,300</td>
            </tr>
            <tr>
              <td>Gus Park</td>
              <td>Engineering</td>
              <td>Toronto</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td class="text-end font-mono text-sm">$91,750</td>
            </tr>
            <tr>
              <td>Hana Ito</td>
              <td>Design</td>
              <td>Tokyo</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td class="text-end font-mono text-sm">$69,900</td>
            </tr>
            <tr>
              <td>Ivan Petrov</td>
              <td>Support</td>
              <td>New York</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td class="text-end font-mono text-sm">$102,000</td>
            </tr>
            <tr>
              <td>Jules Martin</td>
              <td>Finance</td>
              <td>London</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td class="text-end font-mono text-sm">$119,500</td>
            </tr>
            <tr>
              <td>Kira Bloom</td>
              <td>Marketing</td>
              <td>Singapore</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td class="text-end font-mono text-sm">$84,200</td>
            </tr>
            <tr>
              <td>Leo Santos</td>
              <td>Operations</td>
              <td>Austin</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td class="text-end font-mono text-sm">$97,600</td>
            </tr>
            <tr>
              <td>Ana Costa</td>
              <td>Engineering</td>
              <td>Berlin</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td class="text-end font-mono text-sm">$118,400</td>
            </tr>
            <tr>
              <td>Ben Okafor</td>
              <td>Design</td>
              <td>Dubai</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td class="text-end font-mono text-sm">$96,200</td>
            </tr>
            <tr>
              <td>Chen Wei</td>
              <td>Support</td>
              <td>Toronto</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td class="text-end font-mono text-sm">$124,900</td>
            </tr>
            <tr>
              <td>Dana Singh</td>
              <td>Finance</td>
              <td>Tokyo</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td class="text-end font-mono text-sm">$72,500</td>
            </tr>
            <tr>
              <td>Eli Navarro</td>
              <td>Marketing</td>
              <td>New York</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td class="text-end font-mono text-sm">$131,000</td>
            </tr>
            <tr>
              <td>Fatima Noor</td>
              <td>Operations</td>
              <td>London</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td class="text-end font-mono text-sm">$88,300</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full gap-8">
  <div class="space-y-3">
    <h3 class="text-base font-medium">Slow request (spinner)</h3>
    <p class="text-muted-foreground text-sm">
      <code class="text-foreground">mapRequest</code> adds a<!-- -->
      <code class="text-foreground">slow</code> millisecond delay so the default
      loading overlay is visible on each fetch.
    </p>
    <div class="mv-card">
      <div class="mv-card-header min-h-16">
        <input
          type="text"
          placeholder="Search..."
          class="mv-input sm:w-48"
          data-mv-datatable-search="#mv_datatable_remote_slow"
        />
      </div>
      <div
        id="mv_datatable_remote_slow"
        class="mv-card-table relative"
        data-mv-datatable-page-size="5"
      >
        <div class="mv-table-wrapper mv-scrollable">
          <table class="mv-table" data-mv-datatable-table="true">
            <thead>
              <tr>
                <th scope="col" class="w-30" data-mv-datatable-column="label">
                  <span class="mv-table-col"
                    ><span class="mv-table-col-label">Label</span
                    ><span class="mv-table-col-sort"></span
                  ></span>
                </th>
                <th scope="col" class="w-20" data-mv-datatable-column="method">
                  <span class="mv-table-col"
                    ><span class="mv-table-col-label">Method</span
                    ><span class="mv-table-col-sort"></span
                  ></span>
                </th>
                <th scope="col" class="w-24" data-mv-datatable-column="status">
                  <span class="mv-table-col"
                    ><span class="mv-table-col-label">Status</span
                    ><span class="mv-table-col-sort"></span
                  ></span>
                </th>
              </tr>
            </thead>
            <tbody></tbody>
          </table>
        </div>
        <template><!--begin:pagination--></template>
        <div class="mv-datatable-toolbar">
          <div class="mv-datatable-length">
            Show<select
              class="mv-select mv-select-sm w-16"
              name="perpage"
              data-mv-datatable-size="true"
            ></select
            >per page
          </div>
          <div class="mv-datatable-info">
            <span data-mv-datatable-info="true"></span>
            <div
              class="mv-datatable-pagination"
              data-mv-datatable-pagination="true"
            ></div>
          </div>
        </div>
        <template><!--end:pagination--></template>
      </div>
    </div>
  </div>
  <div class="space-y-3">
    <h3 class="text-base font-medium">Empty result</h3>
    <p class="text-muted-foreground text-sm">
      Uses <code class="text-foreground">mapRequest</code> with
      <code class="text-foreground">empty=1</code>
      <!-- -->and a custom
      <code class="text-foreground">infoEmpty</code> template.
    </p>
    <div class="mv-card">
      <div
        id="mv_datatable_remote_empty"
        class="mv-card-table relative"
        data-mv-datatable-page-size="5"
      >
        <div class="mv-table-wrapper mv-scrollable">
          <table class="mv-table" data-mv-datatable-table="true">
            <thead>
              <tr>
                <th scope="col" class="w-30" data-mv-datatable-column="label">
                  <span class="mv-table-col"
                    ><span class="mv-table-col-label">Label</span
                    ><span class="mv-table-col-sort"></span
                  ></span>
                </th>
                <th scope="col" class="w-20" data-mv-datatable-column="method">
                  <span class="mv-table-col"
                    ><span class="mv-table-col-label">Method</span
                    ><span class="mv-table-col-sort"></span
                  ></span>
                </th>
              </tr>
            </thead>
            <tbody></tbody>
          </table>
        </div>
        <template><!--begin:pagination--></template>
        <div class="mv-datatable-toolbar">
          <div class="mv-datatable-length">
            Show<select
              class="mv-select mv-select-sm w-16"
              name="perpage"
              data-mv-datatable-size="true"
            ></select
            >per page
          </div>
          <div class="mv-datatable-info">
            <span data-mv-datatable-info="true"></span>
            <div
              class="mv-datatable-pagination"
              data-mv-datatable-pagination="true"
            ></div>
          </div>
        </div>
        <template><!--end:pagination--></template>
      </div>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16 flex flex-wrap items-center gap-3">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_remote_selection"
      /><button
        type="button"
        id="mv_datatable_remote_selection_log"
        class="mv-btn mv-btn-sm mv-btn-outline"
      >
        Log selection
      </button>
    </div>
    <div
      id="mv_datatable_remote_selection"
      class="mv-card-table relative"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th
                scope="col"
                class="w-10"
                data-mv-datatable-column="id"
                data-mv-datatable-column-sort="false"
              >
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-check="true"
                />
              </th>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="0"
                />
              </td>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="1"
                />
              </td>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="2"
                />
              </td>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="3"
                />
              </td>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="4"
                />
              </td>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="5"
                />
              </td>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="6"
                />
              </td>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="7"
                />
              </td>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="8"
                />
              </td>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="9"
                />
              </td>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="10"
                />
              </td>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="11"
                />
              </td>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="12"
                />
              </td>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="13"
                />
              </td>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="14"
                />
              </td>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="15"
                />
              </td>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="16"
                />
              </td>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="17"
                />
              </td>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_state_persistence"
      />
    </div>
    <div
      id="mv_datatable_state_persistence"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
      data-mv-datatable-state-save="true"
      data-mv-datatable-state-namespace="mv-docs-state-demo"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table mv-table-border" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-5">
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-check="true"
                />
              </th>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="0"
                />
              </td>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="1"
                />
              </td>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="2"
                />
              </td>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="3"
                />
              </td>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="4"
                />
              </td>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="5"
                />
              </td>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="6"
                />
              </td>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="7"
                />
              </td>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="8"
                />
              </td>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="9"
                />
              </td>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="10"
                />
              </td>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="11"
                />
              </td>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="12"
                />
              </td>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="13"
                />
              </td>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="14"
                />
              </td>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="15"
                />
              </td>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="16"
                />
              </td>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="17"
                />
              </td>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div class="mv-card-content">
      <div class="flex items-center gap-2 text-sm text-muted-foreground">
        <svg
          xmlns="http://www.w3.org/2000/svg"
          width="24"
          height="24"
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
          class="lucide lucide-info size-4 shrink-0"
          aria-hidden="true"
        >
          <circle cx="12" cy="12" r="10"></circle>
          <path d="M12 16v-4"></path>
          <path d="M12 8h.01"></path></svg
        ><span
          >State is saved to localStorage. Sort, paginate, select rows, then
          refresh the page — your state persists.</span
        >
      </div>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div
      class="mv-card-header flex flex-wrap items-center gap-x-3 gap-y-2.5 py-4"
    >
      <input
        type="text"
        placeholder="Search..."
        class="mv-input mv-input-sm sm:w-48"
        data-mv-datatable-search="#mv_datatable_local_filters"
      /><label class="flex items-center gap-2 text-sm"
        ><span class="text-muted-foreground">Status</span
        ><select
          id="mv_datatable_local_filters_status"
          class="mv-select mv-select-sm w-44"
        >
          <option value="" selected="">All</option>
          <option value="mv-badge-success">Active</option>
          <option value="mv-badge-destructive">Rejected</option>
          <option value="mv-badge-warning">Pending</option>
          <option value="mv-badge-primary">Verified</option>
          <option value="mv-badge-secondary">Draft</option>
          <option value="mv-badge-info">In Review</option>
          <option value="mv-badge-mono">Archived</option>
        </select></label
      ><label class="flex items-center gap-2 text-sm"
        ><span class="text-muted-foreground">Method</span
        ><select
          id="mv_datatable_local_filters_method"
          class="mv-select mv-select-sm w-36"
        >
          <option value="" selected="">All</option>
          <option value="API Key">API Key</option>
          <option value="Basic auth">Basic auth</option>
          <option value="Biometric">Biometric</option>
          <option value="Certificate">Certificate</option>
          <option value="FIDO U2F">FIDO U2F</option>
          <option value="FIDO2">FIDO2</option>
          <option value="Kerberos">Kerberos</option>
          <option value="LDAP">LDAP</option>
          <option value="Magic Link">Magic Link</option>
          <option value="OAuth">OAuth</option>
          <option value="OpenID">OpenID</option>
          <option value="Passkey">Passkey</option>
          <option value="SAML">SAML</option>
          <option value="SSH">SSH</option>
          <option value="Smart Card">Smart Card</option>
          <option value="Token">Token</option>
          <option value="Web">Web</option>
          <option value="WebAuthn">WebAuthn</option>
        </select></label
      >
      <div class="flex items-center gap-2">
        <button
          type="button"
          id="mv_datatable_local_filters_clear"
          class="mv-btn mv-btn-sm mv-btn-outline"
        >
          Clear</button
        ><button
          type="button"
          id="mv_datatable_local_filters_apply"
          class="mv-btn mv-btn-sm mv-btn-primary"
        >
          Apply
        </button>
      </div>
    </div>
    <div
      id="mv_datatable_local_filters"
      class="mv-card-table relative"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_bulk_actions"
      />
    </div>
    <div
      id="mv_datatable_bulk_actions"
      class="mv-card-table"
      data-mv-datatable-page-size="5"
    >
      <div
        id="mv_datatable_bulk_actions_bar"
        class="hidden items-center gap-3 rounded-t-lg border-b border-border bg-muted/50 px-4 py-2.5 text-sm"
      >
        <span id="mv_datatable_bulk_actions_count" class="font-medium"
          >0 selected</span
        >
        <div class="flex gap-2">
          <button
            type="button"
            class="mv-btn mv-btn-sm mv-btn-destructive-outline"
            data-mv-datatable-bulk-action="delete"
          >
            Delete</button
          ><button
            type="button"
            class="mv-btn mv-btn-sm mv-btn-outline"
            data-mv-datatable-bulk-action="export"
          >
            Export</button
          ><button
            type="button"
            class="mv-btn mv-btn-sm mv-btn-outline"
            data-mv-datatable-bulk-action="tag"
          >
            Tag
          </button>
        </div>
      </div>
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table mv-table-border" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-5">
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-check="true"
                />
              </th>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col asc"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-16"
                data-mv-datatable-column="actions"
              ></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="0"
                />
              </td>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="1"
                />
              </td>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="2"
                />
              </td>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="3"
                />
              </td>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="4"
                />
              </td>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="5"
                />
              </td>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="6"
                />
              </td>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="7"
                />
              </td>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="8"
                />
              </td>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="9"
                />
              </td>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="10"
                />
              </td>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="11"
                />
              </td>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="12"
                />
              </td>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="13"
                />
              </td>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="14"
                />
              </td>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="15"
                />
              </td>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="16"
                />
              </td>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>
                <input
                  type="checkbox"
                  class="mv-checkbox"
                  data-mv-datatable-row-check="true"
                  value="17"
                />
              </td>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_fixed_layout"
      />
    </div>
    <div id="mv_datatable_fixed_layout" class="mv-card-table">
      <div class="mv-table-wrapper mv-scrollable">
        <table
          class="mv-table"
          style="table-layout: fixed; width: 100%"
          data-mv-datatable-table="true"
        >
          <colgroup>
            <col style="width: 50px" />
            <col style="width: 120px" />
            <col style="width: 90px" />
            <col style="width: 100px" />
            <col style="width: 110px" />
            <col style="width: 110px" />
            <col style="width: 90px" />
            <col />
          </colgroup>
          <thead>
            <tr>
              <th scope="col" data-mv-datatable-column="id">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">ID</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="lastSession">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="ipAddress">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">IP Address</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="region">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Region</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="team">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Team</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Accounting
              </td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
              <td>EU-West</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>2</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Compliance
              </td>
              <td>SSH</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
              <td>US-East</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>3</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Support
              </td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
              <td>APAC</td>
              <td>Service</td>
            </tr>
            <tr>
              <td>4</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Legal
              </td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
              <td>EU-Central</td>
              <td>Audit</td>
            </tr>
            <tr>
              <td>5</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Sales
              </td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
              <td>US-West</td>
              <td>Growth</td>
            </tr>
            <tr>
              <td>6</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Finance
              </td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
              <td>MEA</td>
              <td>Treasury</td>
            </tr>
            <tr>
              <td>7</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Operations
              </td>
              <td>OpenID</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
              <td>LATAM</td>
              <td>Platform</td>
            </tr>
            <tr>
              <td>8</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Marketing
              </td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
              <td>ANZ</td>
              <td>Brand</td>
            </tr>
            <tr>
              <td>9</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Engineering
              </td>
              <td>Basic auth</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
              <td>EU-West</td>
              <td>Product</td>
            </tr>
            <tr>
              <td>10</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Procurement
              </td>
              <td>OAuth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
              <td>US-East</td>
              <td>Supply</td>
            </tr>
            <tr>
              <td>11</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                HR
              </td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
              <td>APAC</td>
              <td>People</td>
            </tr>
            <tr>
              <td>12</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                IT
              </td>
              <td>LDAP</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
              <td>EU-Central</td>
              <td>Infra</td>
            </tr>
            <tr>
              <td>13</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Security
              </td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
              <td>US-West</td>
              <td>Labs</td>
            </tr>
            <tr>
              <td>14</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Research
              </td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
              <td>MEA</td>
              <td>Revenue</td>
            </tr>
            <tr>
              <td>15</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Logistics
              </td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
              <td>LATAM</td>
              <td>Compliance</td>
            </tr>
            <tr>
              <td>16</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Customer Success
              </td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
              <td>ANZ</td>
              <td>Ops</td>
            </tr>
            <tr>
              <td>17</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Partnerships
              </td>
              <td>Certificate</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
              <td>EU-West</td>
              <td>Security</td>
            </tr>
            <tr>
              <td>18</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Platform
              </td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
              <td>US-East</td>
              <td>Service</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_column_widths"
      />
    </div>
    <div id="mv_datatable_column_widths" class="mv-card-table">
      <div class="mv-table-wrapper mv-scrollable">
        <table
          class="mv-table"
          style="table-layout: fixed; width: 100%"
          data-mv-datatable-table="true"
        >
          <colgroup>
            <col style="width: 60px" />
            <col style="width: 140px" />
            <col style="width: 100px" />
            <col style="width: 110px" />
            <col style="width: 120px" />
            <col />
          </colgroup>
          <thead>
            <tr>
              <th
                scope="col"
                data-mv-datatable-column="id"
                data-mv-datatable-column-width="60px"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">ID</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                data-mv-datatable-column="label"
                data-mv-datatable-column-width="140px"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                data-mv-datatable-column="method"
                data-mv-datatable-column-width="100px"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                data-mv-datatable-column="status"
                data-mv-datatable-column-width="110px"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                data-mv-datatable-column="lastSession"
                data-mv-datatable-column-width="120px"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" data-mv-datatable-column="ipAddress">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">IP Address</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Accounting
              </td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>22 Jul 2024</td>
              <td>192.168.1.10</td>
            </tr>
            <tr>
              <td>2</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Compliance
              </td>
              <td>SSH</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>18 Jul 2024</td>
              <td>192.168.1.11</td>
            </tr>
            <tr>
              <td>3</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Support
              </td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>15 Jul 2024</td>
              <td>192.168.1.2</td>
            </tr>
            <tr>
              <td>4</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Legal
              </td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>30 Jul 2024</td>
              <td>192.168.1.12</td>
            </tr>
            <tr>
              <td>5</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Sales
              </td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>28 Jul 2024</td>
              <td>10.0.0.2</td>
            </tr>
            <tr>
              <td>6</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Finance
              </td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>16 Jul 2024</td>
              <td>192.168.1.4</td>
            </tr>
            <tr>
              <td>7</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Operations
              </td>
              <td>OpenID</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>11 Aug 2024</td>
              <td>192.168.1.13</td>
            </tr>
            <tr>
              <td>8</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Marketing
              </td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>19 Jul 2024</td>
              <td>192.168.1.14</td>
            </tr>
            <tr>
              <td>9</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Engineering
              </td>
              <td>Basic auth</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>06 Aug 2024</td>
              <td>192.168.1.1</td>
            </tr>
            <tr>
              <td>10</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Procurement
              </td>
              <td>OAuth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>01 Aug 2024</td>
              <td>10.0.0.5</td>
            </tr>
            <tr>
              <td>11</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                HR
              </td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>03 Aug 2024</td>
              <td>10.0.0.6</td>
            </tr>
            <tr>
              <td>12</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                IT
              </td>
              <td>LDAP</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>05 Aug 2024</td>
              <td>10.0.0.7</td>
            </tr>
            <tr>
              <td>13</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Security
              </td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>07 Aug 2024</td>
              <td>10.0.0.8</td>
            </tr>
            <tr>
              <td>14</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Research
              </td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>09 Aug 2024</td>
              <td>10.0.0.9</td>
            </tr>
            <tr>
              <td>15</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Logistics
              </td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>10 Aug 2024</td>
              <td>10.0.0.10</td>
            </tr>
            <tr>
              <td>16</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Customer Success
              </td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>12 Aug 2024</td>
              <td>10.0.0.11</td>
            </tr>
            <tr>
              <td>17</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Partnerships
              </td>
              <td>Certificate</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>14 Aug 2024</td>
              <td>10.0.0.12</td>
            </tr>
            <tr>
              <td>18</td>
              <td class="overflow-hidden text-ellipsis whitespace-nowrap">
                Platform
              </td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>15 Aug 2024</td>
              <td>10.0.0.15</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_custom_cells"
      />
    </div>
    <div
      id="mv_datatable_custom_cells"
      class="mv-card-table"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-48" data-mv-datatable-column="name">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Product</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="sku">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">SKU</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="price">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Price</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="stock">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Stock</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="category">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Category</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="rating">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Rating</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-28" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Wireless Headphones</td>
              <td>WH-1000</td>
              <td>$149.00</td>
              <td>82</td>
              <td>Audio</td>
              <td>4.6</td>
              <td>Approved</td>
            </tr>
            <tr>
              <td>USB-C Hub</td>
              <td>UCH-300</td>
              <td>$59.00</td>
              <td>134</td>
              <td>Accessories</td>
              <td>4.2</td>
              <td>Rejected</td>
            </tr>
            <tr>
              <td>Mechanical Keyboard</td>
              <td>MK-870</td>
              <td>$129.00</td>
              <td>47</td>
              <td>Peripherals</td>
              <td>4.8</td>
              <td>Pending</td>
            </tr>
            <tr>
              <td>Webcam HD</td>
              <td>WC-1080</td>
              <td>$89.00</td>
              <td>23</td>
              <td>Video</td>
              <td>4.1</td>
              <td>Verified</td>
            </tr>
            <tr>
              <td>Monitor Stand</td>
              <td>MS-200</td>
              <td>$45.00</td>
              <td>91</td>
              <td>Furniture</td>
              <td>3.9</td>
              <td>Draft</td>
            </tr>
            <tr>
              <td>Desk Lamp</td>
              <td>DL-LED</td>
              <td>$39.00</td>
              <td>67</td>
              <td>Lighting</td>
              <td>4.4</td>
              <td>In Review</td>
            </tr>
            <tr>
              <td>Ergonomic Mouse</td>
              <td>EM-500</td>
              <td>$79.00</td>
              <td>8</td>
              <td>Peripherals</td>
              <td>4.7</td>
              <td>Archived</td>
            </tr>
            <tr>
              <td>Cable Organizer</td>
              <td>CO-PRO</td>
              <td>$19.00</td>
              <td>150</td>
              <td>Accessories</td>
              <td>3.5</td>
              <td>Active</td>
            </tr>
            <tr>
              <td>Laptop Sleeve</td>
              <td>LS-1560</td>
              <td>$35.00</td>
              <td>56</td>
              <td>Protection</td>
              <td>4</td>
              <td>Suspended</td>
            </tr>
            <tr>
              <td>Screen Protector</td>
              <td>SP-GLASS</td>
              <td>$15.00</td>
              <td>110</td>
              <td>Protection</td>
              <td>3.8</td>
              <td>Expiring</td>
            </tr>
            <tr>
              <td>Charging Dock</td>
              <td>CD-100</td>
              <td>$69.00</td>
              <td>42</td>
              <td>Charging</td>
              <td>4.3</td>
              <td>Approved</td>
            </tr>
            <tr>
              <td>Bluetooth Speaker</td>
              <td>BS-360</td>
              <td>$99.00</td>
              <td>28</td>
              <td>Audio</td>
              <td>4.5</td>
              <td>Rejected</td>
            </tr>
            <tr>
              <td>Trackpad</td>
              <td>TP-MAGIC</td>
              <td>$149.00</td>
              <td>19</td>
              <td>Peripherals</td>
              <td>4.6</td>
              <td>Pending</td>
            </tr>
            <tr>
              <td>USB Microphone</td>
              <td>UM-COND</td>
              <td>$119.00</td>
              <td>73</td>
              <td>Audio</td>
              <td>4.9</td>
              <td>Verified</td>
            </tr>
            <tr>
              <td>Ring Light</td>
              <td>RL-12</td>
              <td>$29.00</td>
              <td>95</td>
              <td>Lighting</td>
              <td>4.2</td>
              <td>Draft</td>
            </tr>
            <tr>
              <td>Desk Mat</td>
              <td>DM-XXL</td>
              <td>$25.00</td>
              <td>5</td>
              <td>Accessories</td>
              <td>3.7</td>
              <td>In Review</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header">
      <h3 class="mv-card-title">Default Style</h3>
    </div>
    <div
      id="mv_datatable_style_default"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div class="mv-card-header">
      <h3 class="mv-card-title">Bordered Style</h3>
    </div>
    <div
      id="mv_datatable_style_bordered"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table mv-table-border" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div class="mv-card-header">
      <h3 class="mv-card-title">Striped Style</h3>
    </div>
    <div
      id="mv_datatable_style_striped"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table
          class="mv-table [&amp;_tbody_tr:nth-child(even)]:bg-muted/30"
          data-mv-datatable-table="true"
        >
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div class="mv-card-header">
      <h3 class="mv-card-title">Compact Style</h3>
    </div>
    <div
      id="mv_datatable_style_compact"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table
          class="mv-table [&amp;_td]:py-1.5 [&amp;_th]:h-8"
          data-mv-datatable-table="true"
        >
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <input
        type="text"
        placeholder="Search..."
        class="mv-input sm:w-48"
        data-mv-datatable-search="#mv_datatable_multi_row_headers"
      />
    </div>
    <div
      id="mv_datatable_multi_row_headers"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th colspan="2" class="text-center bg-muted/60">
                Authentication
              </th>
              <th colspan="2" class="text-center bg-muted/60">Session Info</th>
              <th
                rowspan="2"
                class="w-16 bg-muted/60"
                data-mv-datatable-column="actions"
              >
                Actions
              </th>
            </tr>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Guy Hawkins</td>
              <td>Web</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>22 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Sales Dept</td>
              <td>SSH</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>18 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Legal Dept</td>
              <td>Kerberos</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>15 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Finance Dept</td>
              <td>Token</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>30 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Design Dept</td>
              <td>API Key</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>28 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Compliance Dept</td>
              <td>FIDO U2F</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>16 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Alice Smith</td>
              <td>OpenID</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>11 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>HR Dept</td>
              <td>Biometric</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>19 Jul 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Platform Team</td>
              <td>Basic auth</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Suspended</span>
              </td>
              <td>06 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Security Ops</td>
              <td>OAuth</td>
              <td><span class="mv-badge mv-badge-warning">Expiring</span></td>
              <td>01 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Data Team</td>
              <td>SAML</td>
              <td><span class="mv-badge mv-badge-success">Approved</span></td>
              <td>03 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Mobile Squad</td>
              <td>LDAP</td>
              <td>
                <span class="mv-badge mv-badge-destructive">Rejected</span>
              </td>
              <td>05 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Infra Bot</td>
              <td>Passkey</td>
              <td><span class="mv-badge mv-badge-warning">Pending</span></td>
              <td>07 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>QA Lab</td>
              <td>Magic Link</td>
              <td><span class="mv-badge mv-badge-primary">Verified</span></td>
              <td>09 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Docs Guild</td>
              <td>Smart Card</td>
              <td><span class="mv-badge mv-badge-secondary">Draft</span></td>
              <td>10 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Support Tier 1</td>
              <td>WebAuthn</td>
              <td><span class="mv-badge mv-badge-info">In Review</span></td>
              <td>12 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Release Train</td>
              <td>Certificate</td>
              <td><span class="mv-badge mv-badge-mono">Archived</span></td>
              <td>14 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
            <tr>
              <td>Archive User</td>
              <td>FIDO2</td>
              <td><span class="mv-badge mv-badge-success">Active</span></td>
              <td>15 Aug 2024</td>
              <td class="text-end">
                <span class="inline-flex gap-2.5"
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Edit"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-pencil"
                      aria-hidden="true"
                    >
                      <path
                        d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
                      ></path>
                      <path d="m15 5 4 4"></path>
                    </svg></button
                  ><button
                    type="button"
                    class="mv-btn mv-btn-sm mv-btn-icon mv-btn-outline"
                    aria-label="Delete"
                  >
                    <svg
                      xmlns="http://www.w3.org/2000/svg"
                      width="24"
                      height="24"
                      viewBox="0 0 24 24"
                      fill="none"
                      stroke="currentColor"
                      stroke-width="2"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      class="lucide lucide-trash"
                      aria-hidden="true"
                    >
                      <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path>
                      <path d="M3 6h18"></path>
                      <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
                    </svg></button
                ></span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>

<div class="grid w-full space-y-5">
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <h3 class="mv-card-title">Default Empty State</h3>
    </div>
    <div
      id="mv_datatable_empty_default"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
  <div class="mv-card">
    <div class="mv-card-header min-h-16">
      <h3 class="mv-card-title">Custom Empty State</h3>
    </div>
    <div
      id="mv_datatable_empty_custom"
      class="mv-card-table"
      data-mv-datatable="true"
      data-mv-datatable-page-size="5"
      data-mv-datatable-info-empty='&lt;div class="flex flex-col items-center justify-center py-10 text-center"&gt;&lt;svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" class="text-muted-foreground/50"&gt;&lt;path d="M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3"&gt;&lt;/path&gt;&lt;path d="M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3"&gt;&lt;/path&gt;&lt;path d="m9 12 3-3 3 3"&gt;&lt;/path&gt;&lt;path d="M12 15V9"&gt;&lt;/path&gt;&lt;/svg&gt;&lt;p class="text-sm font-medium text-foreground"&gt;No records found&lt;/p&gt;&lt;p class="text-sm text-muted-foreground"&gt;Try adjusting your search or filter to find what you are looking for.&lt;/p&gt;&lt;/div&gt;'
    >
      <div class="mv-table-wrapper mv-scrollable">
        <table class="mv-table" data-mv-datatable-table="true">
          <thead>
            <tr>
              <th scope="col" class="w-30" data-mv-datatable-column="label">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Label</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-20" data-mv-datatable-column="method">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Method</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th scope="col" class="w-24" data-mv-datatable-column="status">
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Status</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
              <th
                scope="col"
                class="w-24"
                data-mv-datatable-column="lastSession"
              >
                <span class="mv-table-col"
                  ><span class="mv-table-col-label">Last Session</span
                  ><span class="mv-table-col-sort"></span
                ></span>
              </th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
      </div>
      <template><!--begin:pagination--></template>
      <div class="mv-datatable-toolbar">
        <div class="mv-datatable-length">
          Show<select
            class="mv-select mv-select-sm w-16"
            name="perpage"
            data-mv-datatable-size="true"
          ></select
          >per page
        </div>
        <div class="mv-datatable-info">
          <span data-mv-datatable-info="true"></span>
          <div
            class="mv-datatable-pagination"
            data-mv-datatable-pagination="true"
          ></div>
        </div>
      </div>
      <template><!--end:pagination--></template>
    </div>
  </div>
</div>