{% extends 'base.html' %}

{% load i18n %}
{% load widget_tweaks %}

{% block title %}{% trans "Hobbies - Step 4" %}{% endblock %}

{% block content %}

    <article class="mt-12">

        <h1 class="text-3xl">
          Your Hobbies
        </h1>

        <p class="mt-2">
          What do you like to do? If you have any special hobbies, interests or skills that you think make you a great carer, add them below.
        </p>

    </article>

    <form class="mt-8" method="post">
        {% csrf_token %}

        <div class="mt-5">
          <label for="id_hobbies" class="cursor-pointer">Your hobbies</label>
          {{ form.hobbies|add_class:"mt-2 w-full border border-body/10 focus:border-body/60 bg-bgColor rounded-lg p-3 outline-none"|attr:"placeholder:I like playing guitar..." }}
        </div>

        <button
            type="submit"
            class="btn mt-10 w-full bg-body text-white p-3 rounded-md cursor-pointer"
        >
            We’re almost finished...
        </button>

    </form>

{% endblock %}