DramLog UI Overhaul: Rebranding, Navigation Improvements, and Scan Workflow Fixes

- Renamed app to DramLog and updated branding to Gold (#C89D46)
- Implemented new BottomNavigation with Floating Scan Button
- Fixed 'black screen' race condition in ScanAndTasteFlow
- Refactored TastingEditor and StatsDashboard for a cleaner editorial look
- Standardized colors and typography across the application

src/components/BottomNavigation.tsx

@@ -0,0 +1,108 @@
+'use client';
+
+import React from 'react';
+import { Home, Grid, Scan, User, Search } from 'lucide-react';
+import { usePathname } from 'next/navigation';
+
+interface BottomNavigationProps {
+    onHome?: () => void;
+    onShelf?: () => void;
+    onSearch?: () => void;
+    onProfile?: () => void;
+    onScan: (base64: string) => void;
+}
+
+export const BottomNavigation = ({ onHome, onShelf, onSearch, onProfile, onScan }: BottomNavigationProps) => {
+    const fileInputRef = React.useRef<HTMLInputElement>(null);
+
+    const handleScanClick = () => {
+        fileInputRef.current?.click();
+    };
+
+    const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        const file = e.target.files?.[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onloadend = () => {
+                onScan(reader.result as string);
+            };
+            reader.readAsDataURL(file);
+        }
+    };
+
+    return (
+        <div className="fixed bottom-0 left-0 w-full z-50 pointer-events-none">
+            {/* Hidden Input for Scanning */}
+            <input
+                type="file"
+                ref={fileInputRef}
+                onChange={handleFileChange}
+                accept="image/*"
+                className="hidden"
+            />
+
+            {/* Background Container mit Glassmorphism */}
+            <div className="relative bg-[#0F1014]/90 backdrop-blur-xl border-t border-white/10 pb-safe pt-2 pointer-events-auto shadow-[0_-10px_40px_rgba(0,0,0,0.5)]">
+
+                <div className="flex justify-between items-end px-6 h-16">
+                    {/* Left Actions */}
+                    <button
+                        onClick={onHome}
+                        className="flex flex-col items-center gap-1 text-[#C89D46] w-12 transition-all active:scale-90"
+                    >
+                        <Home size={24} />
+                        <span className="text-[10px] font-medium font-sans uppercase tracking-widest opacity-80">Home</span>
+                    </button>
+
+                    <button
+                        onClick={onShelf}
+                        className="flex flex-col items-center gap-1 text-[#8F9096] hover:text-white w-12 transition-all active:scale-90"
+                    >
+                        <Grid size={24} />
+                        <span className="text-[10px] font-medium font-sans uppercase tracking-widest opacity-80">Shelf</span>
+                    </button>
+
+                    {/* Spacer für den Center Button */}
+                    <div className="w-16" />
+
+                    {/* Right Actions */}
+                    <button
+                        onClick={onSearch}
+                        className="flex flex-col items-center gap-1 text-[#8F9096] hover:text-white w-12 transition-all active:scale-90"
+                    >
+                        <Search size={24} />
+                        <span className="text-[10px] font-medium font-sans uppercase tracking-widest opacity-80">Search</span>
+                    </button>
+
+                    <button
+                        onClick={onProfile}
+                        className="flex flex-col items-center gap-1 text-[#8F9096] hover:text-white w-12 transition-all active:scale-90"
+                    >
+                        <User size={24} />
+                        <span className="text-[10px] font-medium font-sans uppercase tracking-widest opacity-80">Admin</span>
+                    </button>
+                </div>
+
+                {/* THE FLOATING MAGIC BUTTON */}
+                <div className="absolute -top-10 left-1/2 -translate-x-1/2 pointer-events-auto">
+                    <button
+                        onClick={handleScanClick}
+                        className="flex items-center justify-center w-20 h-20 rounded-full 
+                        bg-gradient-to-tr from-[#C89D46] to-[#E0B456]
+                        shadow-[0_0_30px_rgba(200,157,70,0.4)]
+                        border-[6px] border-[#0F1014]
+                        active:scale-95 transition-transform duration-200"
+                        aria-label="Scan Bottle"
+                    >
+                        <div className="bg-[#0F1014] p-3 rounded-full">
+                            <Scan color="#C89D46" size={32} strokeWidth={2.5} />
+                        </div>
+                    </button>
+                    {/* Visual Gold Glow */}
+                    <div className="absolute inset-0 rounded-full bg-[#C89D46]/20 blur-2xl -z-10 animate-pulse" />
+                </div>
+
+            </div>
+        </div>
+    );
+};