<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="/css/style.css">
  <title>Tour Website</title>
</head>
<body>
  <header>
    <h1>Welcome to Our Tour Website</h1>
    <nav>
      <a href="/">Home</a>
      <a href="/about">About</a>
      <a href="/contact">Contact</a>
      <a href="/login">Login</a>
    </nav>
  </header>

  <section class="tour-list">
    <% if (tours.length === 0) { %>
      <p>No tours available at the moment. Please check back later.</p>
    <% } else { %>
      <ul>
        <% tours.forEach(tour => { %>
          <li class="tour-card">
            <a href="/tour/<%= tour.id %>">
              <div class="tour-card-img">
                <img src="<%= tour.imageUrl %>" alt="<%= tour.name %>">
              </div>
              <div class="tour-card-info">
                <h3><%= tour.name %></h3>
                <p><%= tour.description %></p>
                <div class="price">
                  <span><%= tour.price %> THB</span>
                </div>
              </div>
            </a>
          </li>
        <% }) %>
      </ul>
    <% } %>
    
  </section>

  <footer>
    <p>&copy; 2025 Tour Website. All Rights Reserved.</p>
  </footer>
</body>
</html>
