<div class="group relative timeline-box">
  <div class="flex items-center justify-between">
    <div>
      <%= render 'visits/name', visit: visit %>
      <div><%= "#{visit.started_at.strftime('%H:%M')} - #{visit.ended_at.strftime('%H:%M')}" %></div>
    </div>
    <div class="opacity-0 transition-opacity duration-200 group-hover:opacity-100 flex items-center ml-4">
      <%= render 'visits/buttons', visit: visit %>
      <!-- The button to open modal -->
      <label for="visit_details_popup_<%= visit.id %>" class='btn btn-xs btn-info'>Map</label>

      <%= render 'visits/modal', visit: visit %>
    </div>
  </div>
</div>
