diff --git a/proiect-nutritie-java/src/main/webapp/index.html b/proiect-nutritie-java/src/main/webapp/index.html
index ad7dd50..884f8fe 100644
--- a/proiect-nutritie-java/src/main/webapp/index.html
+++ b/proiect-nutritie-java/src/main/webapp/index.html
@@ -3,128 +3,238 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>NutriAI Pro - Sistem Expert Groq</title>
+    <title>NutriAI Ultra - Elite Coaching</title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
     <style>
-        :root { --primary: #27ae60; --dark: #1e272e; --accent: #3498db; }
-        body { background: #f4f7f6; font-family: 'Inter', sans-serif; overflow-x: hidden; }
-        .sidebar { background: var(--dark); color: white; min-height: 100vh; padding: 25px; box-shadow: 4px 0 15px rgba(0,0,0,0.1); }
-        .chat-container { height: 500px; overflow-y: auto; background: white; border-radius: 20px; padding: 20px; box-shadow: inset 0 2px 10px rgba(0,0,0,0.05); border: 1px solid #dee2e6; }
-        .ai-msg { background: #f0f4f8; padding: 15px; border-radius: 18px 18px 18px 0; margin-bottom: 15px; border-left: 4px solid var(--accent); color: #2c3e50; }
-        .user-msg { background: #e8f5e9; padding: 15px; border-radius: 18px 18px 0 18px; margin-bottom: 15px; text-align: right; border-right: 4px solid var(--primary); margin-left: 15%; color: #1b5e20; }
-        .config-card { background: rgba(255,255,255,0.05); padding: 15px; border-radius: 12px; margin-bottom: 15px; }
-        .kcal-display { background: var(--primary); color: white; padding: 20px; border-radius: 15px; text-align: center; margin-bottom: 20px; }
-        pre { white-space: pre-wrap; word-wrap: break-word; font-family: inherit; margin-bottom: 0; }
+        :root {
+            --bg-dark: #0f172a;
+            --card-bg: #1e293b;
+            --accent-green: #10b981;
+            --accent-blue: #3b82f6;
+            --text-main: #f8fafc;
+            --text-muted: #94a3b8;
+        }
+
+        body { 
+            background-color: var(--bg-dark); 
+            font-family: 'Poppins', sans-serif; 
+            color: var(--text-main);
+            overflow-x: hidden;
+        }
+
+        .sidebar {
+            background: rgba(30, 41, 59, 0.9);
+            backdrop-filter: blur(15px);
+            border-right: 1px solid rgba(255,255,255,0.1);
+            min-height: 100vh;
+            padding: 30px 20px;
+        }
+
+        .glass-card {
+            background: var(--card-bg);
+            border-radius: 20px;
+            border: 1px solid rgba(255,255,255,0.1);
+            padding: 25px;
+            margin-bottom: 25px;
+        }
+
+        /* Chat Window îmbunătățit */
+        .chat-container {
+            height: 65vh;
+            overflow-y: auto;
+            padding: 25px;
+            background: #020617;
+            border-radius: 20px;
+            margin-bottom: 20px;
+            border: 1px solid #1e293b;
+        }
+
+        /* Bule Chat mai mari și mai lizibile */
+        .ai-msg {
+            background: #1e293b;
+            color: #f1f5f9;
+            padding: 25px;
+            border-radius: 20px 20px 20px 5px;
+            margin-bottom: 25px;
+            border-left: 6px solid var(--accent-blue);
+            font-size: 1.15rem; /* Text mai mare */
+            line-height: 1.7;
+            box-shadow: 0 4px 15px rgba(0,0,0,0.2);
+        }
+
+        .user-msg {
+            background: var(--accent-green);
+            color: white;
+            padding: 15px 25px;
+            border-radius: 20px 20px 5px 20px;
+            margin-bottom: 25px;
+            margin-left: 20%;
+            font-weight: 600;
+            font-size: 1.1rem;
+            box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
+        }
+
+        .kcal-badge-ultra {
+            background: linear-gradient(135deg, #10b981 0%, #059669 100%);
+            padding: 30px;
+            border-radius: 25px;
+            text-align: center;
+            box-shadow: 0 0 25px rgba(16, 185, 129, 0.5);
+        }
+
+        .form-control, .form-select {
+            background: #334155 !important;
+            border: 1px solid #475569 !important;
+            color: white !important;
+            padding: 14px;
+            font-size: 1rem;
+        }
+
+        .input-group-custom {
+            background: #1e293b;
+            border-radius: 50px;
+            padding: 8px 15px;
+            border: 2px solid #334155;
+            transition: 0.3s;
+        }
+
+        .input-group-custom:focus-within {
+            border-color: var(--accent-blue);
+            box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);
+        }
+
+        #userInput {
+            background: transparent !important;
+            border: none !important;
+            font-size: 1.2rem;
+            color: white !important;
+        }
+
+        #userInput::placeholder { color: #64748b; }
+
+        .btn-send {
+            background: var(--accent-blue);
+            border-radius: 50%;
+            width: 55px;
+            height: 55px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border: none;
+            color: white;
+            transition: 0.3s;
+        }
+
+        .btn-send:hover { transform: scale(1.1); background: #2563eb; }
+
+        pre { font-size: 1.1rem; color: #e2e8f0; font-family: 'Poppins', sans-serif; white-space: pre-wrap; }
     </style>
 </head>
 <body>
 
 <div class="container-fluid">
     <div class="row">
-        <div class="col-lg-3 sidebar">
-            <h4 class="mb-4 text-success fw-bold"><i class="fas fa-brain me-2"></i>NutriAI v3.0</h4>
+        <div class="col-lg-3 sidebar shadow-lg">
+            <h2 class="fw-bold mb-5 text-center"><i class="fas fa-heartbeat text-primary me-2"></i>Nutri<span class="text-primary">AI</span></h2>
             
-            <div class="config-card">
-                <div class="row g-2">
-                    <div class="col-6 mb-2">
-                        <label class="small opacity-75">Greutate (kg)</label>
-                        <input type="number" id="greutate" class="form-control form-control-sm" value="80">
+            <div class="glass-card">
+                <h6 class="text-uppercase small fw-bold text-primary mb-3"><i class="fas fa-user-circle me-2"></i>Date Biometrice</h6>
+                <div class="row g-3">
+                    <div class="col-6">
+                        <label class="small text-muted mb-1">Greutate (kg)</label>
+                        <input type="number" id="greutate" class="form-control" value="85">
                     </div>
-                    <div class="col-6 mb-2">
-                        <label class="small opacity-75">Înălțime (cm)</label>
-                        <input type="number" id="inaltime" class="form-control form-control-sm" value="180">
+                    <div class="col-6">
+                        <label class="small text-muted mb-1">Înălțime (cm)</label>
+                        <input type="number" id="inaltime" class="form-control" value="180">
                     </div>
-                    <div class="col-6 mb-2">
-                        <label class="small opacity-75">Vârstă</label>
-                        <input type="number" id="varsta" class="form-control form-control-sm" value="30">
-                    </div>
-                    <div class="col-6 mb-2">
-                        <label class="small opacity-75">Sex</label>
-                        <select id="sex" class="form-select form-select-sm">
-                            <option value="masculin">Masculin</option>
-                            <option value="feminin">Feminin</option>
+                    <div class="col-12">
+                        <label class="small text-muted mb-1">Nivel Activitate</label>
+                        <select id="activitate" class="form-select">
+                            <option value="1.2">Sedentar</option>
+                            <option value="1.55">Moderat</option>
+                            <option value="1.75">Sportiv</option>
                         </select>
                     </div>
                 </div>
-                <div class="mb-2">
-                    <label class="small opacity-75">Activitate</label>
-                    <select id="activitate" class="form-select form-select-sm">
-                        <option value="1.2">Sedentar</option>
-                        <option value="1.375">Activitate Ușoară</option>
-                        <option value="1.55">Moderat Activ</option>
-                        <option value="1.725">Foarte Activ</option>
-                    </select>
-                </div>
             </div>
 
-            <div class="config-card">
-                <label class="fw-bold d-block mb-2">Ajustare Obiectiv</label>
+            <div class="glass-card">
+                <h6 class="text-uppercase small fw-bold text-primary mb-3"><i class="fas fa-bullseye me-2"></i>Ajustare Obiectiv</h6>
                 <input type="range" class="form-range" id="kcalAdjust" min="-800" max="800" step="50" value="0">
-                <div class="d-flex justify-content-between small opacity-75">
+                <div class="d-flex justify-content-between mt-2 fw-bold text-info">
                     <span>Slăbire</span>
-                    <span id="sliderVal" class="text-success fw-bold">0 kcal</span>
+                    <span id="sliderLabel">0 kcal</span>
                     <span>Masă</span>
                 </div>
             </div>
 
-            <div class="kcal-display shadow-sm">
-                <small class="opacity-75">Țintă zilnică calculată</small>
-                <h2 class="mb-0 fw-bold"><span id="totalKcal">2500</span> kcal</h2>
+            <div class="kcal-badge-ultra">
+                <span class="text-uppercase small fw-bold opacity-75">Necesar Zilnic</span>
+                <h1 class="fw-bold mb-0" id="totalKcal">2500</h1>
+                <span class="fw-bold">KCAL / ZI</span>
             </div>
 
-            <button onclick="calculateAndSync()" class="btn btn-success w-100 fw-bold py-2 mb-3 shadow">
+            <button onclick="calculateAndSync()" class="btn btn-primary w-100 mt-4 py-3 fw-bold rounded-pill shadow">
                 <i class="fas fa-sync-alt me-2"></i>RECALCULEAZĂ
             </button>
         </div>
 
-        <div class="col-lg-9 p-4">
-            <div class="mx-auto" style="max-width: 900px;">
-                <div class="d-flex justify-content-between align-items-center mb-3">
-                    <h4 class="fw-bold mb-0 text-dark"><i class="fas fa-comments me-2 text-primary"></i>Consultant Nutrițional Real-Time</h4>
-                    <span class="badge bg-success">Powered by Groq AI</span>
+        <div class="col-lg-9 p-md-5 p-3">
+            <div class="d-flex align-items-center mb-4">
+                <div class="flex-grow-1">
+                    <h1 class="fw-bold mb-1">Asistent Nutriție Elite</h1>
+                    <p class="text-muted"><i class="fas fa-bolt text-warning me-2"></i>Procesare ultra-rapidă prin Groq Llama 3.3</p>
                 </div>
+            </div>
 
-                <div id="chatBox" class="chat-container mb-3">
-                    <div class="ai-msg">
-                        Bună! Sunt consultantul tău AI. Am preluat datele tale bio. <br><br>
-                        <strong>Cum te pot ajuta astăzi?</strong> Îmi poți cere un meniu săptămânal, o listă de cumpărături sau un program de antrenament adaptat caloriilor tale.
-                    </div>
+            <div id="chatBox" class="chat-container shadow-2xl">
+                <div class="ai-msg">
+                    <h4 class="fw-bold mb-3"><i class="fas fa-robot me-2"></i>Sistemul este pregătit.</h4>
+                    Salut! Am configurat profilul tău pentru <strong id="kcalTag">2500</strong> calorii. <br>
+                    <strong>Ce dorești să facem?</strong> Poți cere un meniu pe o zi, pe o săptămână sau chiar o rețetă specifică.
                 </div>
+            </div>
 
-                <div class="input-group input-group-lg shadow-sm">
-                    <input type="text" id="userInput" class="form-control border-0 ps-4" placeholder="Ex: Generează-mi meniul pe toată săptămâna, sunt vegetarian...">
-                    <button onclick="sendToGroq()" class="btn btn-primary px-4 border-0">
-                        <i class="fas fa-paper-plane"></i>
-                    </button>
-                </div>
-                <p class="text-center text-muted small mt-2">AI-ul va genera meniuri detaliate cu gramaje și instrucțiuni.</p>
+            <div class="input-group-custom d-flex align-items-center mt-4 shadow-lg">
+                <input type="text" id="userInput" class="form-control" placeholder="Scrie aici mesajul tău și apasă ENTER...">
+                <button onclick="sendToGroq()" class="btn btn-send shadow">
+                    <i class="fas fa-paper-plane"></i>
+                </button>
             </div>
         </div>
     </div>
 </div>
 
 <script>
-    const GROQ_API_KEY = "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";
+    const GROQ_API_KEY = "AICI_PUI_CHEIA_TA_GROQ";
     let currentKcal = 0;
 
+    // --- FUNCȚIA ENTER KEY ---
+    document.getElementById('userInput').addEventListener('keypress', function (e) {
+        if (e.key === 'Enter') {
+            sendToGroq();
+        }
+    });
+
     document.getElementById('kcalAdjust').addEventListener('input', function() {
-        document.getElementById('sliderVal').innerText = (this.value > 0 ? '+' : '') + this.value + " kcal";
+        document.getElementById('sliderLabel').innerText = (this.value > 0 ? '+' : '') + this.value + " kcal";
         calculateAndSync();
     });
 
     function calculateAndSync() {
         const g = parseFloat(document.getElementById('greutate').value);
         const i = parseFloat(document.getElementById('inaltime').value);
-        const v = parseFloat(document.getElementById('varsta').value);
-        const s = document.getElementById('sex').value;
         const act = parseFloat(document.getElementById('activitate').value);
         const adj = parseInt(document.getElementById('kcalAdjust').value);
 
-        let bmr = (s === 'masculin') ? (10 * g) + (6.25 * i) - (5 * v) + 5 : (10 * g) + (6.25 * i) - (5 * v) - 161;
+        let bmr = (10 * g) + (6.25 * i) - (5 * 30) + 5;
         currentKcal = Math.round((bmr * act) + adj);
         
         document.getElementById('totalKcal').innerText = currentKcal;
+        document.getElementById('kcalTag').innerText = currentKcal;
     }
 
     async function sendToGroq() {
@@ -136,7 +246,7 @@
         input.value = "";
 
         const loadingId = "loading-" + Date.now();
-        addMessage("ai", '<div class="spinner-border spinner-border-sm text-primary"></div> AI-ul generează planul...', loadingId);
+        addMessage("ai", '<div class="spinner-border spinner-border-sm text-info me-2"></div> Se generează răspunsul...', loadingId);
 
         try {
             const response = await fetch("https://api.groq.com/openai/v1/chat/completions", {
@@ -150,25 +260,18 @@
                     messages: [
                         {
                             role: "system", 
-                            content: `Ești un nutriționist și antrenor expert. 
-                            Date utilizator: ${currentKcal} kcal/zi necesare.
-                            Sarcina ta: Generează meniuri săptămânale detaliate, liste de cumpărături sau planuri de antrenament.
-                            Include gramaje precise (ex: 150g pui) și calorii per masă. 
-                            Răspunde prietenos în limba română, folosind Markdown pentru claritate.`
+                            content: `Ești un nutriționist de top. Ținta utilizatorului este de ${currentKcal} kcal. Răspunde exclusiv în ROMÂNĂ. Folosește Markdown (tabele, liste) pentru claritate maximă.`
                         },
                         { role: "user", content: userText }
-                    ],
-                    temperature: 0.7
+                    ]
                 })
             });
 
             const data = await response.json();
-            const aiText = data.choices[0].message.content;
-            
-            document.getElementById(loadingId).innerHTML = `<pre>${aiText}</pre>`;
+            const text = data.choices[0].message.content;
+            document.getElementById(loadingId).innerHTML = `<pre>${text}</pre>`;
         } catch (error) {
-            document.getElementById(loadingId).innerText = "Eroare! Verifică dacă API Key-ul de Groq este corect.";
-            console.error(error);
+            document.getElementById(loadingId).innerText = "Eroare la conexiunea cu AI-ul!";
         }
     }
 
@@ -180,6 +283,5 @@
 
     calculateAndSync();
 </script>
-
 </body>
 </html>
\ No newline at end of file
