<% content_for :title, "Log in" %>

<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-center text-2xl font-bold leading-9 tracking-tight text-gray-900 mb-6">Log in</h2>

    <%= form_for(resource, as: resource_name, url: session_path(resource_name), html: { class: "space-y-6" }) do |f| %>
      <div>
        <%= f.label :email, class: "frm-label" %>
        <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "frm-input" %>
      </div>

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

      <% if devise_mapping.rememberable? %>
        <div class="flex items-center">
          <%= f.check_box :remember_me, class: "h-4 w-4 rounded border-gray-300 text-brand-500 focus:ring-brand-100" %>
          <%= f.label :remember_me, class: "ml-2 block text-sm text-neutral-700" %>
        </div>
      <% end %>

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

    <div class="mt-6">
      <%= render "devise/shared/links" %>
    </div>
  </div>
</div>
