feat: Add Nearby Labs feature and commission fee displays

client/src/components/Patient/BookAppointment/BookingSummary.jsx

@@ -63,7 +63,7 @@ const BookingSummary = ({
             </div>
           </div>
 
-          <div className="flex items-center justify-between pt-2 bg-white rounded-lg p-3 shadow-sm">
+          <div className="flex items-center justify-between pt-2 bg-white rounded-lg p-3 shadow-sm mb-3">
             <div className="flex items-center gap-2">
               <DollarSign className="w-5 h-5 text-slate-700" />
               <span className="text-xs lg:text-sm font-semibold text-gray-700">
@@ -72,6 +72,17 @@ const BookingSummary = ({
             </div>
             <div className="text-xl lg:text-2xl font-bold text-gray-900">₹{consultationFee}</div>
           </div>
+
+          <div className="bg-blue-50 border-2 border-blue-200 rounded-xl p-3">
+            <div className="flex items-center justify-between mb-2">
+              <span className="text-xs lg:text-sm font-semibold text-blue-900">QuickClinic Commission</span>
+              <span className="text-xs lg:text-sm text-blue-700 font-semibold">1%</span>
+            </div>
+            <div className="flex items-center justify-between">
+              <span className="text-xs text-blue-800">Our platform fee</span>
+              <span className="text-sm lg:text-base font-bold text-blue-900">₹{Math.round(consultationFee * 0.01)}</span>
+            </div>
+          </div>
         </div>
       </div>
 

client/src/components/quicklab/DesktopNavbar.jsx

@@ -8,6 +8,7 @@ import {
   Calendar,
   TestTube,
   Settings,
+  MapPin,
 } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
 import { useAuth } from '../../context/authContext';
@@ -242,6 +243,18 @@ export default function DesktopNavbar({ searchQuery, setSearchQuery }) {
             {/* Dark Mode Toggle */}
             <DarkModeToggle />
 
+            {/* Nearby Labs Button - Always visible for public and patients */}
+            {(!isAuthenticated || user?.role === 'patient') && (
+              <button
+                onClick={() => navigate('/quick-lab/nearby')}
+                className="hidden md:inline-flex items-center gap-2 px-4 py-2 text-slate-700 dark:text-slate-300 hover:text-yellow-600 dark:hover:text-yellow-400 font-medium transition-colors bg-yellow-50 dark:bg-slate-800 rounded-lg hover:bg-yellow-100 dark:hover:bg-slate-700"
+                title="Find Nearby Labs"
+              >
+                <MapPin className="h-5 w-5" />
+                Nearby Labs
+              </button>
+            )}
+
             {/* Explore Dropdown (Quick Clinic / Quick Med) for patients & public */}
             {(!isAuthenticated || user?.role === 'patient') && (
               <div className="relative" ref={exploreRef}>

client/src/components/quicklab/MobileNavbar.jsx

@@ -11,6 +11,7 @@ import {
   Calendar,
   TestTube,
   Settings,
+  MapPin,
 } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
 import { useAuth } from '../../context/authContext';
@@ -248,6 +249,17 @@ export default function MobileNavbar({ searchQuery, setSearchQuery }) {
             </span>
           </div>
 
+          {/* Nearby Labs Button - Always visible for public and patients */}
+          {(!isAuthenticated || user?.role === 'patient') && (
+            <button
+              onClick={() => navigate('/quick-lab/nearby')}
+              className="flex flex-col items-center justify-center w-full h-full space-y-1 text-slate-500 dark:text-slate-400 hover:text-yellow-600 dark:hover:text-yellow-400 transition-colors active:scale-95"
+            >
+              <MapPin className="h-6 w-6" />
+              <span className="text-xs font-medium">Nearby</span>
+            </button>
+          )}
+
           {/* Explore toggle for patients & public */}
           {(!isAuthenticated || user?.role === 'patient') && (
             <>

client/src/components/quickmed/Navbar.jsx

@@ -123,7 +123,7 @@ const Navbar = () => {
           {/* Desktop Navigation */}
           <div className="hidden md:flex items-center space-x-4">
             {/* Explore Dropdown (patients & public) */}
-            {(!isAuthenticated || user?.role === 'patient') && (
+
               <div className="relative" ref={exploreRef}>
                 <button
                   onClick={() => setIsExploreOpen((v) => !v)}
@@ -154,7 +154,7 @@ const Navbar = () => {
                   </div>
                 )}
               </div>
-            )}
+
             <DarkModeToggle />
           </div>
 

client/src/pages/quicklab/LabDetails.jsx

@@ -464,10 +464,21 @@ export default function LabDetails() {
                     </div>
 
                     <div className="border-t border-lab-black-100 pt-3 mb-4">
-                      <div className="flex justify-between text-lg font-bold">
+                      <div className="flex justify-between text-lg font-bold mb-3">
                         <span className="text-lab-black-900">Total</span>
                         <span className="text-lab-yellow-600">₹{calculateTotal()}</span>
                       </div>
+
+                      <div className="bg-blue-50 border border-blue-200 rounded-lg p-3">
+                        <div className="flex items-center justify-between text-sm mb-2">
+                          <span className="text-blue-900 font-medium">QuickClinic Commission</span>
+                          <span className="text-blue-700 font-semibold">1%</span>
+                        </div>
+                        <div className="flex items-center justify-between text-sm">
+                          <span className="text-blue-900 text-xs">Our platform fee</span>
+                          <span className="text-blue-900 font-bold">₹{Math.round(calculateTotal() * 0.01)}</span>
+                        </div>
+                      </div>
                     </div>
 
                     <button