Manual changes saved

index.html

@@ -6,12 +6,11 @@
     <title>DAC Private Intelligence</title>
     <style>
         :root {
-            /* Palette Ultra-Premium */
             --bg-dark: #000000;
-            --bg-sidebar: rgba(20, 20, 20, 0.9);
+            --bg-sidebar: rgba(15, 15, 15, 0.95);
             --bg-glass: rgba(255, 255, 255, 0.04);
-            /* Gradiente compatto per l'aura */
-            --primary-rainbow: linear-gradient(90deg, #4285f4, #9b72cb, #d96570, #4285f4);
+            /* Gradiente morbido e multicolore */
+            --primary-rainbow: linear-gradient(90deg, #4285f4, #9b72cb, #d96570, #f4b400, #4285f4);
             --text-main: #f0f0f0;
             --text-muted: #808080;
             --border-glass: rgba(255, 255, 255, 0.08);
@@ -19,16 +18,6 @@
             --transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
         }
 
-        [data-theme="light"] {
-            --bg-dark: #f5f7fa;
-            --bg-sidebar: rgba(255, 255, 255, 0.9);
-            --bg-glass: rgba(0, 0, 0, 0.03);
-            --text-main: #222222;
-            --text-muted: #666666;
-            --border-glass: rgba(0, 0, 0, 0.1);
-            --shadow-premium: 0 20px 40px rgba(0,0,0,0.1);
-        }
-
         * { margin: 0; padding: 0; box-sizing: border-box; }
 
         body {
@@ -38,10 +27,9 @@
             height: 100vh;
             display: flex;
             overflow: hidden;
-            transition: background var(--transition);
         }
 
-        /* --- HEADER & HAMBURGER --- */
+        /* --- HEADER --- */
         .header {
             position: fixed;
             top: 0; left: 0; right: 0;
@@ -57,7 +45,6 @@
             display: flex; flex-direction: column;
             justify-content: center; align-items: center;
             cursor: pointer;
-            z-index: 1100;
             background: var(--bg-glass);
             border-radius: 12px;
             border: 1px solid var(--border-glass);
@@ -65,19 +52,15 @@
             backdrop-filter: blur(5px);
         }
 
-        .menu-btn:hover { background: rgba(255,255,255,0.08); }
-
         .menu-btn-line {
             width: 22px; height: 2px;
             background-color: var(--text-main);
             margin: 3px 0;
             transition: var(--transition);
-            transform-origin: center;
-            border-radius: 1px;
         }
 
         .menu-btn.active .menu-btn-line:nth-child(1) { transform: translateY(8px) rotate(45deg); }
-        .menu-btn.active .menu-btn-line:nth-child(2) { opacity: 0; transform: scaleX(0); }
+        .menu-btn.active .menu-btn-line:nth-child(2) { opacity: 0; }
         .menu-btn.active .menu-btn-line:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
 
         /* --- SIDEBAR --- */
@@ -95,7 +78,6 @@
             flex-direction: column;
             padding: 80px 20px 20px;
             border-right: 1px solid var(--border-glass);
-            box-shadow: 20px 0 50px rgba(0,0,0,0.5);
         }
 
         .sidebar.open { transform: translateX(300px); }
@@ -126,15 +108,16 @@
         .avatar {
             width: 38px; height: 38px;
             border-radius: 50%;
-            background: var(--text-main);
-            color: var(--bg-dark);
+            background: #222;
+            color: #fff;
             font-family: 'Georgia', serif;
             font-size: 20px;
             font-weight: bold;
             display: flex; align-items: center; justify-content: center;
+            border: 1px solid rgba(255,255,255,0.1);
         }
 
-        /* --- LOGO CENTRALE --- */
+        /* --- LOGO CENTRALE ANIMATO --- */
         .main-content {
             flex: 1;
             display: flex;
@@ -154,41 +137,45 @@
             position: absolute;
             top: 50%; left: 50%;
             transform: translate(-50%, -50%);
-            width: 220px; height: 220px;
+            width: 200px; height: 200px;
             background: var(--primary-rainbow);
-            background-size: 300%;
-            filter: blur(60px);
-            opacity: 0.3;
+            background-size: 300% 300%;
+            filter: blur(70px);
+            opacity: 0.25;
             border-radius: 50%;
-            /* Questa è l'animazione che fa cambiare i colori */
-            animation: rainbow-pulse 4s infinite linear;
+            animation: flowColors 8s infinite linear; /* Calma */
         }
 
         .logo-text {
             font-family: "Arial Black", "Arial Bold", Arial, sans-serif;
             font-weight: 900;
-            font-size: 5rem; /* RIDOTTO da 6rem a 5rem */
+            font-size: 5rem;
             letter-spacing: -3px;
-            color: #ffffff;
+            /* Effetto gradiente nel testo */
+            background: var(--primary-rainbow);
+            background-size: 300% 300%;
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
             position: relative;
-            text-shadow: 0 10px 20px rgba(0,0,0,0.4);
+            animation: flowColors 8s infinite linear; /* Calma */
         }
         
         .sub-text {
             color: var(--text-muted);
             font-size: 13px;
             letter-spacing: 5px;
-            margin-top: 10px;
+            margin-top: 5px;
             font-weight: 700;
             text-transform: uppercase;
         }
 
-        @keyframes rainbow-pulse {
+        @keyframes flowColors {
             0% { background-position: 0% 50%; }
-            100% { background-position: 300% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
         }
 
-        /* --- BARRA INPUT ORIGINALE --- */
+        /* --- INPUT AREA --- */
         .input-container {
             position: fixed;
             bottom: 35px;
@@ -206,7 +193,6 @@
             align-items: center;
             backdrop-filter: blur(20px);
             box-shadow: var(--shadow-premium);
-            transition: var(--transition);
         }
 
         textarea {
@@ -220,7 +206,6 @@
             resize: none;
             max-height: 150px;
             font-family: Arial, sans-serif;
-            font-weight: 600;
         }
 
         .send-btn {
@@ -234,23 +219,8 @@
             transition: var(--transition);
         }
 
-        /* MODALE SETTINGS */
-        .modal-overlay {
-            position: fixed; inset: 0;
-            background: rgba(0,0,0,0.85);
-            backdrop-filter: blur(15px);
-            display: flex; align-items: center; justify-content: center;
-            opacity: 0; visibility: hidden; z-index: 2000;
-            transition: var(--transition);
-        }
-        .modal-overlay.active { opacity: 1; visibility: visible; }
-        .modal {
-            background: var(--bg-sidebar);
-            width: 90%; max-width: 420px;
-            padding: 35px; border-radius: 30px;
-            border: 1px solid var(--border-glass);
-            text-align: center;
-        }
+        .send-btn:hover { transform: scale(1.05); background: #ffffff; }
+
     </style>
 </head>
 <body>
@@ -264,18 +234,18 @@
     </div>
 
     <aside class="sidebar" id="sidebar">
-        <div class="history-title">Cronologia Chat</div>
+        <div class="history-title">Cronologia</div>
         <div class="chat-list">
-            <div style="padding: 15px 0; text-align: center; opacity: 0.5; font-style: italic;">Nessuna conversazione recente</div>
+            <div style="padding: 15px 0; text-align: center; opacity: 0.4; font-style: italic;">Nessuna attività recente</div>
         </div>
 
         <div class="profile-section" id="profileBtn">
             <div class="avatar">M</div>
             <div style="flex: 1;">
-                <div style="font-size: 15px; font-weight: 600;">Utente Locale</div>
-                <div style="font-size: 12px; color: var(--text-muted);">Impostazioni DAC</div>
+                <div style="font-size: 14px; font-weight: 600;">Utente Locale</div>
+                <div style="font-size: 11px; color: var(--text-muted);">Settings</div>
             </div>
-            <span style="font-size: 18px; opacity: 0.7;">⚙️</span>
+            <span style="font-size: 16px; opacity: 0.6;">⚙️</span>
         </div>
     </aside>
 
@@ -296,23 +266,9 @@
         </div>
     </main>
 
-    <div class="modal-overlay" id="modal">
-        <div class="modal">
-            <h2 style="margin-bottom: 15px;">Impostazioni</h2>
-            <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 20px;">
-                <span>Tema Scuro</span>
-                <input type="checkbox" checked id="themeToggle" style="width: 40px; height: 20px;">
-            </div>
-            <button id="closeModal" style="margin-top: 30px; background: white; color: black; border: none; padding: 12px; border-radius: 12px; cursor: pointer; font-weight: bold; width: 100%;">Chiudi</button>
-        </div>
-    </div>
-
     <script>
         const hamburger = document.getElementById('hamburger');
         const sidebar = document.getElementById('sidebar');
-        const profileBtn = document.getElementById('profileBtn');
-        const modal = document.getElementById('modal');
-        const closeModal = document.getElementById('closeModal');
         const chatInput = document.getElementById('chatInput');
 
         hamburger.addEventListener('click', () => {
@@ -325,9 +281,6 @@
             hamburger.classList.remove('active');
         });
 
-        profileBtn.addEventListener('click', () => modal.classList.add('active'));
-        closeModal.addEventListener('click', () => modal.classList.remove('active'));
-
         chatInput.addEventListener('input', function() {
             this.style.height = 'auto';
             this.style.height = (this.scrollHeight) + 'px';