{% extends 'base.html.twig' %}

{% block body %}
    <div class="mx-auto mt-5 max-w-7xl px-2 sm:px-6 lg:px-8 pb-10">
        {% for question in questions %}
            <div class="mx-4 mb-8">

                <h2 class="mb-3 text-sm">{{ loop.index }}. {{ question.question }}</h2>
                {% for answer in question.answers %}
                    <div class="mb-2">
                        <label class="ms-4 mb-2 text-gray-800 text-sm">
                            <input type="radio" class="rounded text-pink-500" name="{{ question.uuid }}">
                            {{ answer.value }}
                        </label>
                    </div>
                {% endfor %}
            </div>
        {% endfor %}
        <span class="sm:ml-3">
      <button type="button"
              class="inline-flex items-center rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
        <svg class="-ml-0.5 mr-1.5 h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true" data-slot="icon">
          <path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z"
                clip-rule="evenodd"/>
        </svg>
        Submit
      </button>
    </span>
    </div>
{% endblock %}