{% extends "base.html" %}
{% load pytils_numeral static %}
{% block title %}Купить лицензию{% endblock %}

{% block content %}
    <h2>Купить лицензию</h2>

    {% if form.non_field_errors %}
        <p class="error">{{ form.non_field_errors }}</p>
    {% endif %}

    <div class='content-white'>

    <form class="license-form" action="" method="post">
        {% csrf_token %}

        {% for hidden in form.hidden_fields %}
            {{ hidden }}
        {% endfor %}

        <div class="field orange_border">
            <div class='license_label'>
                {{ form.term.label_tag }}
            </div>
            <div class="clear"></div>
            <div class='license_label'>
            </div>
            <div class='license_field'>
                {{ form.term }}
                {{ field.errors }}
            </div>
            <div class="clear"></div>
        </div>
        <div class="field grey_border">
            <div class="orange-bottom-triangle"></div>
            <div class='license_label'>
                {{ form.payform.label_tag }}
            </div>
            <div class="clear"></div>
            <div class='license_label'>
            </div>
            <div class='license_field'>
                {{ field }}
                {{ form.payform }}
            </div>
            <div class="clear"></div>
        </div>
        <div class="grey-bottom-triangle"></div>

        <div class="buttons">
            <input type="submit" name="submit" value="" />
        </div>
    </form>
    <div class='right license-ways'>
        <div class='title'>
            Во всех городах России и стран СНГ можно оплатить лицензию Документора удобным для вас способом:
        </div>
        <div class='left col'>
            <div class='col-title'>Интернет-банкинг</div>
            <div class='left mr-5'><img src="{% static 'img/alfa.svg' %}"></div>
            <div class='left mr-5'><img src="{% static 'img/sber.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/psb.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/masterpass.svg' %}"></div>
            <div class="clear"></div>
            <div class='col-title'>Банковскими картами</div>
            <div class='left mr-5'><img src="{% static 'img/mir.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/visa.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/mastercard.svg' %}" /></div>
			<div class='left mr-5'><img src='{% static 'img/maestro.svg' %}' /></div>
            <div class="clear"></div>
        </div>
        <div class='left col'>
            <div class='col-title'>Электронными деньгами</div>
            <div class='left mr-5'><img src="{% static 'img/yamoney.svg' %}"></div>
            <div class='left mr-5'><img src="{% static 'img/webmoney.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/qiwi.svg' %}"></div>
            <div class="clear"></div>
            <div class='col-title'>Со счёта телефона</div>
            <div class='left mr-5'><img src="{% static 'img/beel.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/mts.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/megafon.svg' %}"></div>
            <div class="clear"></div>
            <div class='col-title'>Наличными</div>
            <div class='left mr-5'><img src="{% static 'img/comepay.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/svyaznoy.svg' %}"></div>
			<div class='left mr-5'><img src="{% static 'img/euroset.svg' %}"></div>
            <div class="clear"></div>
        </div>

    </div>
    <div class="clear"></div>
    </div>
{% endblock %}

{% block js %}
    <script src="{% static 'js/license.js' %}"></script>
{% endblock %}