<% if (typeof success_msg !== 'undefined' && success_msg && success_msg.length) { %>
  <% success_msg.forEach(function(msg) { %>
    <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded-lg mb-4 flex justify-between items-center">
      <span><i class="fas fa-check-circle mr-2"></i> <%= msg %></span>
      <button onclick="this.parentElement.remove()" class="text-green-700 hover:text-green-900">&times;</button>
    </div>
  <% }) %>
<% } %>

<% if (typeof error_msg !== 'undefined' && error_msg && error_msg.length) { %>
  <% error_msg.forEach(function(msg) { %>
    <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg mb-4 flex justify-between items-center">
      <span><i class="fas fa-exclamation-circle mr-2"></i> <%= msg %></span>
      <button onclick="this.parentElement.remove()" class="text-red-700 hover:text-red-900">&times;</button>
    </div>
  <% }) %>
<% } %>

<% if (typeof warning_msg !== 'undefined' && warning_msg && warning_msg.length) { %>
  <% warning_msg.forEach(function(msg) { %>
    <div class="bg-yellow-100 border border-yellow-400 text-yellow-700 px-4 py-3 rounded-lg mb-4 flex justify-between items-center">
      <span><i class="fas fa-exclamation-triangle mr-2"></i> <%= msg %></span>
      <button onclick="this.parentElement.remove()" class="text-yellow-700 hover:text-yellow-900">&times;</button>
    </div>
  <% }) %>
<% } %>

<% if (typeof info_msg !== 'undefined' && info_msg && info_msg.length) { %>
  <% info_msg.forEach(function(msg) { %>
    <div class="bg-blue-100 border border-blue-400 text-blue-700 px-4 py-3 rounded-lg mb-4 flex justify-between items-center">
      <span><i class="fas fa-info-circle mr-2"></i> <%= msg %></span>
      <button onclick="this.parentElement.remove()" class="text-blue-700 hover:text-blue-900">&times;</button>
    </div>
  <% }) %>
<% } %>

<% if (typeof errors !== 'undefined' && errors && errors.length) { %>
  <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg mb-4">
    <ul class="list-disc list-inside">
      <% errors.forEach(function(err) { %>
        <li><%= err %></li>
      <% }) %>
    </ul>
  </div>
<% } %>
