-page_title("Pré-cadastro")
#ContentList
  .container.bgWhite
    %section
      .row.justify-content-center
        .line-top.py-2
        .col-12.text-center
          %h1.text-uppercase
            Registrar-se
  .mb-3= render '/pages/breadcrumbs'
  .container.mt-4.mt-sm-0
    %main#list
      .clearfix
      .row
        - flash.each do |name, msg|
          - if msg.is_a?(String)
            .col-12
              %div{class: "alert alert-#{name == "notice" ? 'success' : 'danger'}"}
                %a.close{"data-dismiss" => "alert"} ×
                = content_tag :div, msg, :id => "flash_#{name}"
        .col-12
          = simple_form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :post }) do |f|
            = f.error_notification
            .form-inputs
              .row
                .col-md-6.col-12.mr-auto
                  = f.input :name, required: true, autofocus: true
                .col-md-auto.col-12
                  = f.input :birthday, as: :date, start_year: Date.today.year - 110, end_year: Date.today.year - 15, required: true, autofocus: true, prompt: { day: 'Dia', month: 'Mês', year: 'Ano' }                  
              .row
                .col-md-6.col-12
                  = f.input :email, required: true, autofocus: true
                .col-md-3.col-12
                  = f.input :password, required: true, hint: ("Minimo de #{@minimum_password_length} caracteres" if @minimum_password_length)
                .col-md-3.col-12
                  = f.input :password_confirmation, required: true
              .row
                .col-md-2.col-12
                  = f.input :lives_out_brazil, input_html: { id: 'lives_out_brazil' }
                .col-md-3.col-12
                  = f.input :cpf,  required: true
                .col-md-3.col-12
                  = f.input :rg, required: true , input_html: { id: 'rg'}      
                .col-md-4.col-12
                  = f.input :phone, required: true, hint: 'Prefixo do país + código de área + número do telefone'                                 
              .row
                .col-md-2.col-12
                  = f.input :zipcode, required: true, input_html: {id: 'user_zipcode'}
                .col-md-3.col-6
                  = f.input :country, priority: ["BR"], selected: "BR", required: true, autofocus: true, input_html: {id: 'user_country'}
                .col-md-3.col-6#state
                  = f.input :state, required: true, autofocus: true
                .col-md-3.col-6#select
                  = f.input :state, collection: @statesArray, required: true, autofocus: true, input_html: { id: 'select_state' }
                .col-md-4.col-12
                  = f.input :city, required: true, autofocus: true, input_html: {id: 'user_city'}
              .row
                .col-md-3.col-4
                  = f.input :neighborhood, required: true, input_html: {id: 'user_neighborhood'}
                .col-md-5.col-8
                  = f.input :address_street, required: true, input_html: {id: 'user_address_street'}
                .col-md-2.col-6
                  = f.input :address_number, required: true
                .col-md-2.col-6
                  = f.input :address_complement, hint: 'Se não houver complemento, escreva “Sem complemento”', required: true
              .row
                .col-md-6.col-6#select
                  = f.input :formation_level, collection: @user.formation_level_list, required: true, autofocus: true, input_html: { id: 'select_formation' }
                .col-md-6.col-6
                  = f.input :acting, collection: @user.acting_list, required: true, autofocus: true
              .row
                .col-md-6.col-6
                  = f.input :color_or_race, collection: @user.color_or_race_list, hint: 'A Abraji solicita este dado para conhecer melhor o perfil da sua comunidade e promover iniciativas de diversidade e inclusão.', required: true, autofocus: true
                .col-md-6.col-12
                  = f.input :gender, collection: @user.gender_list, hint: 'A Abraji usa este dado apenas para conhecer melhor o perfil de seus associados e planejar políticas de diversidade.', required: true
              .row
                .col-md-12.col-12
                  = f.input :is_pcd, required: false, input_html: { id: 'user_is_pcd' }           
                  = f.input :pcd_description, required: false, input_html: { id: 'pcd_description' }                  
              .row
                .col-md-6.col-12
                  = f.input :know_abraji, collection: @user.know_abraji_list, required: true                                               
              .row
                .col-md-12.col-12
                  Assine as newsletters da Abraji e fique por dentro do trabalho da organização
                .col-md-12.col-12.newsletter-box
                  = f.input :newsletter, required: false
                  = f.input :optin_new_investigatora, required: false

              -#= resource.errors.inspect if resource.errors.present?
              %input{:name => "f", :type => "hidden", :value => "#{params[:f]}"}/
            .form-actions
              = recaptcha_v3(action: 'create', site_key: ENV['RECAPTCHA_SITEKEY'], turbolinks: true )
              = f.button :submit, value: 'Registrar-se', class: "btn btn-warning orange mr-2"
              = link_to "Voltar", :back, class: "btn btn-light grey"