Update styles.css

styles.css

@@ -1,15 +1,24 @@
-/* Customize the title */
-.gr-host {
+/* Body style */
+body {
     font-family: Arial, sans-serif;
-    background-color: #f0f0f0;
+    margin: 0;
+    padding: 0;
+    background-color: #f9f9f9;
+}
+
+/* Container style */
+.container {
+    padding: 20px;
 }
 
-.gr-host h1 {
-    font-size: 36px;
-    color: #333333;
+/* Title style */
+.title {
+    font-size: 24px;
+    margin-bottom: 20px;
+    color: #333;
 }
 
-/* Style the input textbox */
+/* Input textbox style */
 .gr-textbox textarea {
     width: 100%;
     padding: 10px;
@@ -18,21 +27,21 @@
     border-radius: 5px;
 }
 
-/* Style the output textbox */
-.gr-textbox.gr-output {
+/* Output textbox style */
+.gr-textbox.gr-output textarea {
     width: 100%;
     padding: 10px;
     font-size: 16px;
     border: 1px solid #ccc;
     border-radius: 5px;
-    background-color: #f9f9f9;
+    background-color: #fff;
     margin-top: 10px;
 }
 
-/* Style the copy button */
+/* Copy button style */
 .gr-copy-btn {
     background-color: #007bff;
-    color: #ffffff;
+    color: #fff;
     border: none;
     border-radius: 5px;
     padding: 8px 16px;
@@ -42,4 +51,4 @@
 
 .gr-copy-btn:hover {
     background-color: #0056b3;
-}
+}