<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  <%- include('partials/bootstrapcss.ejs') %>
    <title>Signup - Ticket Management App</title>
    <style>
      body {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100vh;
      }

      .signup-section {
        background-color: #f5f5f5;
        padding: 50px 0;
        text-align: center;
        height: 100%;
      }

      .signup-section h2 {
        font-size: 24px;
        margin-bottom: 20px;
      }

      .signup-section form {
        display: flex;
        flex-direction: column;
        max-width: 400px;
        margin: 0 auto;
      }

      .signup-section input,
      .signup-section select {
        margin-bottom: 15px;
        padding: 10px;
        border: 1px solid #ccc;
      }

      .signup-btn {
        padding: 10px 20px;
        background-color: #333;
        color: #fff;
        border: none;
        cursor: pointer;
      }
    </style>
</head>

<body>
  <%- include('partials/navbar') %>
    <section class="signup-section">
      <h2>Sign Up</h2>
      <form class="container-fluid" action="/employee/signup" method="post">
        <input type="text" placeholder="Full Name" name="fullName" />
        <input type="email" placeholder="Email ID" name="email" />
        <input type="password" placeholder="Password" name="password" />
        <label for="department">Department:</label>
        <select name="department" id="department">
          <option value="HR">HR</option>
          <option value="IT">IT</option>
          <option value="Finance">Finance</option>
          <!-- Add more department options as needed -->
        </select>

        <button class="signup-btn">Sign Up</button>
      </form>
      <% if (typeof message !='undefined' ) { %>
        <p>
          <%= message %>
        </p>
        <% } %>
    </section>
    <%-include('partials/footer.ejs') %> <%- include('partials/bootstrapjs.ejs') %>
</body>

</html>