New icon for PWA. CSS corrections.

frontend/index.html

@@ -7,7 +7,7 @@
     <title>FarmaClic</title>
     <link rel="icon" href="/favicon.png" type="image/png" />
     <link rel="icon" href="/favicon.ico" sizes="32x32" />
-    <link rel="apple-touch-icon" href="/logo.png" />
+    <link rel="apple-touch-icon" href="/farmaclic_logo.png" />
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">

frontend/src/components/BottomNav.css

@@ -132,6 +132,12 @@
   stroke-width: 2.5;
 }
 
+.bottom-nav-item:hover {
+  color: var(--primary);
+  background: transparent;
+  font-weight: 700;
+}
+
 .nav-elevated.active .nav-label {
   color: var(--tertiary);
-}
+}

frontend/src/views/SearchView.css

@@ -44,31 +44,41 @@
   transform: scale(0.96);
 }
 
-.suggestion-btn--primary {
+.suggestion-btn:hover {
-  background: var(--primary);
+  background: #83afd6;
-  color: var(--on-primary);
+  font-weight: 700;
 }
 
-.suggestion-btn--secondary {
+.suggestion-btn--neutral-1 {
-  background: var(--secondary);
+  background: #ffffff;
-  color: var(--on-secondary);
+  color: #1e293b;
+  border: 1px solid #e2e8f0;
 }
 
-.suggestion-btn--tertiary {
+.suggestion-btn--neutral-2 {
-  background: var(--tertiary-container);
+  background: #f0f7ff;
-  color: var(--on-tertiary);
+  color: #1e293b;
+  border: 1px solid #dbeafe;
 }
 
-.suggestion-btn--tint {
+.suggestion-btn--neutral-3 {
-  background: var(--surface-tint);
+  background: #e0f0ff;
-  color: var(--on-primary);
+  color: #1e293b;
+  border: 1px solid #bfdbfe;
+}
+
+.suggestion-btn--neutral-4 {
+  background: #d4ebff;
+  color: #1e293b;
+  border: 1px solid #93c5fd;
 }
 
 .suggestion-icon {
   width: 2.5rem;
   height: 2.5rem;
   border-radius: var(--radius);
-  background: rgba(255, 255, 255, 0.2);
+  background: rgba(59, 130, 246, 0.08);
+  color: #3b82f6;
   display: flex;
   align-items: center;
   justify-content: center;

frontend/src/views/SearchView.jsx

@@ -7,10 +7,10 @@ import { haversineKm, getUserPosition } from '../utils/geo';
 import './SearchView.css';
 
 const suggestions = [
-  { name: 'Paracetamol', icon: 'medication', color: 'primary' },
+  { name: 'Paracetamol', icon: 'medication', color: 'neutral-1' },
-  { name: 'Ibuprofeno', icon: 'pill', color: 'secondary' },
+  { name: 'Ibuprofeno', icon: 'pill', color: 'neutral-2' },
-  { name: 'Aspirina', icon: 'vaccines', color: 'tertiary' },
+  { name: 'Aspirina', icon: 'vaccines', color: 'neutral-3' },
-  { name: 'Omeprazol', icon: 'emergency_home', color: 'tint' },
+  { name: 'Omeprazol', icon: 'emergency_home', color: 'neutral-4' },
 ];
 
 function SearchView({ currentUser, onLoginRequest }) {

frontend/vite.config.js

@@ -25,9 +25,7 @@ export default defineConfig({
         display: 'standalone',
         start_url: '/',
         icons: [
-          { src: '/logo-square-192.png', sizes: '192x192', type: 'image/png', purpose: 'any' },
+          { src: '/farmaclic_logo.png', sizes: '512x512', type: 'image/png', purpose: 'any maskable' },
-          { src: '/logo-square-512.png', sizes: '512x512', type: 'image/png', purpose: 'any' },
-          { src: '/logo.png', sizes: '512x279', type: 'image/png', purpose: 'any' },
         ],
       },
     }),