<!-- FOOTER WORKS STARTS HERE -->
    <section class="footer">
      <div class="container">
        <div class="row justify-content-between upper-footer" data-aos="fade-right" data-aos-duration="3100" data-aos-easing="ease-in-sine">
          <div class="col-lg-3 footer-left">
            <!-- <a class="footer-logo"><strong class="main-logo">E4</strong>D4</a> -->
            <a class="footer-logo" href="/"><img class="img-fluid" src="/assets/img/logo-white.png" alt="Creerlio"></a>
            <p class="text-white mb-2">Find top talent or land your dream job with our streamlined hiring and application platform. Connect with leading employers, showcase your skills, and secure your future career today!</p>
            <div class="icons d-flex gap-4 pt-3">
              <a href="https://www.instagram.com" class="icon-background d-flex">
                <i class="fa-brands fa-instagram"></i>
              </a>
              <a href="https://www.facebook.com/people/Creerlio/61560464105407/" class="icon-background d-flex">
                <i class="fa-brands fa-facebook-f"></i>
              </a>
              <a href="https://www.twitter.com" class="icon-background d-flex">
                <i class="fa-brands fa-twitter"></i>
              </a>
              <a href="https://www.tiktok.com" class="icon-background d-flex">
                <i class="fa-brands fa-tiktok"></i>
              </a>
              <a href="https://www.linkedin.com/company/creerlio/?viewAsMember=true" class="icon-background d-flex">
                <i class="fa-brands fa-linkedin-in"></i>
              </a>
            </div>


          </div>
          <div class="col-lg-4 mobile-footer">
            <div class="row footer-right justify-content-between">
             
              <div class="col-lg-6 d-flex flex-column align-content-center flex-wrap gap-4 footer-links">
                <h3 class="text-white">Quick links</h3>
                <ul class="text-white">
                  <li><a href="/creelio-business">CREERLIO For Bussiness</a></li>
                  <li><a href="/talent">CREERLIO For Talent</a></li>
                  <li><a href="/features">Features</a></li>
                  <!-- <li><a href="#handling-reviews">Handling Reviews</a></li> -->
                </ul>
              </div>
              <div class="col-lg-6 d-flex flex-column align-content-end flex-wrap gap-4 footer-links">
                <h3 class="text-white">Contact Us</h3>
                <ul>
                  <li class="text-secondary email">Email: <a href="mailto:finddabs24@yahoo.com">finddabs24@yahoo.com</a></li>
                  <li class="text-secondary phone">Phone: <a href="tel:+19785042054">978.504.2054</a></li>
                  <li class="text-secondary">Address: <a href="https://www.google.com/maps/search/?api=1&query=117+Eastern+Avenue" target="_blank">117 Eastern Avenue</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <div class="row lower-footer d-flex justify-content-between align-content-center">
          <div class="col-lg-6 col-sm-6 d-flex justify-content-start">
            <p class="text-white">Copyright @ 2024. All Right Reserved.</p>
          </div>
          <div class="col-lg-6 col-sm-6 d-flex justify-content-end">
            <p class="text-white">Terms & Conditions | Privacy Policy</p>
          </div>
        </div>
      </div>
    </section>
    <!-- FOOTER WORKS ENDS HERE -->

    <div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 9999">
      <% if (message) { %>
      <div class="toast success align-items-center show" role="alert" aria-live="assertive" aria-atomic="true">
        <div class="d-flex">
          <div class="toast-body"><%= message %></div>
          <button type="button" class="close-btn me-2 m-auto" data-bs-dismiss="toast" aria-label="Close">
            <i class="bi bi-x"></i>
          </button>
        </div>
      </div>
      <% } %>
      <% if (error) { %>
      <div class="toast error align-items-center show" role="alert" aria-live="assertive" aria-atomic="true">
        <div class="d-flex">
          <div class="toast-body"><%= error %></div>
          <button type="button" class="close-btn me-2 m-auto" data-bs-dismiss="toast" aria-label="Close">
            <i class="bi bi-x"></i>
          </button>
        </div>
      </div>
      <% } %>
    </div>