<div class="checkout-content checkout-register">
    <fieldset id="account">
        <h2 class="secondary-title">{{ journal2.settings.get('one_page_lang_pers_details', text_your_details) }}</h2>

      <div class="form-group customer-group" style="display: {% if customer_groups|length > 1 %} block {% else %} none {% endif %};">
        <label class="control-label">{{ entry_customer_group }}</label>
        {% for customer_group in customer_groups %}
          {% if customer_group.customer_group_id == customer_group_id %}
            <div class="radio">
              <label>
                <input type="radio" name="customer_group_id" value="{{ customer_group.customer_group_id }}" checked="checked" />
                {{ customer_group.name }}</label>
            </div>
          {% else %}
            <div class="radio">
              <label>
                <input type="radio" name="customer_group_id" value="{{ customer_group.customer_group_id }}" />
                {{ customer_group.name }}</label>
            </div>
          {% endif %}
        {% endfor %}
      </div>
        <div class="form-group required">
            <label class="control-label" for="input-payment-firstname">{{ entry_firstname }}</label>
            <input type="text" name="firstname" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'firstname', '']) }}" placeholder="{{ entry_firstname }}"
                   id="input-payment-firstname" class="form-control"/>
        </div>
        <div class="form-group required">
            <label class="control-label" for="input-payment-lastname">{{ entry_lastname }}</label>
            <input type="text" name="lastname" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'lastname', '']) }}" placeholder="{{ entry_lastname }}"
                   id="input-payment-lastname" class="form-control"/>
        </div>
        <div class="form-group required">
            <label class="control-label" for="input-payment-email">{{ entry_email }}</label>
            <input type="text" name="email" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'email', '']) }}" placeholder="{{ entry_email }}"
                   id="input-payment-email" class="form-control"/>
        </div>
        <div class="form-group phone-input {{ journal2.settings.get('one_page_phone_required', '1') ? 'required' : '' }}">
            <label class="control-label" for="input-payment-telephone">{{ entry_telephone }}</label>
            <input type="text" name="telephone" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'telephone', '']) }}" placeholder="{{ entry_telephone }}"
                   id="input-payment-telephone" class="form-control"/>
        </div>
        {#<div class="form-group fax-input">#}
            {#<label class="control-label" for="input-payment-fax">{{ entry_fax }}</label>#}
            {#<input type="text" name="fax" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'fax', '']) }}" placeholder="{{ entry_fax }}" id="input-payment-fax"#}
                   {#class="form-control"/>#}
        {#</div>#}
      {% for custom_field in custom_fields %}

        {% if custom_field.location == 'account' %}

          {% if custom_field.type == 'select' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <select name="custom_field[{{ custom_field.custom_field_id }}]" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control">
                <option value="">{{ text_select }}</option>



                {% for custom_field_value in custom_field.custom_field_value %}



                  <option value="{{ custom_field_value.custom_field_value_id }}">{{ custom_field_value.name }}</option>



                {% endfor %}



              </select>
            </div>
          {% endif %}

          {% if custom_field.type == 'radio' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label">{{ custom_field.name }}</label>
              <div id="input-payment-custom-field{{ custom_field.custom_field_id }}"> {% for custom_field_value in custom_field.custom_field_value %}
                  <div class="radio">
                    <label>
                      <input type="radio" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field_value.custom_field_value_id }}" />
                      {{ custom_field_value.name }}</label>
                  </div>
                {% endfor %} </div>
            </div>
          {% endif %}

          {% if custom_field.type == 'checkbox' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label">{{ custom_field.name }}</label>
              <div id="input-payment-custom-field{{ custom_field.custom_field_id }}"> {% for custom_field_value in custom_field.custom_field_value %}
                  <div class="checkbox">
                    <label>
                      <input type="checkbox" name="custom_field[{{ custom_field.custom_field_id }}][]" value="{{ custom_field_value.custom_field_value_id }}" />
                      {{ custom_field_value.name }}</label>
                  </div>
                {% endfor %} </div>
            </div>
          {% endif %}

          {% if custom_field.type == 'text' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <input type="text" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field.value }}" placeholder="{{ custom_field.name }}" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control" />
            </div>
          {% endif %}

          {% if custom_field.type == 'textarea' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <textarea name="custom_field[{{ custom_field.custom_field_id }}]" rows="5" placeholder="{{ custom_field.name }}" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control">{{ custom_field.value }}</textarea>
            </div>
          {% endif %}

          {% if custom_field.type == 'file' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label">{{ custom_field.name }}</label>
              <br />
              <button type="button" id="button-payment-custom-field{{ custom_field.custom_field_id }}" data-loading-text="{{ text_loading }}" class="btn btn-default button"><i class="fa fa-upload"></i> {{ button_upload }}</button>
              <input type="hidden" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field.value }}" id="input-payment-custom-field{{ custom_field.custom_field_id }}" />
            </div>
          {% endif %}

          {% if custom_field.type == 'date' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <div class="input-group date">
                <input type="text" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field.value }}" placeholder="{{ custom_field.name }}" data-date-format="YYYY-MM-DD" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control" />
                <span class="input-group-btn">
          <button type="button" class="btn btn-default button"><i class="fa fa-calendar"></i></button>
          </span></div>
            </div>
          {% endif %}

          {% if custom_field.type == 'time' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <div class="input-group time">
                <input type="text" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field.value }}" placeholder="{{ custom_field.name }}" data-date-format="HH:mm" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control" />
                <span class="input-group-btn">
          <button type="button" class="btn btn-default button"><i class="fa fa-calendar"></i></button>
          </span></div>
            </div>
          {% endif %}

          {% if custom_field.type == 'time' %}
            <div id="payment-custom-field{{ custom_field.custom_field_id }}" class="form-group custom-field {% if custom_field.required %}required{% endif %}" data-sort="{{ custom_field.sort_order }}">
              <label class="control-label" for="input-payment-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label>
              <div class="input-group datetime">
                <input type="text" name="custom_field[{{ custom_field.custom_field_id }}]" value="{{ custom_field.value }}" placeholder="{{ custom_field.name }}" data-date-format="YYYY-MM-DD HH:mm" id="input-payment-custom-field{{ custom_field.custom_field_id }}" class="form-control" />
                <span class="input-group-btn">
          <button type="button" class="btn btn-default button"><i class="fa fa-calendar"></i></button>
          </span></div>
            </div>
          {% endif %}

        {% endif %}

      {% endfor %}
    </fieldset>
    <fieldset id="password">
        <h2 class="secondary-title">{{ journal2.settings.get('one_page_lang_your_pass', text_your_password) }}</h2>

        <div class="form-group required">
            <label class="control-label" for="input-payment-password">{{ entry_password }}</label>
            <input type="password" name="password" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'password', '']) }}" placeholder="{{ entry_password }}"
                   id="input-payment-password" class="form-control"/>
        </div>
        <div class="form-group required">
            <label class="control-label" for="input-payment-confirm">{{ entry_confirm }}</label>
            <input type="password" name="confirm" value="{{ staticCall('Journal2Utils', 'getProperty', [order_data, 'confirm', '']) }}" placeholder="{{ entry_confirm }}"
                   id="input-payment-confirm" class="form-control"/>
        </div>
    </fieldset>
    <fieldset id="address">
        <h2 class="secondary-title">{{ journal2.settings.get('one_page_lang_your_address', text_your_address) }}</h2>
        {{ payment_address_form }}
    </fieldset>
  {% if is_shipping_required %}
    <div class="checkbox">
        <label>
          {% if shipping_address == '1' %}
            <input type="checkbox" name="shipping_address" value="1" checked="checked" />
            {% else %}
            <input type="checkbox" name="shipping_address" value="0" />
            {% endif %}
            {{ entry_shipping }}
        </label>
    </div>
    <fieldset id="shipping-address" style="display: {{ shipping_address == '1' ? 'none' : 'block' }}">
        <h2 class="secondary-title">{{ journal2.settings.get('one_page_lang_ship_address', 'Shipping Address') }}</h2>
        {{ shipping_address_form }}
    </fieldset>
    {% endif %}
    <script>
        $(document).delegate('input[name="customer_group_id"]', 'change', function () {
            $(document).trigger('journal_checkout_customer_group_changed', this.value);
        });
    </script>
        <script type="text/javascript"><!--
        $('#account .date').datetimepicker({
            pickTime: false
        });

        $('#account .time').datetimepicker({
            pickDate: false
        });

        $('#account .datetime').datetimepicker({
            pickDate: true,
            pickTime: true
        });
        //--></script>
        <script>
        $('#account .form-group[data-sort]').detach().each(function() {
            if ($(this).attr('data-sort') >= 0 && $(this).attr('data-sort') <= $('#account .form-group').length) {
                $('#account .form-group').eq($(this).attr('data-sort')).before(this);
            }

            if ($(this).attr('data-sort') > $('#account .form-group').length) {
                $('#account .form-group:last').after(this);
            }

            if ($(this).attr('data-sort') < -$('#account .form-group').length) {
                $('#account .form-group:first').before(this);
            }
        });
    </script>
</div>
