{% extends 'base2.html' %}
{% load crispy_forms_tags %}
{% load static %}
{% block title %}Login{% endblock %}
{% block content %}
<style>
            .button-container {
                display: flex;
                justify-content: space-between;
                margin-top: 20px;
            }

            .button-container .previous-button {
                order: 1;
            }

            .button-container .next-button {
                order: 2;
            }

    </style>
<main id="main" class="main">
<div class="container">
    <h3> Applicant Details </h3>
    <form method="POST" action="{% url 'membership:applicant_details' %}">
            {% csrf_token %}
    <div class="row">
        <div class="col-3">
            {{ context.tittle|as_crispy_field }}
        </div>
    </div>
    <div class="row">
        <div class="col-6">
            {{ context.first_name|as_crispy_field }}
        </div>
        <div class="col-6">
            {{ context.last_name|as_crispy_field }}
        </div>
    </div>

    <div class="row">
        <div class="col-6">
             {{ context.identification_card|as_crispy_field }}
        </div>
        <div class="col-6">
             {{ context.mobile|as_crispy_field }}
        </div>
    </div>

    <div class="row">
        <div class="col-6">
              {{ context.email|as_crispy_field }}
        </div>
        <div class="col-6">
             {{ context.profession|as_crispy_field }}
        </div>
    </div>

    <div class="row">
        <div class="col-6">
             {{ context.organization_name|as_crispy_field }}
        </div>
        <div class="col-6">
            {{ context.organization_telephone|as_crispy_field }}
        </div>
    </div>

    <div class="row">
        <div class="col-8">
             {{ context.organization_address|as_crispy_field }}
        </div>
    </div>

    <div class="row">
        <div class="col-6">
             {{ context.business_email|as_crispy_field }}
        </div>
        <div class="col-6">
            {{ context.nature_of_organization|as_crispy_field }}
        </div>
    </div>
    <div class="button-container">
        <a href="{% url 'membership:membertype' %}" class="btn btn-primary previous-button">Previous</a>
        <input type="submit" name="submit" value="next"   class="btn btn-primary next-button" Next />

    </div>
    </form>


</div>
</main>
{% endblock %}