{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sahara</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
    
    <link rel="stylesheet" href="{% static 'css/styles.css' %}">
</head>
<body>
<div class="bg-body-tertiary">
    <nav class="navbar container navbar-expand-lg">
        <div class="container-fluid">
          <a class="navbar-brand" href="{% url 'home' %}"><img src="{% static 'img/logofinal.png' %}" height="50px" width="75px" alt="Logo"></a>
          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <ul class="nav justify-content-center">
            <li class="nav-item">
              <a class="nav-link active" aria-current="page" href="{% url 'home' %}">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">About us</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="{% url 'services' %}">Services</a>
            </li>
          
          {% if request.user.is_authenticated %}
           <li class="nav-item">
              <a class="nav-link" href="{% url 'profiles' request.user.id %}">Profile</a>
            </li>
            {% endif %}
          </ul>
            <div class="login">
            {% if request.user.is_authenticated %}
                <a href="{% url 'logout' %}" class="btn btn-outline-primary">Log Out</a>
              {% else %}
                  <a href="{% url 'register' %}" class="btn btn-outline-success">SignUp</a>
                  <a href="{% url 'login' %}" class="btn btn-outline-primary">Log In</a>
              {% endif %}
            </div>
          </div>
        </div>
      </nav>
    </div>
    <div class="container mt-3">
        {% for message in messages %}
            <div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
                {{ message }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        {% endfor %}
    </div>


      {% block content %}

      {% endblock %}

      <footer class="bg-dark text-white text-center py-3">
    <p>&copy; 2025 Sahara. All Rights Reserved. | <a href="#" class="text-white">Privacy Policy</a> | <a href="#" class="text-white">Terms of Service</a></p>
</footer>