.flex.justify-center
  .w-full.max-w-xs
    %h1.font-hairline.mb-6.text-center Log In
    = form_for(resource,                                                       |
               as: resource_name,                                              |
               url: main_app.session_path(resource_name),                               |
               html: {                                                         |
                       class: "bg-white mb-4 px-8 pt-6 pb-8 rounded shadow-md" |
               }                                                               |
      ) do |f|                                                                 |
      = render "devise/shared/error_messages", resource: resource
      .mb-4
        = f.label :email, class: "block text-gray-700 text-sm font-bold mb-2"
        = f.email_field :email, autofocus: true, autocomplete: "email",                                                                       |
          class: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight foucs:outline-none focus:shadow-outline" |
      .mb-4
        = f.label :password, class: "block text-gray-700 text-sm font-bold mb-2"
        = f.password_field :password,                                                                                                         |
          autocomplete: "current-password",                                                                                                   |
          class: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" |
      - if devise_mapping.rememberable?
        .mb-4
          = f.check_box :remember_me, class: "mr-2 leading-tight"
          = f.label :remember_me,                                      |
            class: "align-baseline inline-block text-gray-700 text-sm" |
      .mb-4
        = f.submit "Log in",                                                                                                                  |
          class: "button bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline w-full" |
      = render "devise/shared/links"
    = render "devise/shared/form_footer"