fix search bar

app/routes/auth.py

@@ -122,3 +122,12 @@ def signout():
     session.clear()
     flash("Logged out successfully", category="success")
     return redirect(url_for("auth.login"))
+
+
+@auth_bp.route("/forget_password")
+def forget_password():
+    """
+    Password recovery route
+    Displays the password reset form
+    """
+    return render_template("users/forget_pass.html")

app/templates/menu/menu.html

@@ -13,6 +13,43 @@ block page_title %}Menu Items{% endblock %} {% block styles %}
     border-color: #00a389;
   }
 
+  /* Search and filter section */
+  .search-filter-section {
+    background: white;
+    padding: 1.5rem;
+    border-radius: 12px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+    margin-bottom: 1.5rem;
+  }
+
+  .search-input {
+    max-width: 400px;
+    border-radius: 8px 0 0 8px;
+    padding: 0.75rem 1rem 0.75rem 2.75rem;
+    border: 1px solid #e9ecef;
+    border-right: none;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%236c757d' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E");
+    background-repeat: no-repeat;
+    background-position: 1rem center;
+    background-size: 16px;
+  }
+
+  .search-input:focus {
+    box-shadow: 0 0 0 0.2rem rgba(0, 163, 137, 0.25);
+    border-color: var(--primary-color);
+    outline: none;
+  }
+
+  .search-form .btn-primary {
+    border-radius: 0 8px 8px 0;
+    padding: 0.75rem 1.5rem;
+  }
+
+  .search-form .input-group {
+    width: 400px;
+    max-width: 100%;
+  }
+
   .action-btn {
     display: inline-flex;
     align-items: center;

app/templates/orders/order_history.html

@@ -80,6 +80,7 @@ block styles %}
     background-color: #00a389;
   }
 
+  /* Search and filter section */
   .search-filter-section {
     background: white;
     padding: 1.5rem;
@@ -89,19 +90,31 @@ block styles %}
   }
 
   .search-input {
-    max-width: 300px;
-    border-radius: 20px;
-    padding: 0.75rem 1rem 0.75rem 2.5rem;
-    border: 1px solid #dee2e6;
+    max-width: 400px;
+    border-radius: 8px 0 0 8px;
+    padding: 0.75rem 1rem 0.75rem 2.75rem;
+    border: 1px solid #e9ecef;
+    border-right: none;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%236c757d' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
-    background-position: 12px center;
-    transition: all 0.2s ease;
+    background-position: 1rem center;
+    background-size: 16px;
   }
 
   .search-input:focus {
     box-shadow: 0 0 0 0.2rem rgba(0, 163, 137, 0.25);
-    border-color: #00a389;
+    border-color: var(--primary-color);
+    outline: none;
+  }
+
+  .search-form .btn-primary {
+    border-radius: 0 8px 8px 0;
+    padding: 0.75rem 1.5rem;
+  }
+
+  .search-form .input-group {
+    width: 400px;
+    max-width: 100%;
   }
 
   .restaurant-info {
@@ -151,7 +164,7 @@ block styles %}
 {% endblock %} {% block content %}
 <div class="container-fluid">
   <!-- Search and Filter Section -->
-  <div class="search-filter-section">
+  <div class="search-filter-section mb-4">
     <div class="d-flex justify-content-between align-items-center">
       <form
         action="{{ url_for('order.order_history') }}"
@@ -165,7 +178,7 @@ block styles %}
           placeholder="Search orders..."
           value="{{ search_query or '' }}"
         />
-        <button type="submit" class="btn btn-primary ms-2">
+        <button type="submit" class="btn btn-success ms-2">
           <i class="bi bi-search"></i>
         </button>
         {% if search_query %}