<turbo-stream action="replace" target="compound-interest-result"><template><div id="compound-interest-result">
  <h2 class="text-center m-3">Valor final: R$ 0,00
    <button type="button" class="btn btn-link btn-lg">
      <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="plus" class="svg-inline--fa fa-plus " role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" color="green">
        <path fill="currentColor" d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"></path>
      </svg>
    </button>
  </h2>

  <table class="table table-striped table-bordered table-hover">
    <thead>
    <tr>
      <th class="header-group-th">
        <div class="header-group-div">
          <span class="table-header-small-label">Mês</span>
          <a class="btn btn-light" data-turbo-prefetch="false" href="/compound_interest/calculate?sort=desc">
            <i class="fa-solid fa-sort-up" aria-hidden="true"></i>
</a>        </div>
      </th>

      <th class="header-group-th">
        <div class="header-group-div">
          <span class="table-header-small-label">Juros do Mês</span>
        </div>
      </th>

      <th class="header-group-th">
        <div class="header-group-div">
          <span class="table-header-small-label">Total Investido</span>
        </div>
      </th>

      <th class="header-group-th">
        <div class="header-group-div">
          <span class="table-header-small-label">Juros acumulados</span>
        </div>
      </th>

      <th class="header-group-th">
        <div class="header-group-div">
          <span class="table-header-small-label">Total acumulado</span>
        </div>
      </th>
    </tr>
    </thead>
    <tbody>
      <tr>
        <td>Inicio</td>
        <td>R$ 0,00</td>
        <td>R$ 0,00</td>
        <td>R$ 0,00</td>
        <td>R$ 0,00</td>
      </tr>
    </tbody>
  </table>
</div>
</template></turbo-stream>