From c23c8606987df1bac449f3c67f68edca9548747a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjazzz2502=E2=80=9D?=
 <“jasmine250206@gmail.com”>
Date: Thu, 11 Jun 2026 22:13:49 +0530
Subject: [PATCH 1/2] feat: move language and theme controls to mobile bottom
 nav

---
 src/components/BottomNav.tsx | 31 +++++++++++++++++++++++++++++--
 src/components/Navbar.tsx    |  2 +-
 2 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/src/components/BottomNav.tsx b/src/components/BottomNav.tsx
index db85f8f..9d0d957 100644
--- a/src/components/BottomNav.tsx
+++ b/src/components/BottomNav.tsx
@@ -1,14 +1,16 @@
 import { Link, useLocation } from 'react-router-dom';
-import { ScanLine, Map, Layers } from 'lucide-react';
+import { ScanLine, Map, Languages, SunMoon } from 'lucide-react';
+import { useTranslation } from "react-i18next";
+import { toggleTheme } from '../lib/theme';
 
 const navItems = [
   { to: '/scanner', icon: ScanLine, label: 'SCANNER' },
   { to: '/map', icon: Map, label: 'MAP' },
-  { to: '/mode', icon: Layers, label: 'MODE' },
 ];
 
 export default function BottomNav() {
   const location = useLocation();
+  const { i18n } = useTranslation();
 
   return (
     <nav className="md:hidden fixed bottom-0 left-0 right-0 z-50 glass-panel border-t border-outline-variant/15">
@@ -29,6 +31,31 @@ export default function BottomNav() {
             </Link>
           );
         })}
+                <button
+          type="button"
+          onClick={toggleTheme}
+          className="flex flex-col items-center gap-1 text-on-surface-variant hover:text-neon transition-colors duration-200"
+          aria-label="Toggle theme"
+        >
+          <SunMoon size={20} strokeWidth={1.5} />
+          <span className="font-[family-name:var(--font-mono)] text-[0.5625rem] tracking-widest">
+            THEME
+          </span>
+        </button>
+
+        <label className="flex flex-col items-center gap-1 text-on-surface-variant">
+          <Languages size={20} strokeWidth={1.5} />
+          <select
+            value={i18n.language}
+            onChange={(e) => i18n.changeLanguage(e.target.value)}
+            className="bg-transparent font-[family-name:var(--font-mono)] text-[0.5625rem] tracking-widest outline-none"
+            aria-label="Change language"
+          >
+            <option value="en">EN</option>
+            <option value="hi">HI</option>
+            <option value="bn">BN</option>
+          </select>
+        </label>
       </div>
     </nav>
   );
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index e0d90f0..d4cb521 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -93,7 +93,7 @@ export default function Navbar() {
         </div>
 
         {/* Auth Button & Theme Toggle */}
-        <div className="flex items-center gap-2 sm:gap-4">
+        <div className="hidden md:flex items-center gap-2 sm:gap-4">
           <select
             value={i18n.language}
             onChange={(e) => i18n.changeLanguage(e.target.value)}

From 81d26ecee75ec7206d193657602392fdececd908 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjazzz2502=E2=80=9D?=
 <“jasmine250206@gmail.com”>
Date: Fri, 12 Jun 2026 15:53:47 +0530
Subject: [PATCH 2/2] fix: restore mode item in mobile bottom nav

---
 src/components/BottomNav.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/BottomNav.tsx b/src/components/BottomNav.tsx
index 9d0d957..df17c08 100644
--- a/src/components/BottomNav.tsx
+++ b/src/components/BottomNav.tsx
@@ -1,11 +1,12 @@
 import { Link, useLocation } from 'react-router-dom';
-import { ScanLine, Map, Languages, SunMoon } from 'lucide-react';
+import { ScanLine, Map, Layers, Languages, SunMoon } from 'lucide-react';
 import { useTranslation } from "react-i18next";
 import { toggleTheme } from '../lib/theme';
 
 const navItems = [
   { to: '/scanner', icon: ScanLine, label: 'SCANNER' },
   { to: '/map', icon: Map, label: 'MAP' },
+  { to: '/mode', icon: Layers, label: 'MODE' },
 ];
 
 export default function BottomNav() {