Switch navbar to #001321, admin can update logo/favicon, logo links home

src/components/Navbar.tsx

@@ -15,6 +15,7 @@ const links = [
 
 export default function Navbar() {
   const [auth, setAuth] = useState<{ authenticated: boolean; role?: string } | null>(null);
+  const [logo, setLogo] = useState<string | null>(null);
   const router = useRouter();
   const pathname = usePathname();
 
@@ -23,6 +24,30 @@ export default function Navbar() {
       .then((res) => (res.ok ? res.json() : { authenticated: false }))
       .then((data) => setAuth(data))
       .catch(() => setAuth({ authenticated: false }));
+
+    fetch('/api/site-assets?key=logo')
+      .then(async (res) => {
+        if (!res.ok) return null;
+        const data = await res.json();
+        return data.data || null;
+      })
+      .then((url) => setLogo(url))
+      .catch(() => setLogo(null));
+
+    fetch('/api/site-assets?key=favicon')
+      .then(async (res) => {
+        if (!res.ok) return;
+        const data = await res.json();
+        if (!data.data) return;
+        let link = document.querySelector("link[rel~='icon']") as HTMLLinkElement | null;
+        if (!link) {
+          link = document.createElement('link');
+          link.rel = 'icon';
+          document.head.appendChild(link);
+        }
+        link.href = data.data;
+      })
+      .catch(() => {});
   }, []);
 
   const handleLogout = async () => {
@@ -37,10 +62,10 @@ export default function Navbar() {
     display: 'flex',
     gap: '1.5rem',
     alignItems: 'center',
-    padding: '0.75rem 1.5rem',
-    background: '#010D1E',
+    padding: '0.6rem 1.5rem',
+    background: '#001321',
     color: '#f5f0e8',
-    boxShadow: '0 2px 8px rgba(1,13,30,0.25)',
+    boxShadow: '0 2px 8px rgba(0,19,33,0.35)',
     zIndex: 50,
   };
 
@@ -60,8 +85,14 @@ export default function Navbar() {
 
   return (
     <nav style={navStyle}>
-      <Link href="/" style={{ fontWeight: 700, color: '#E8A849', textDecoration: 'none', fontSize: '20px', fontStyle: 'italic' }}>
-        La Huasca
+      <Link href="/" style={{ display: 'flex', alignItems: 'center', gap: '12px', textDecoration: 'none' }}>
+        {logo ? (
+          <img src={logo} alt="La Huasca" style={{ height: '36px', width: 'auto', maxWidth: '160px', objectFit: 'contain' }} />
+        ) : (
+          <span style={{ fontWeight: 700, color: '#E8A849', fontSize: '20px', fontStyle: 'italic' }}>
+            La Huasca
+          </span>
+        )}
       </Link>
       {links.map((link) => (
         <Link
@@ -97,7 +128,7 @@ export default function Navbar() {
           href="/login"
           style={{
             marginLeft: 'auto',
-            color: '#010D1E',
+            color: '#001321',
             textDecoration: 'none',
             background: '#E8A849',
             padding: '0.45rem 0.9rem',