styles.css

@import url("https://fonts.googleapis.com/css2?family=Hind+Madurai:wght@300;400;500;600;700&display=swap");

#CHATBOT {
  background: rgba(255, 255, 255, 0.7);
  border-radius: 16px;
  box-shadow: 0 4px 30px #d6dade;
  backdrop-filter: blur(4.5px);
  -webkit-backdrop-filter: blur(4.5px);
  border: 1px solid rgba(255, 255, 255, 0.28);
}

.message.bot {
  background: rgba(255, 255, 255, 0.6) !important;
  font-family: "Hind Madurai", sans-serif;
}

.message.bot * {
  color: #000000;
}

.message.user {
  background: rgba(0, 0, 0, 0.35) !important;
  font-family: "Hind Madurai", sans-serif;
}

.message.user * {
  color: #ffffff !important;
}

.avatar-container img {
  padding: 0 !important;
}

input,
textarea {
  border: 2px solid #000000 !important; /* Change border color to black */
  border-radius: 50px; /* Optional: Add rounded corners */
  background-color: #e8e9ea !important; /* Optional: Match background color */
  color: #000000 !important; /* Set text color for light mode */
}

body.dark-mode input,
body.dark-mode textarea {
  background-color: #2c2c2c !important; /* Match dark mode input background */
  color: #cccccc !important; /* Set text color for dark mode */
  border: 2px solid #cccccc !important; /* Optional: Change border color for dark mode */
}