{# Low Balance Notification Email Template #}
{# Template variables:
data.current_balance: the current balance of the user
data.billing_page_link: the link to the billing page
#}

<p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    line-height: 165%;
    margin-top: 0;
    margin-bottom: 10px;
  ">
  <strong>Low Balance Warning</strong>
</p>

<p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    line-height: 165%;
    margin-top: 0;
    margin-bottom: 20px;
  ">
  Your account balance has dropped below the recommended threshold.
</p>

<div style="
    margin-left: 15px;
    margin-bottom: 20px;
    padding: 15px;
    border-left: 4px solid #5D23BB;
    background-color: #f8f8ff;
  ">
  <p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 10px;
  ">
    <strong>Current Balance:</strong> ${{ "{:.2f}".format((data.current_balance|float)/100) }}
  </p>
</div>


<div style="
    margin-left: 15px;
    margin-bottom: 20px;
    padding: 15px;
    border-left: 4px solid #FF6B6B;
    background-color: #FFF0F0;
  ">
  <p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 10px;
  ">
    <strong>Low Balance:</strong>
  </p>
  <p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 5px;
  ">
    Your account requires additional credits to continue running agents. Please add credits to your account to avoid service interruption.
  </p>
</div>

<div style="
    text-align: center;
    margin: 30px 0;
  ">
  <a href="{{ data.billing_page_link }}" style="
    font-family: 'Poppins', sans-serif;
    background-color: #5D23BB;
    color: white;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 500;
    display: inline-block;
  ">
    Manage Billing
  </a>
</div>

<p style="
    font-family: 'Poppins', sans-serif;
    color: #070629;
    font-size: 16px;
    line-height: 150%;
    margin-top: 30px;
    margin-bottom: 10px;
    font-style: italic;
  ">
  This is an automated low balance notification. Consider adding credits soon to avoid service interruption.
</p>
