<%# app/views/devise/passwords/edit.html.erb — Redefinir senha (link do e-mail) %>
<% content_for :title, 'Nova senha' %>

<div class="min-h-screen flex items-center justify-center p-4">
  <div class="w-full max-w-sm">

    <div class="text-center mb-8">
      <div class="w-16 h-16 bg-[#f97316] rounded-2xl flex items-center justify-center mx-auto mb-3">
        <%= icone :travado, cor: 'text-black', tamanho: 'w-8 h-8', espaco: false %>
      </div>
      <h1 class="text-white font-bold text-2xl">Definir nova senha</h1>
    </div>

    <div class="bg-[#111111] border border-white/10 rounded-2xl p-8">
      <%= form_with(url: user_password_path, scope: :user, method: :put, data: { turbo: false }) do |f| %>
        <%= f.hidden_field :reset_password_token, value: params[:reset_password_token] %>
        <div class="space-y-5">
          <div>
            <%= f.label :password, 'Nova senha', class: 'block text-sm font-medium text-gray-300 mb-1.5' %>
            <%= f.password_field :password, autofocus: true, autocomplete: 'new-password',
                  class: 'w-full px-4 py-3 bg-[#0a0a0a] border border-white/10 rounded-xl text-white
                          focus:outline-none focus:border-[#f97316] focus:ring-1 focus:ring-[#f97316] text-base' %>
            <p class="text-gray-600 text-xs mt-1">Mínimo de 6 caracteres</p>
          </div>
          <div>
            <%= f.label :password_confirmation, 'Confirmar nova senha', class: 'block text-sm font-medium text-gray-300 mb-1.5' %>
            <%= f.password_field :password_confirmation, autocomplete: 'new-password',
                  class: 'w-full px-4 py-3 bg-[#0a0a0a] border border-white/10 rounded-xl text-white
                          focus:outline-none focus:border-[#f97316] focus:ring-1 focus:ring-[#f97316] text-base' %>
          </div>

          <%= f.submit 'Salvar nova senha',
                class: 'w-full py-3.5 bg-[#f97316] hover:bg-orange-500 text-white font-semibold
                        rounded-xl transition-colors cursor-pointer text-base min-h-[48px]' %>
        </div>
      <% end %>

      <p class="text-center mt-6">
        <%= link_to '← Voltar para o login', new_user_session_path,
            class: 'text-sm text-[#f97316] hover:text-orange-400 transition-colors' %>
      </p>
    </div>
  </div>
</div>
