<link rel="stylesheet" href="/css/messagestyle.css">

<% if (typeof errors != 'undefined') { %>
  <% errors.forEach(function(error) { %>
    <div class="alert alert-warning auto-dismiss">
      <span><%= error.msg %></span>
      <button type="button" class="btn-close" onclick="this.parentElement.classList.add('hide')" aria-label="Close">&times;</button>
    </div>
  <% }); %>
<% } %>

<% if (success_msg != '') { %>
  <div class="alert alert-success auto-dismiss">
    <span><%= success_msg %></span>
    <button type="button" class="btn-close" onclick="this.parentElement.classList.add('hide')" aria-label="Close">&times;</button>
  </div>
<% } %>

<% if (error_msg != '') { %>
  <div class="alert alert-danger auto-dismiss">
    <span><%= error_msg %></span>
    <button type="button" class="btn-close" onclick="this.parentElement.classList.add('hide')" aria-label="Close">&times;</button>
  </div>
<% } %>

<% if (error != '') { %>
  <div class="alert alert-danger auto-dismiss">
    <span><%= error %></span>
    <button type="button" class="btn-close" onclick="this.parentElement.classList.add('hide')" aria-label="Close">&times;</button>

  </div>
<% } %>



<script>
  document.addEventListener("DOMContentLoaded", () => {
    document.querySelectorAll(".alert.auto-dismiss").forEach(alert => {
      setTimeout(() => {
        alert.classList.add("hide");
      }, 1000); // ⏱ 4 seconds before fade out
    });
  });
</script>