{% load i18n %}
<h4 class="ui dividing header">{% trans 'Billing information' %}</h4>

<div class="field">
    <div class="ui toggle checkbox">
      {{form.same_as_client}}
      <label>
          {{form.same_as_client.label}}
          <i class="help-text question yellow icon link" data-content="{{ form.same_as_client.help_text }}"></i>
      </label>
    </div>
</div>

<div class="ui center aligned basic segment" id="billing_select_member">
  <div class="ui fluid category search">
    <div class="ui icon fluid input" data-url="{% url 'member:search' %}">
      {{form.member}}
      <i class="search icon"></i>
    </div>
    <div class="results"></div>
  </div>
  <div class="ui horizontal divider">
    {% trans 'Or' %}
  </div>
  <div class="ui teal labeled icon button add payment member">
    {% trans 'Create new payment member' %}
    <i class="add icon"></i>
  </div>

  <div class="ui form add payment member transition hidden">
    <div class="content">
      <div class="ui icon button cancel add payment member right floated">
        <i class="close icon"></i>
      </div>

      <div class="field">
        <label>{% trans 'Name' %}</label>
        <div class="two fields">
          <div class="field {% if form.firstname.errors %} error {% endif %}">
              {{form.firstname}}
          </div>
          <div class="field {% if form.lastname.errors %} error {% endif %}">
              {{form.lastname}}
          </div>
        </div>
      </div>

      <div class="field">
        <label>{% trans 'Street' %}</label>
        <div class="fields">
          <div class="twelve wide field {% if form.street.errors %} error {% endif %}">
            {{ form.street}}
          </div>
          <div class="four wide field">
            {{ form.apartment }}
          </div>
        </div>
      </div>

      <div class="equal width fields">
        <div class="field {% if form.city.errors %} error {% endif %}">
          <label>{{ form.city.label }}</label>
          {{ form.city }}
        </div>
        <div class="field {% if form.postal_code.errors %} error {% endif %}">
          <label>{{ form.postal_code.label }}</label>
          {{ form.postal_code }}
        </div>
      </div>

    </div>
  </div>
</div>

<div class="field">
    <label>{{ form.billing_payment_type.label }}</label>
    {{ form.billing_payment_type }}
</div>

<div class="field">
    <label>{{ form.facturation.label }}</label>
    {{ form.facturation }}
</div>
