<div id="login-message-info" data-info='{"success": "{{ success }}", "error": "{{ error_warning }}" }'>
  <form id="form-register" class="form-register ftr-form ftr-steps" action="{{ action }}&mobile_register=true" method="post" enctype="multipart/form-data" autocomplete="off" {{ (mobile_register == 'true') ? 'style="left: 0vw;"' : '' }}>
    {% if (fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Ambos')) or (fields_register_brazil_tipo_de_pessoa not in fields_register_brazil_tipo_de_pessoa_array) %}
      <div id="register-type" class="ftr-steps__step">
        <div class="ftr-steps__content">
          <div class="ftr-steps__inner">
            <span class="ftr-text--l">{{ text_create_your_account }}</span>
            <p class="ftr-text--s ftr-text--grey ftr-out-space--t-s">{{ text_create_your_account_subtitle }}</p>
            <div class="ftr-grid ftr-in-space--n">
              <input class="ftr-radio" id="fisica" type="radio" name="pessoa" value="F" {{ (pessoa == 'F' or pessoa == '') ? 'checked' : '' }}>
              <label class="ftr-radio-label" for="fisica">
                <span class="ftr-radio-label__text">{{ text_fisica }}</span>
              </label>
              <input class="ftr-radio" id="juridica" type="radio" name="pessoa" value="J" {{ (pessoa == 'J') ? 'checked' : '' }}>
              <label class="ftr-radio-label" for="juridica">
                <span class="ftr-radio-label__text">{{ text_juridica }}</span>
              </label>
            </div>
          </div>
        </div>
      </div>
    {% elseif fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Juridico') %}
      <input class="ftr-hidden" type="radio" id="juridica" name="pessoa" checked="checked" value="J">
    {% elseif fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Fisico') %}
      <input class="ftr-hidden" type="radio" id="fisica" name="pessoa" checked="checked" value="F">
    {% endif %}

    <div id="register-info-access" class="ftr-steps__step">
      <div class="ftr-steps__content">
        <div class="ftr-steps__inner">
          <label class="ftr-field {{ (error_email) ? 'error' : '' }}">
            <input type="email" id="email" name="email" class="ftr-field__entry ftr-js-field__entry" value="{{ email }}" maxlength="96" required>
            <span class="ftr-field__text">{{ text_email }}</span>
            {% if error_email %}
              <span class="ftr-field__error">{{ error_email }}</span>
            {% endif %}
          </label>
          <label class="ftr-field {{ (error_password) ? 'error' : '' }}">
            <input type="password" id="password" name="password" class="ftr-field__entry ftr-js-field__entry" value="{{ password }}" minlength="4" maxlength="20" required>
            <span class="ftr-field__text">{{ text_password }}</span>
            {% if error_password %}
              <span class="ftr-field__error">{{ error_password }}</span>
            {% endif %}
          </label>
          <label class="ftr-field {{ (error_confirm) ? 'error' : '' }}">
            <input type="password" id="confirm" name="confirm" class="ftr-field__entry ftr-js-field__entry" value="{{ confirm }}" minlength="4" maxlength="20" required>
            <span class="ftr-field__text">{{ text_confirm }}</span>
            {% if error_confirm %}
              <span class="ftr-field__error">{{ error_confirm }}</span>
            {% endif %}
          </label>
          <input class="ftr-switch-check" id="newsletter" type="checkbox" name="newsletter" value="1" {{ (newsletter == '') ? 'checked' : '' }}>
          <label class="ftr-switch-label" for="newsletter">
            <span class="ftr-switch-label__text">{{ text_newsletter }}</span>
          </label>
        </div>
      </div>
    </div>

    <div id="register-info" class="ftr-steps__step">
      <div class="ftr-steps__content">
        <div class="ftr-steps__inner">
          <label class="ftr-field {{ (error_firstname) ? 'error' : '' }}">
            <input type="text" id="firstname" name="firstname" class="ftr-field__entry ftr-js-field__entry" value="{{ firstname }}" maxlength="32" required>
            <span class="ftr-field__text">{{ text_firstname }}</span>
            {% if error_firstname %}
              <span class="ftr-field__error">{{ error_firstname }}</span>
            {% endif %}
          </label>
          <label class="ftr-field {{ (error_lastname) ? 'error' : '' }}">
            <input type="text" id="lastname" name="lastname" class="ftr-field__entry ftr-js-field__entry" value="{{ lastname }}" maxlength="32" required>
            <span class="ftr-field__text">{{ text_lastname }}</span>
            {% if error_lastname %}
              <span class="ftr-field__error">{{ error_lastname }}</span>
            {% endif %}
          </label>
          {% if fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Juridico')or fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Ambos') %}
            <label class="ftr-field ftr-js-pessoa-juridica {{ (error_razao_social) ? 'error' : '' }}">
              <input type="text" id="razao_social" name="razao_social" class="ftr-field__entry ftr-js-field__entry" value="{{ razao_social }}" maxlength="200" required>
              <span class="ftr-field__text">{{ text_razao }}</span>
              {% if error_razao_social %}
                <span class="ftr-field__error">{{ error_razao_social }}</span>
              {% endif %}
            </label>
            <label class="ftr-field ftr-js-pessoa-juridica {{ (error_inscricao_estadual) ? 'error' : '' }}">
              <input type="text" id="inscricao_estadual" name="inscricao_estadual" class="ftr-field__entry ftr-js-field__entry" value="{{ inscricao_estadual }}" maxlength="20">
              <span class="ftr-field__text">{{ text_ie }}</span>
              {% if error_inscricao_estadual %}
                <span class="ftr-field__error">{{ error_inscricao_estadual }}</span>
              {% endif %}
            </label>
          {% endif %}
          {% if fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Fisico')or fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Ambos') %}
            <label class="ftr-field ftr-js-pessoa-fisica {{ (error_cpf) ? 'error' : '' }}">
              <input type="text" id="cpf" name="cpf" class="ftr-field__entry ftr-js-field__entry mask-cpf" value="{{ cpf }}" maxlength="14" required>
              <span class="ftr-field__text">{{ text_cpf }}</span>
              {% if error_cpf %}
                <span class="ftr-field__error">{{ error_cpf }}</span>
              {% endif %}
            </label>
            {% if fields_register_brazil_status_rg %}
              <label class="ftr-field ftr-js-pessoa-fisica {{ (error_rg) ? 'error' : '' }}">
                <input type="text" id="rg" name="rg" class="ftr-field__entry ftr-js-field__entry" value="{{ rg }}" maxlength="10">
                <span class="ftr-field__text">{{ text_rg }}</span>
                {% if error_rg %}
                  <span class="ftr-field__error">{{ error_rg }}</span>
                {% endif %}
              </label>
            {% endif %}
          {% endif %}
          {% if fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Juridico')or fields_register_brazil_tipo_de_pessoa == constant('Type_CadastroPessoa::Tp_Ambos') %}
            <label class="ftr-field ftr-js-pessoa-juridica {{ (error_cnpj) ? 'error' : '' }}">
              <input type="text" id="cnpj" name="cnpj" class="ftr-field__entry ftr-js-field__entry mask-cnpj" value="{{ cnpj }}" required>
              <span class="ftr-field__text">{{ text_cnpj }}</span>
              {% if error_cnpj %}
                <span class="ftr-field__error">{{ error_cnpj }}</span>
              {% endif %}
            </label>
            <label for="perfil" class="ftr-select ftr-js-select ftr-js-pessoa-juridica">
              <input class="ftr-select__entry ftr-js-select__entry" type="text" name="" value="" id="perfil" disabled readonly>
              <span class="ftr-select__text">{{ text_perfil }}</span>
              <input class="ftr-js-select__value" type="hidden" name="perfil" value="{{ perfil }}">
              <div class="ftr-select__content">
                {% for perfil in perfis %}
                  <span class="ftr-select__content__item ftr-js-select__content__item ftr-js-ripple-effect" data-value="{{ perfil.value }}" {{ (perfil.selected) ? 'data-selected="true"' : '' }}>{{ perfil.name }}</span>
                {% endfor %}
              </div>
            </label>

            <label class="ftr-select ftr-js-select ftr-js-pessoa-juridica" for="contribuinte">
              <input class="ftr-select__entry ftr-js-select__entry" type="text" name="" value="" id="contribuinte" disabled readonly>
              <span class="ftr-select__text">{{ text_contribute_icms }}</span>
              <input class="ftr-js-select__value" type="hidden" name="contribuinte" value="{{ contribuinte }}">
              <div class="ftr-select__content">
                {% for contribuinte in contribuintes %}
                  <span class="ftr-select__content__item ftr-js-select__content__item ftr-js-ripple-effect" data-value="{{ contribuinte.value }}" {{ (contribuinte.selected) ? 'data-selected="true"' : '' }}>{{ contribuinte.name }}</span>
                {% endfor %}
              </div>
            </label>
          {% endif %}
          <label class="ftr-field {{ (error_telephone) ? 'error' : '' }}">
            <input type="tel" id="telephone" name="telephone" class="ftr-field__entry ftr-js-field__entry mask-phone" value="{{ telephone }}" maxlength="32" required>
            <span class="ftr-field__text">{{ text_telephone }}</span>
            {% if error_telephone %}
              <span class="ftr-field__error">{{ error_telephone }}</span>
            {% endif %}
          </label>
          {% if fields_register_brazil_status_telefone2 %}
            <label class="ftr-field {{ (error_fax) ? 'error' : '' }}">
              <input type="tel" id="fax" name="fax" class="ftr-field__entry ftr-js-field__entry mask-phone" value="{{ fax }}" maxlength="32">
              <span class="ftr-field__text">{{ text_fax }}</span>
              {% if error_fax %}
                <span class="ftr-field__error">{{ error_fax }}</span>
              {% endif %}
            </label>
          {% endif %}
          <label class="ftr-field {{ (error_celular) ? 'error' : '' }}">
            <input type="tel" id="celular" name="celular" class="ftr-field__entry ftr-js-field__entry mask-celular" value="{{ celular }}" maxlength="32" required>
            <span class="ftr-field__text">{{ text_celular }}</span>
            {% if error_celular %}
              <span class="ftr-field__error">{{ error_celular }}</span>
            {% endif %}
          </label>

          <label class="ftr-field">
            <input type="tel" id="feedback_whatsapp_number" name="feedback_whatsapp_number" class="ftr-field__entry ftr-js-field__entry mask-celular" value="{{ feedback_whatsapp_number }}" maxlength="32">
            <span class="ftr-field__text">{{ text_whatsapp }}</span>
            {% if error_whatsapp %}
              <span class="ftr-field__error">{{ error_whatsapp }}</span>
            {% endif %}
          </label>

          <input class="ftr-check" id="feedback_whatsapp_status" type="checkbox" name="feedback_whatsapp_status" {{ (feedback_whatsapp_status) ? 'checked' : '' }}>
          <label class="ftr-check-label" for="feedback_whatsapp_status">
            <span class="ftr-check-label__text">{{ text_whatsapp_obs }} </span>
          </label>

          {% if fields_register_brazil_status_data_nascimento %}
            {% if fields_register_brazil_tipo_de_pessoa != constant('Type_CadastroPessoa::Tp_Juridico') %}
              <label class="ftr-field ftr-js-pessoa-fisica {{ (error_data_nascimento) ? 'error' : '' }}" id="data_nascimento">
                <input type="text" class="ftr-field__entry ftr-js-field__entry mask-date" value="{{ data_nascimento }}" readonly {{ (fields_register_brazil_status_data_nascimento_required) ? 'required' : '' }}>
                <span class="ftr-field__text">{{ text_date_birth }}</span>
                <input type="hidden" name="data_nascimento" value="{{ data_nascimento }}">
                {% if error_data_nascimento %}
                  <span class="ftr-field__error">{{ error_data_nascimento }}</span>
                {% endif %}
              </label>
            {% endif %}
          {% endif %}

          {% if fields_register_brazil_tipo_de_pessoa != constant('Type_CadastroPessoa::Tp_Juridico') and fields_register_brazil_status_sexo %}
            <p class="ftr-text--s ftr-js-pessoa-fisica">{{ text_sex }}</p>
            <div class="ftr-grid ftr-js-pessoa-fisica ftr-in-space--n">
              <input class="ftr-radio" id="male" type="radio" name="sexo" value="m" {{ (sexo == 'm') ? 'checked' : '' }}>
              <label class="ftr-radio-label" for="male">
                <span class="ftr-radio-label__text">{{ text_male }}</span>
              </label>
              <input class="ftr-radio" id="female" type="radio" name="sexo" value="f" {{ (sexo == 'f') ? 'checked' : '' }}>
              <label class="ftr-radio-label" for="female">
                <span class="ftr-radio-label__text">{{ text_female }}</span>
              </label>
              <input class="ftr-radio" id="other" type="radio" name="sexo" value="o" {{ (sexo == 'o') ? 'checked' : '' }}>
              <label class="ftr-radio-label" for="other">
                <span class="ftr-radio-label__text">{{ text_other }}</span>
              </label>
            </div>
          {% endif %}
        </div>
      </div>
    </div>

    <div id="register-address" class="ftr-steps__step js-address">
      <div class="ftr-steps__content">
        <div class="ftr-steps__inner">
          <label class="ftr-field {{ (error_postcode) ? 'error' : '' }}">
            <input type="text" id="postcode" name="postcode" class="ftr-field__entry ftr-js-field__entry mask-cep js-postcode-search postcode" value="{{ postcode }}" maxlength="10" required>
            <span class="ftr-field__text">{{ text_postcode }}</span>
            {% if error_postcode %}
              <span class="ftr-field__error">{{ error_postcode }}</span>
            {% endif %}
          </label>
          {{ dont_know_cep }}
          <div class="js-postcode-content ftr-h--full {{ (postcode_visible==false) ? 'ftr-none' : '' }}">
              <label class="ftr-field {{ (error_apelido) ? 'error' : '' }}">
                <input type="text" id="apelido" name="apelido" class="ftr-field__entry ftr-js-field__entry" value="{{ apelido }}" minlength="3" maxlength="80" required>
                <span class="ftr-field__text">{{ text_locale }}</span>
                {% if error_apelido %}
                  <span class="ftr-field__error">{{ error_apelido }}</span>
                {% endif %}
              </label>
              <label class="ftr-field {{ (error_address_1) ? 'error' : '' }}">
                <input type="text" id="address_1" name="address_1" class="ftr-field__entry ftr-js-field__entry address_1" value="{{ address_1 }}" maxlength="70" minlength="3" required {{ (postcode_readonly) ? 'readonly' : '' }}>
                <span class="ftr-field__text">{{ text_address_1 }}</span>
                <input type="hidden" class="tipo_logradouro" name="tipo_logradouro" value="{{ tipo_logradouro }}">
                <input type="hidden" class="logradouro" name="logradouro" value="{{ logradouro }}">
                <input type="hidden" class="city" name="city" value="{{ city }}">
                {% if error_address_1 %}
                  <span class="ftr-field__error">{{ error_address_1 }}</span>
                {% endif %}
              </label>
              <label class="ftr-field {{ (error_numero) ? 'error' : '' }}">
                <input type="text" id="numero" name="numero" class="ftr-field__entry ftr-js-field__entry mask-int" value="{{ numero }}" maxlength="6" required>
                <span class="ftr-field__text">{{ text_number }}</span>
                {% if error_numero %}
                  <span class="ftr-field__error">{{ error_numero }}</span>
                {% endif %}
              </label>
              <label class="ftr-field {{ (error_complemento) ? 'error' : '' }}">
                <input type="text" id="complemento " name="complemento" class="ftr-field__entry ftr-js-field__entry" value="{{ complemento  }}" maxlength="60">
                <span class="ftr-field__text">{{ text_complemento_placeholder }}</span>
                {% if error_complemento %}
                  <span class="ftr-field__error">{{ error_complemento }}</span>
                {% endif %}
              </label>
              <label class="ftr-field {{ (error_address_2) ? 'error' : '' }}">
                <input type="text" id="address_2" name="address_2" class="ftr-field__entry ftr-js-field__entry address_2" value="{{ address_2 }}" maxlength="128" required {{ (postcode_readonly) ? 'readonly' : '' }}>
                <span class="ftr-field__text">{{ text_address_2 }}</span>
                {% if error_address_2 %}
                  <span class="ftr-field__error">{{ error_address_2 }}</span>
                {% endif %}
              </label>

              <label for="zone_id" class="ftr-select ftr-js-select {{ (zone_name) ? 'written' : '' }} {{ (postcode_readonly) ? 'ftr-select--disabled ftr-js-select--disabled written' : '' }}">
                <input class="ftr-select__entry ftr-js-select__entry" type="text" name="" value="{{ zone_name }}" id="zone_id" disabled readonly>
                <input class="js-city-search ftr-js-select__value ftr-hidden zone_id" name="zone_id" value="{{ zone_id }}" data-codigo-municipio="{{ codigo_municipio }}" required>
                <span class="ftr-select__text">{{ text_zone }}</span>
                <div class="ftr-select__content">
                  {% for state in states %}
                    <span class="ftr-select__content__item ftr-js-select__content__item ftr-js-ripple-effect" data-value="{{ state.zone_id }}" {{ (state.zone_id == zone_id) ? 'data-selected="true"' : '' }}>{{ state.name }}</span>
                  {% endfor %}
                </div>
              </label>

              <label for="codigo_municipio" class="ftr-select ftr-js-select {{ (codigo_municipio) ? 'written' : '' }} {{ (postcode_readonly) ? 'ftr-select--disabled ftr-js-select--disabled written' : '' }}">
                <input class="ftr-select__entry ftr-js-select__entry city-name" type="text" name="" value="{{ city }}" disabled readonly>
                <input class="ftr-js-select__value ftr-hidden codigo-municipio codigo_municipio" name="codigo_municipio" value="{{ codigo_municipio }}" required>
                <span class="ftr-select__text">{{ text_city }}</span>
                <div class="ftr-select__content cities-list"></div>
                {% if error_city %}
                  <span class="ftr-field__error">{{ error_city }}</span>
                {% endif %}
              </label>

          </div>
          <input type="hidden" name="country_id" value="{{ country_id }}"><!-- Importante ter o valor do pais -->
        </div>
      </div>
    </div>

    {% if customer_interests_remember %}
      <div id="register-interests" class="ftr-steps__step">
        <div class="ftr-steps__content">
          <div class="ftr-steps__inner">
            <span class="ftr-text--l">{{ text_interests }}</span>
            {{ interests_categories }}
          </div>
        </div>
      </div>
    {% endif %}

    <div id="register-captcha" class="ftr-steps__step">
      <div class="ftr-steps__content">
        <div class="ftr-steps__inner">
          {% if text_agree %}
            <input class="ftr-check" id="accept" type="checkbox" name="agree" value="1" required {{ (agree) ? 'checked' : '' }}>
            <label class="ftr-check-label" for="accept">
              <span class="ftr-check-label__text">{{ text_read_agree }} </span>
              {% if error_agree %}
                <span class="ftr-check-label__error">{{ error_agree }}</span>
              {% endif %}
            </label>
            <a href="{{ agree_link }}" class="ftr-text--primary ftr-js-swipe-content-display ftr-js-privacy-policy">{{ text_privacy_policy }}</a>
            <div class="ftr-swipe-content ftr-js-swipe-content ftr-background--light">
              <div class="ftr-grid ftr-grid--middle ftr-grid--start ftr-in-space--n">
                <i class="material-icons ftr-in-space--m ftr-in-space--v-l ftr-js-close ftr-text--bold">&#xE5CD;</i>
                <span class="ftr-text--bold">{{ text_privacy_policy }}</span>
              </div>
              <hr>
              <div class="ftr-swipe-content__main ftr-js-privacy-policy-container"></div>
            </div>
          {% endif %}
          {% if google_captcha %}
            <div id="g-recaptcha" class="g-recaptcha" data-sitekey="{{ site_key }}"></div>
            {% if error_google_captcha %}
              <span class="ftr-field__error">{{ error_google_captcha }}</span>
            {% endif %}
            <script>
              grecaptcha.render('g-recaptcha', {
                'sitekey' : '{{ site_key }}'
              });
            </script>
          {% else %}
            <label class="ftr-field {{ (error_captcha) ? 'error' : '' }}">
              <input type="text" id="captcha" name="captcha" class="ftr-field__entry ftr-js-field__entry" value="{{ captcha }}" required>
              <span class="ftr-field__text">{{ text_captcha }} ou {{ text_captcha_code_placeholder }}</span>
              {% if error_captcha %}
                <span class="ftr-field__error">{{ error_captcha }}</span>
              {% endif %}
            </label>
            <img src="index.php?route=account/register_content/captcha" alt="captcha" class="ftr-out-space--t-m">
          {% endif %}
        </div>
      </div>
    </div>

  </form>
</div>
<script>
  if (typeof loadSpecificSources != 'undefined') {
    loadSpecificSources({
      scripts: {{ scriptsApp }},
      styles: {{ stylesApp }}
    });
  }
</script>
