Update login and dashboard, fix files

src/components/admin/DashboardOverview.jsx

@@ -1,9 +1,11 @@
 import React, { useState, useEffect } from 'react';
 import { db } from '../../firebase/config';
 import { ref, onValue, push, set } from 'firebase/database';
-import { TrendingUp, Users, ShoppingBag, AlertCircle } from 'lucide-react';
+import { TrendingUp, Users, ShoppingBag, AlertCircle, UtensilsCrossed, DollarSign, ShieldCheck, User, Utensils } from 'lucide-react';
+import { useNavigate } from 'react-router-dom';
 
-export default function DashboardOverview() {
+export default function DashboardOverview({ setActiveTab }) {
+  const navigate = useNavigate();
   const [stats, setStats] = useState({ ventasHoy: 0, mesasActivas: 0, stockBajo: 0 });
 
   useEffect(() => {
@@ -103,6 +105,26 @@ export default function DashboardOverview() {
         ))}
       </div>
 
+      <div style={{ marginBottom: '3rem' }}>
+        <h3 className="text-gradient" style={{ marginBottom: '1.5rem', fontSize: '1.25rem' }}>Accesos Rápidos</h3>
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(180px, 1fr))', gap: '1rem' }}>
+          {[
+            { label: 'Administrador', icon: <ShieldCheck size={28} />, action: () => setActiveTab && setActiveTab('overview'), color: 'var(--primary)', bg: 'rgba(255,90,95,0.1)' },
+            { label: 'Caja', icon: <DollarSign size={28} />, action: () => setActiveTab && setActiveTab('cash'), color: 'var(--success)', bg: 'rgba(32, 201, 151, 0.1)' },
+            { label: 'Mesero / POS', icon: <User size={28} />, action: () => navigate('/pos'), color: 'var(--info)', bg: 'rgba(50, 173, 230, 0.1)' },
+            { label: 'Cocina', icon: <UtensilsCrossed size={28} />, action: () => window.open('/kitchen', '_blank'), color: 'var(--warning)', bg: 'rgba(245, 166, 35, 0.1)' },
+            { label: 'Carta Digital', icon: <Utensils size={28} />, action: () => window.open('/menu', '_blank'), color: '#a855f7', bg: 'rgba(168, 85, 247, 0.1)' }
+          ].map((btn, idx) => (
+            <button key={idx} onClick={btn.action} className="glass-card" style={{ padding: '1.5rem', display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '1rem', border: `1px solid ${btn.bg}`, cursor: 'pointer', transition: 'all 0.3s ease' }} onMouseOver={e => e.currentTarget.style.transform = 'translateY(-5px)'} onMouseOut={e => e.currentTarget.style.transform = 'translateY(0)'}>
+              <div style={{ width: '60px', height: '60px', borderRadius: '50%', background: btn.bg, color: btn.color, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+                {btn.icon}
+              </div>
+              <span style={{ fontWeight: '600', color: 'var(--text-main)' }}>{btn.label}</span>
+            </button>
+          ))}
+        </div>
+      </div>
+
       <div className="glass-card">
         <h3 className="text-gradient" style={{ marginBottom: '1rem' }}>Misión del Sistema</h3>
         <p style={{ color: 'var(--text-muted)', lineHeight: '1.6' }}>

src/pages/AdminDashboard.jsx

@@ -77,7 +77,7 @@ export default function AdminDashboard() {
       {/* Main Content Area */}
       <main className="main-content" style={{ overflowY: 'auto', background: 'var(--bg-base)' }}>
         <div className="animate-fade-in" style={{ width: '100%', maxWidth: '1200px', margin: '0 auto', padding: '2rem' }}>
-          {activeTab === 'overview' && <DashboardOverview />}
+          {activeTab === 'overview' && <DashboardOverview setActiveTab={setActiveTab} />}
           {activeTab === 'menu' && <MenuEditor />}
           {activeTab === 'inventory' && <InventoryControl />}
           {activeTab === 'reports' && <Reports />}

src/pages/Login.jsx

@@ -87,54 +87,31 @@ export default function Login() {
             onClick={() => { setDemo('admin'); setError(''); }}
             style={{
               padding: '20px', borderRadius: 'var(--radius-sm)', border: '1px solid',
-              borderColor: loginMode === 'admin' ? 'var(--primary)' : 'transparent',
-              background: loginMode === 'admin' ? 'rgba(255,107,107,0.1)' : 'rgba(255,255,255,0.02)',
+              borderColor: 'var(--primary)',
+              background: 'rgba(255,107,107,0.1)',
               display: 'flex', alignItems: 'center', gap: '15px', textAlign: 'left',
               transition: 'all 0.3s ease', cursor: 'pointer'
             }}
           >
             <div style={{
               padding: '10px', borderRadius: '10px',
-              background: loginMode === 'admin' ? 'var(--primary)' : 'rgba(255,255,255,0.05)',
-              color: loginMode === 'admin' ? '#fff' : 'var(--text-muted)'
+              background: 'var(--primary)',
+              color: '#fff'
             }}>
               <ShieldCheck size={24} />
             </div>
             <div>
-              <div style={{ fontWeight: '700', color: loginMode === 'admin' ? 'var(--text-main)' : 'var(--text-muted)' }}>Administrador</div>
+              <div style={{ fontWeight: '700', color: 'var(--text-main)' }}>Administrador</div>
               <div style={{ fontSize: '0.75rem', color: 'var(--text-muted)' }}>Gestión y Reportes</div>
             </div>
           </button>
-
-          <button
-            onClick={() => { setDemo('mesero'); setError(''); }}
-            style={{
-              padding: '20px', borderRadius: 'var(--radius-sm)', border: '1px solid',
-              borderColor: loginMode === 'mesero' ? 'var(--primary)' : 'transparent',
-              background: loginMode === 'mesero' ? 'rgba(255,107,107,0.1)' : 'rgba(255,255,255,0.02)',
-              display: 'flex', alignItems: 'center', gap: '15px', textAlign: 'left',
-              transition: 'all 0.3s ease', cursor: 'pointer'
-            }}
-          >
-            <div style={{
-              padding: '10px', borderRadius: '10px',
-              background: loginMode === 'mesero' ? 'var(--primary)' : 'rgba(255,255,255,0.05)',
-              color: loginMode === 'mesero' ? '#fff' : 'var(--text-muted)'
-            }}>
-              <User size={24} />
-            </div>
-            <div>
-              <div style={{ fontWeight: '700', color: loginMode === 'mesero' ? 'var(--text-main)' : 'var(--text-muted)' }}>Mesero / POS</div>
-              <div style={{ fontSize: '0.75rem', color: 'var(--text-muted)' }}>Pedidos y Control</div>
-            </div>
-          </button>
         </div>
 
         {/* Lado Derecho: Formulario de Login */}
         <div style={{ flex: 1, padding: '60px' }}>
           <div style={{ marginBottom: '40px' }}>
             <h1 className="text-gradient" style={{ fontSize: '2.5rem', fontWeight: '900', marginBottom: '10px' }}>
-              {loginMode === 'admin' ? 'Dashboard Admin' : 'Terminal Meseros'}
+              Dashboard Admin
             </h1>
             <p style={{ color: 'var(--text-muted)' }}>Ingrese sus credenciales para continuar</p>
           </div>
@@ -167,12 +144,12 @@ export default function Login() {
 
           {/* Botón Demo rápido */}
           <div style={{ marginTop: '30px', textAlign: 'center' }}>
-            <button
-              onClick={() => setDemo(loginMode)}
-              style={{ background: 'none', border: 'none', color: 'var(--text-muted)', cursor: 'pointer', textDecoration: 'underline', fontSize: '0.85rem' }}
-            >
-              Usar cuenta de prueba para {loginMode === 'admin' ? 'Admin' : 'Mesero'}
-            </button>
+              <button
+                onClick={() => setDemo('admin')}
+                style={{ background: 'none', border: 'none', color: 'var(--text-muted)', cursor: 'pointer', textDecoration: 'underline', fontSize: '0.85rem' }}
+              >
+                Usar credenciales de prueba
+              </button>
           </div>
         </div>
       </div>