<% content_for :title, "Edit #{resource_name.to_s.humanize}" %>

<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-[480px]">
  <div class="bg-white px-6 py-12 shadow sm:rounded-lg sm:px-12">
    <h2 class="text-2xl font-bold leading-9 tracking-tight text-neutral-900 mb-6">Edit <%= resource_name.to_s.humanize %></h2>

    <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put, class: "space-y-6" }) do |f| %>
      <%= render "devise/shared/error_messages", resource: resource %>

      <div>
        <%= f.label :first_name, class: "frm-label" %>
        <%= f.text_field :first_name, autofocus: true, class: "frm-input" %>
      </div>

      <div>
        <%= f.label :last_name, class: "frm-label" %>
        <%= f.text_field :last_name, class: "frm-input" %>
      </div>

      <div>
        <%= f.label :email, class: "frm-label" %>
        <%= f.email_field :email, autocomplete: "email", class: "frm-input" %>
      </div>

      <% if devise_mapping.confirmable? && resource.pending_reconfirmation? %>
        <div class="rounded-md bg-yellow-50 p-4">
          <div class="flex">
            <div class="ml-3">
              <p class="text-sm font-medium text-yellow-800">
                Currently waiting confirmation for: <%= resource.unconfirmed_email %>
              </p>
            </div>
          </div>
        </div>
      <% end %>

      <div>
        <%= f.label :password, class: "frm-label" %>
        <span class="text-sm text-neutral-500">(leave blank if you don't want to change it)</span>
        <%= f.password_field :password, autocomplete: "new-password", class: "frm-input" %>
        <% if @minimum_password_length %>
          <p class="mt-1 text-sm text-neutral-500"><%= @minimum_password_length %> characters minimum</p>
        <% end %>
      </div>

      <div>
        <%= f.label :password_confirmation, class: "frm-label" %>
        <%= f.password_field :password_confirmation, autocomplete: "new-password", class: "frm-input" %>
      </div>

      <div>
        <%= f.label :current_password, class: "frm-label" %>
        <span class="text-sm text-neutral-500">(we need your current password to confirm your changes)</span>
        <%= f.password_field :current_password, autocomplete: "current-password", class: "frm-input" %>
      </div>

      <div>
        <%= f.submit "Update", class: "btn btn-primary w-full" %>
      </div>
    <% end %>

    <div class="mt-10 border-t border-neutral-200 pt-10">
      <h3 class="text-lg font-medium text-red-600">Delete Account</h3>
      <p class="mt-1 text-sm text-neutral-500">Once you delete your account, it cannot be undone.</p>
      <div class="mt-4">
        <%= button_to "Delete my account",
            registration_path(resource_name),
            form: { data: {
              turbo_confirm: "Are you sure you want to delete your account? This action cannot be undone."
            } },
            method: :delete,
            class: "btn btn-danger"
        %>
      </div>
    </div>

    <div class="mt-6 text-center">
      <%= link_to "Back", :back, class: "text-sm font-medium text-brand-500 hover:text-brand-600" %>
    </div>
  </div>
</div>
