{% extends "global/Base.html" %}
{% load staticfiles otree_tags %}

{% block title %}
Question {{round}} <hr>
{% endblock %}

{% block content %}

{% if round == 1 %} <p>In the following hypothetical decisions, you will choose between <b>payments on various future dates</b>.</p> {% endif %}
   <p>
       For the purpose of this choice, we define a so-called
          {% if player.specification.0 in 'treat,base' %}
       <b>"day X"</b>, which is <b>{{player.specification.5}}</b>. The timing of all payments will be described relative to day X.
       {% elif player.specification.0 in 'treat2,base2' %}
       <b>"variable Z"</b>, which has a value of <b>{{player.specification.5}}</b>. The timing of all payments will be described using variable Z.
   {% endif %}
   </p>
<p>Please pick the option that you prefer:</p>

    <table class="table table-bordered" style="border-spacing: 0">
        <colgroup>
            <col width="15">
            <col width="35%">
            <col width="10%">
            <col width="35%">
        </colgroup>
        <tr>
            <td></td>
            <td align="center">Option A</td>
            <td></td>
            <td align="center">Option B</td>
        </tr>

        <tr>
<td style="text-align: right">Payment:<br>
Time of payment: </td>
            <td style="text-align: center">
<b>${{player.specification.1}}</b> <br> <b>{{player.specification.2}}</b>
               </td>
            <td  align="center" style="vertical-align: middle; padding-top: 20px; padding-bottom: 20px">
                    <input type="radio" name="choice_time" value="A"
                           required >&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;
                    <input type="radio" name="choice_time"
                           value="B"
                           required >
                </td>
           <td style="text-align: center">
               <b>${{player.specification.3}}</b><br> <b>{{player.specification.4}}</b>

           </td>
        </tr>

    </table>

<div style="text-align: right;">
    {% next_button %}
</div>
{% endblock %}