<table width="100%" cellpadding="0" cellspacing="0" border="0" style="background:#f3f2f1; font-family: 'Segoe UI', Arial, sans-serif;">
  <tr>
    <td align="center" style="padding:40px 0;">
      <!-- CARD -->
      <table width="450" cellpadding="0" cellspacing="0" border="0" style="background:#ffffff; border:1px solid #c8c6c4; border-radius:12px; border-collapse:separate;">
        <tr>
          <td style="padding:40px; text-align:center;">
            <div style="font-size:24px; font-weight:bold; color:#323130; margin-bottom:10px;">Request Approval</div>
            <div style="font-size:14px; color:#605e5c; margin-bottom:25px;">Please review the pending item and take action below.</div>

            <!-- BUTTONS -->
            <table align="center" cellpadding="0" cellspacing="0" border="0">
              <tr>
                <!-- APPROVE -->
                <td align="center" bgcolor="#107C10" style="border-radius:20px; padding:10px 25px;">
                  <a href="https://example.com/approve" style="font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; display:block;">✔ Approve</a>
                </td>
                <td width="20"></td>
                <!-- REJECT -->
                <td align="center" bgcolor="#D13438" style="border-radius:20px; padding:10px 25px;">
                  <a href="https://example.com/reject" style="font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; display:block;">✖ Reject</a>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>