{% load otree %}

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">More information</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">

          <p>The <b>algorithm's advice costs a randomly determined price (between {{ player.wtpzero }} and {{ player.wtpmaxcu }})</b>, which is not known beforehand.</p>

          <p> If your willingness to pay for the advice is higher than the randomly selected price, you pay the randomly selected price and receive the advice from the algorithm. This price will be subtracted from the profit you make with this estimation.
              If your willingness to pay for the advice is lower than the randomly selected price, you pay nothing and do not receive the advice. In this case, you have to determine the estimate yourself.</p>

          <p>The probability that you will actually receive the algorithm's advice increases with the amount you are willing to pay. You <b>maximise your profits by truthfully indicating your willingness to pay</b> for the advice.</p>

          <br><br>

            The <b>profits</b> you can earn, <b>depend</b> on the <b>accuracy</b> of your estimate compared to the actual GDP per capita and are as follows:

            <br><br>
            <table class="table" style="text-align: center">
                <tr>
                    <th style="text-align:center;  font-weight: bold; color: #185177" >Deviation from the actual GDP per capita:</th>
                    <th style="text-align:center;  font-weight: bold; color: #185177" >Profit</th>
                </tr>
                <tr>
                    <td> less than (or equal to) <b> 5 </b> points </td>
                    <td> {{ player.profit5 }} </td>
                </tr>
                <tr>
                    <td> less than (or equal to) <b> 10 </b> points </td>
                    <td> {{ player.profit4 }} </td>
                </tr>
                <tr>
                    <td> less than (or equal to) <b> 15 </b> points </td>
                    <td> {{ player.profit3 }} </td>
                </tr>
                <tr>
                    <td> less than (or equal to) <b> 20 </b> points </td>
                    <td> {{ player.profit2 }} </td>
                </tr>
                <tr>
                    <td> less than (or equal to) <b> 25 </b> points </td>
                    <td> {{ player.profit1 }} </td>
                </tr>
            </table>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>