<%# locals: path, direction, title %>
<%= link_to path, class: "hidden md:flex w-full bg-container hover:bg-container-inset rounded-xl border border-alpha-black-25 shadow-xs p-4 items-center justify-between" do %>
<% if direction == 'previous' %>
<%= lucide_icon("arrow-left") %>
<% end %>
<%= "text-right" if direction == "previous" %>">
<%= t(".#{direction}") %>
<%= title %>
<% if direction == 'next' %>
<%= lucide_icon("arrow-right") %>
<% end %>
<% end %>
<%# Mobile version %>
<%= link_to path, class: "md:hidden w-full bg-container hover:bg-container-inset rounded-xl border border-alpha-black-25 shadow-xs py-3 px-4" do %>
<% if direction == 'previous' %>
<%= lucide_icon("arrow-left") %>
Back
<%= title %>
<% else %>
Next
<%= title %>
<%= lucide_icon("arrow-right") %>
<% end %>