{% extends "global/Page.html" %}
{% load otree static %}

{% block title %}
    Diagnosis and Recommendation
{% endblock %}

{% block content %}
<!--<p>The diagnostic result is: problem {{ diagnostic_result }}.-->
<!--    </p>-->

<!--<p>The recommended solution is: solution {{ recommended_solution }}.-->
<!--    </p>-->
<br>

<style>
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}
table tr#ROW1  {background-color:#D3D3D3 ; color:black;}
td {
  font-size:120%;
  border: 1px solid #858482;
  text-align: center;
  padding: 8px;
}

th {
  font-size:120%;
  border: 1px solid #858482;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #F5F5F5;
}

</style>


<table>
        <colgroup>
       <col span="1" style="width: 40%;">
       <col span="1" style="width: 40%;">
    </colgroup>
<!--    <tr>-->
<!--        <th>Decisions</th>-->
<!--        <th>Active:</th>-->
<!--        <th>Passive:</th>-->
<!--    </tr>-->
    <tr>
    <div>
        <td>  Your chosen diagnostic accuracy </td>
           <td>  <b>{{ precision }} </b></td>
    </div>
    </tr>
    <tr>
    <div>
        <td>  Your diagnostic result </td>
           <td>  <b>Problem {{ diagnostic_result }} </b></td>
    </div>
    </tr>
    <tr>
    <div>
        <td> Your recommended solution to client </td>
            <td><b> Solution {{ recommended_solution }} </b></td>
    </div>
    </tr>

</table>


<p><br> <br></p>





    {% next_button %}
{% endblock %}