fix: change the chat colo

src/components/ChatGPT.vue

@@ -12,7 +12,7 @@
       </div>
       <div class="flex flex-col gap-4 w-full items-center">
          <div class="relative w-full max-w-lg">
-          <input v-model="userInput" placeholder="Ask me anything about engineering..." class="text-normal p-4 border border-gray-400 rounded-full w-full focus:outline-none focus:border-blue-500" @keydown.enter="sendMessage" />
+          <input v-model="userInput" placeholder="Ask me anything about engineering..." class="text-normal bg-gray-900 text-slate-50 p-4 border border-gray-400 rounded-full w-full focus:outline-none focus:border-blue-500" @keydown.enter="sendMessage" />
           <button @click="sendMessage" class="absolute right-2 top-1/2 transform -translate-y-1/2 w-10 h-10 bg-gray-400 rounded-full flex items-center justify-center text-gray-800">
             <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 463.96 512"><path fill-rule="nonzero" d="M332.67 512V268.5h92.3c15.48-.68 26.47-5.77 32.82-15.42 17.21-25.8-5.25-52.31-22.6-69.25L261.61 14.33c-17.29-19.11-41.93-19.11-59.22 0L24.42 188.72C8.03 204.78-9.67 229.27 6.21 253.08c6.35 9.65 17.34 14.74 32.81 15.42h92.31V512h201.34z"/></svg>
           </button>