{% extends 'core/base.html' %}
{% load currency_filters %}
{% load widget_tweaks %}

{% block content %}
  <article>
    <h1 class="font-bold rounded-xl border-2 border-gray-200 bg-slate-100 mb-3 ml-3 mr-3 p-4 text-lg">{{ task.title }}</h1>
<section class="rounded-xl border-2 border-gray-200 bg-slate-100 mb-3 ml-3 mr-3 p-4">
    <p>{{ task.description }}</p>
    
    <p>From {{ task.price_from|cents_to_dollars }} to {{ task.price_to|cents_to_dollars }}</p>
</section>


<section class="rounded-xl border-2 border-gray-200 bg-slate-100 mb-3 ml-3 mr-3 p-4">
<form method="post" class="space-y-4">
    {% csrf_token %}
    <div class="hidden">
        {{ form.task }}
        {{ form.price_from }}
        {{ form.price_to }}
        {{ form.needed_information }}
        {{ form.title }}
    </div>
       <div>
        <label for="{{ form.email.id_for_label }}" class="block text-sm font-medium text-gray-700">
            Email
        </label>
        {{ form.email|add_class:"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" }}
    </div>
    <div>
        <label for="{{ form.email_confirmation.id_for_label }}" class="block text-sm font-medium text-gray-700">
            Confirm Email
        </label>
        {{ form.email_confirmation|add_class:"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" }}
    </div>
 <div>
        <label for="{{ form.description.id_for_label }}" class="block text-sm font-medium text-gray-700">
            Information about your specific needs
        </label>
        {{ form.description|add_class:"mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" }}
    </div>

    <button type="submit" class="btn btn-green">
        Send request
    </button>
</form>
  
</section>



</article>

{% endblock %}