<h2 class="text-2xl font-bold text-gray-900 text-center mb-2">
  <%= t(".forgot_your_password") %>
</h2>
<p class="text-center text-gray-600 text-sm mb-8">
  Enter your email address and we'll send you instructions to reset your password.
</p>

<%= simple_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post, class: "space-y-6" }) do |f| %>
  <%= f.error_notification message: "Please check the errors below", class: "bg-red-50 border-l-4 border-red-400 p-4 mb-4 text-red-700 text-sm" %>

  <div>
    <label for="user_email" class="block text-sm font-medium text-gray-700">
      <%= t("activerecord.attributes.user.email") %>
    </label>
    <div class="mt-1">
      <%= f.input :email,
          label: false,
          required: true,
          autofocus: true,
          placeholder: "Enter your email address",
          input_html: {
            class: "appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"
          } %>
    </div>
  </div>

  <div>
    <%= f.button :submit, t(".send_me_reset_password_instructions"),
        class: "w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500" %>
  </div>
<% end %>

<div class="mt-6 text-center">
  <%= link_to t("devise.shared.links.sign_in"), new_session_path(resource_name),
      class: "text-sm font-medium text-blue-600 hover:text-blue-500" %>
</div>
