ok

src/components/MusicPlayer.css

@@ -130,7 +130,7 @@
 }
 
 .expandable-container > div:first-child {
-  padding-top: 21px;
+  padding-top: 20px;
   
   -webkit-touch-callout: none; /* iOS Safari */
     -webkit-user-select: none; /* Safari */
@@ -238,7 +238,7 @@
   padding: 10px;
 }
 
-.auth-box input[type="text"] {
+.auth-box div {
   flex-grow: 1;
   border: none;
   border-radius: 25px;
@@ -250,30 +250,26 @@
   /* Remove default outline */
 }
 
-.auth-box input[type="text"]::placeholder {
-  color: white; /* Placeholder text color */
-  font-weight: bold;
-  opacity: 0.7; /* Optional: Adjust visibility */
-  text-align: center;
+.config-box {
+  display: flex;
+  align-items: center;
+  padding: 10px;
 }
-
-.auth-box .auth-icon {
-  margin-right: 5px;
-  color: #888;
-  font-size: 20px;
-  /* Adjust icon size */
-  cursor: pointer;
-  /* Change cursor to pointer on hover */
-  width: 24px;
-  /* Set width for icon */
-  height: 24px;
-  /* Set height for icon */
-  fill: #888;
-  /* Adjust fill color */
+.config-box > div:first-child {
+  flex-grow: 1;
+  border: none;
+  border-radius: 25px; /* Round the corners */
+  padding: 4px 15px;
+  font-size: 16px;
+  outline: none;
+  background-color: #019863; /* Set background color */
+  display: flex;
+  align-items: center;
+  margin-top: -11px;
 }
 .rectangle {
   position: relative;
-  height: 200px;
+  min-height: 200px;
   overflow: hidden;
   border: 3px dashed #fbebcd;
   border-radius: 11px 11px 0 0;
@@ -291,7 +287,7 @@
   text-align: center;
   font-family: Arial, sans-serif; /* Optional font */
   color: #333; /* Optional text color */
-  margin-bottom: 0.5rem; /* Add spacing between text and button */
+  margin: 25px;
 }
 
 .bold-text {