<div class="container">
  <div class="row">
    <div class="col-xs-12 col-sm-6 col-sm-offset-3 col-md-8 col-md-offset-2 m-t-xl m-b-xl">
      <div class="ibox margin-bottom">
        <div class="ibox-content">
          <div class="text-center">
            <div class="logo-wrapper">
              <a href="/">
                <img src="/assets/logos/MissionKontrol-logo-original.png" alt="">
              </a>
            </div>
          </div>

          <h2>Edit account</h2>

          <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put, class: "m-t" }) do |f| %>

            <%= devise_error_messages! %>

            <!-- twilio settings -->
            <div class="hide">
              <div>
                <div class="form-group">
                  <div>
                    <%= f.label :twilio_account_sid %>
                    <i class="fa fa-info-circle" title="You can find your Account SID and Auth token in your Twilio settings page, under API credentials"></i>
                  </div>
                  <%= f.text_field :twilio_account_sid, autofocus: true, class: "form-control" %>
                </div>
              </div>

              <div>
                <div class="form-group">
                  <div>
                    <%= f.label :twilio_auth_token %>
                    <i class="fa fa-info-circle" title="You can find your Account SID and Auth token in your Twilio settings page, under API credentials"></i>
                  </div>
                  <%= f.text_field :twilio_auth_token, autofocus: true, class: "form-control" %>
                </div>
              </div>

              <div>
                <div class="form-group">
                  <div>
                    <%= f.label :twilio_caller_id, "Twilio caller ID" %>
                    <i class="fa fa-info-circle" title="You can find your Caller ID in your Twilio Programmable voice settings, under Numbers > Manage numbers > select existing number or buy new number"></i>
                  </div>
                  <%= f.text_field :twilio_caller_id, autofocus: true, class: "form-control" %>
                </div>
              </div>

              <div>
                <div class="form-group">
                  <div>
                    <%= f.label :twilio_application_sid %>
                    <i class="fa fa-info-circle" title="You can find your Caller ID in your Twilio Programmable voice settings, under TwiML > TwiML Apps > Create new app or chose existing app > Application SID can be found under properties"></i>
                  </div>
                  <%= f.text_field :twilio_application_sid, autofocus: true, class: "form-control" %>
                </div>
              </div>
            </div>
            <!-- twilio settings -->

            <!-- profile settings -->
            <div class="form-group" id="password-mismatch">
              <p class="alert-password">Password do not match</p>
            </div>

            <div class="form-group">
              <%= f.label :password %> <i>(leave blank if you don't want to change it)</i>
              <% if @minimum_password_length %>
                <em>(<%= @minimum_password_length %> characters minimum)</em>
              <% end %><br />
              <%= f.password_field :password, autocomplete: "off", class: "form-control" %>
            </div>

            <div class="form-group">
              <%= f.label :password_confirmation %><br />
              <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %>
            </div>

            <div class="form-group">
              <%= f.label :current_password %> <i>(we need your current password to confirm your changes)</i><br />
              <%= f.password_field :current_password, autocomplete: "current-password", class: "form-control" %>
            </div>
            <!-- profile settings -->

            

            <% if devise_mapping.confirmable? && resource.pending_reconfirmation? %>
              <div>Currently waiting confirmation for: <%= resource.unconfirmed_email %></div>
            <% end %>

            <div class="actions">
              <%= f.submit "Update", class: "btn btn-primary block m-b btn-right" %>
            </div>
          <% end %>
        </div>
      </div>
    </div>
  </div>
</div>
