updates

static/style.css

@@ -145,6 +145,7 @@ body, html {
 	position: relative;
 	background-color: var(--card-bg) !important;
 	border-radius: 15px !important;
+	
 }
 
 /* Message Box */
@@ -240,10 +241,6 @@ input[type="text"] {
 	margin-top: auto;
 	margin-bottom: auto;
 }
-.card{
-	min-height: 100%;
-    max-height: 90vh;
-}
 .contacts_body{
 	padding:  0.75rem 0 !important;
 	overflow-y: auto;
@@ -378,13 +375,28 @@ border-radius: 0 0 15px 15px !important;
 	font-size: 20px;
 	cursor: pointer;
 	margin-right: 20px;
-}.msg_cotainer {
+}.msg_container {
 	background-color: var(--msg-bg);
 	padding: 10px;
 	border-radius: 25px;
 }
 
-.msg_cotainer_send {
+
+.dark-mode .predictive-text {
+    background-color: rgba(0, 0, 0, 0.8) !important; /* Ensure dark background */
+    color: white !important;
+    border: 1px solid var(--border-color) !important;
+}
+
+.dark-mode .predictive-text p {
+    background-color: transparent !important;
+    color: white !important;
+}
+
+.dark-mode .predictive-text p:hover {
+    background-color: rgba(255, 255, 255, 0.2) !important;
+}
+.msg_container_send {
 	background-color: var(--msg-send-bg);
 	padding: 10px;
 	border-radius: 25px;
@@ -443,7 +455,6 @@ border-radius: 0 0 15px 15px !important;
         max-height: 60vh;
     }
 }
-	
 
 	.predefined-text a {
 		color: #0a66c2; /* LinkedIn blue */
@@ -459,5 +470,4 @@ border-radius: 0 0 15px 15px !important;
 	.predefined-text a:hover {
 		text-decoration: underline;
 	}
-	
-}
+