diff --git a/frontend/src/css/ExplorePage.css b/frontend/src/css/ExplorePage.css
index e25ef7c..f00c855 100644
--- a/frontend/src/css/ExplorePage.css
+++ b/frontend/src/css/ExplorePage.css
@@ -190,6 +190,7 @@ html[data-theme="dark"] .pill.active { background: var(--accent); color: var(--b
   display: grid;
   place-items: center;
   cursor: pointer;
+  will-change: opacity;
 }
 .carousel-btn:hover { box-shadow: var(--shadow-2); }
 .carousel-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
@@ -486,4 +487,11 @@ html[data-theme="dark"] .carousel-btn:focus-visible { outline: none; box-shadow:
     .liked-grid {
       padding-bottom: 5.5rem;
     }
+}
+
+@media (max-width: 768px) {
+  .carousel-btn {
+    width: 40px;
+    height: 40px;
+  }
 }
\ No newline at end of file
diff --git a/frontend/src/css/NewUserSignUpPage.css b/frontend/src/css/NewUserSignUpPage.css
index 95fca1e..116c347 100644
--- a/frontend/src/css/NewUserSignUpPage.css
+++ b/frontend/src/css/NewUserSignUpPage.css
@@ -104,7 +104,7 @@ body {
 }
 
 .error-message {
-  color: var(--error);
+  color: tomato;
   font-size: 13px;
   margin-top: 5px;
 }
diff --git a/frontend/src/css/Popup.css b/frontend/src/css/Popup.css
index e613fae..81e7833 100644
--- a/frontend/src/css/Popup.css
+++ b/frontend/src/css/Popup.css
@@ -111,6 +111,7 @@ html[data-theme="dark"] .popup-input :is(input, textarea, select):focus {
     display: flex;
     align-items: center;
     gap: 0.25rem;
+    font-size: 1em !important;
 }
 
 .overlap-items {
@@ -120,7 +121,8 @@ html[data-theme="dark"] .popup-input :is(input, textarea, select):focus {
 .popup-input input {
     padding: 10px 12px;
     border: 1px solid var(--border-light);
-    border-radius: 10px;
+    border-radius: var(--radius);
+    background: var(--bg-white);
     font-size: 14px;
 }
 
@@ -210,8 +212,8 @@ html[data-theme="dark"] .popup-input :is(input, textarea, select):focus {
 .popup-input .react-datepicker__input-container input {
     width: 100%;
     padding: 12px;
-    border: 1px solid var(--border-input);
-    border-radius: 8px;
+    border: 1px solid var(--border-light);
+    border-radius: var(--radius) !important;
     font-size: 14px;
     background: var(--bg-white) !important;
     color: var(--text);
@@ -260,14 +262,14 @@ form.was-submitted .react-datepicker-wrapper:has(input[value=""]) .mobile-date-i
     box-shadow: 0 0 0 3px var(--accent-soft);
 }
 
-html[data-theme="dark"] .popup-input-field,
+/* html[data-theme="dark"] .popup-input-field,
 html[data-theme="dark"] .popup-input .date-input,
 html[data-theme="dark"] .popup-input .mobile-date-input,
 html[data-theme="dark"] .popup-input .react-datepicker__input-container input {
     background: var(--bg-hover2) !important;
     color: var(--static-white);
     border-color: var(--border-input);
-}
+} */
 
 html[data-theme="dark"] .popup-input .mobile-date-input.placeholder,
 html[data-theme="dark"] .popup-input-field::placeholder,
diff --git a/frontend/src/css/TripDaysPage.css b/frontend/src/css/TripDaysPage.css
index 97f0c8d..204933b 100644
--- a/frontend/src/css/TripDaysPage.css
+++ b/frontend/src/css/TripDaysPage.css
@@ -788,18 +788,14 @@ html[data-theme="dark"] .day-menu .trash-icon {
 
 .textarea-notes {
     padding: 12px;
-    border: 1px solid var(--border-input);
-    border-radius: var(--radius);
+    border: 1px solid var(--border-light);
+    border-radius: var(--radius) !important;
     font-size: 14px;
-    background: var(--bg-input);
+    background: var(--bg-white);
     color: var(--text);
     width: 100%;
 }
 
-html[data-theme="dark"] .textarea-notes {
-  background: var(--bg-hover2);
-}
-
 .textarea-notes::placeholder {
   color: var(--text-placeholder);
 }
@@ -1494,10 +1490,6 @@ html[data-theme="dark"] .time-picker {
     opacity: 0.5;
   }
 
-  .participants-list {
-    min-height: 100px;
-  }
-
   .participants-list p{
     padding-top: 25px;
   }
@@ -2001,10 +1993,10 @@ html[data-theme="dark"] .time-picker {
 
 .trip-name-input, .trip-location-input, .date-input, .clone-popup-input, .popup-input .mobile-date-input {
   padding: 12px;
-  border: 1px solid var(--border-input);
+  border: 1px solid var(--border-light);
   border-radius: var(--radius);
   font-size: 14px;
-  background: var(--bg-input) !important;
+  background: var(--bg-white) !important;
   color: var(--text);
   width: 100%;
 }
@@ -2078,3 +2070,9 @@ body:has(.popup-screen-overlay) {
   overflow: hidden;
   touch-action: none;
 }
+
+.trip-name-textview , .trip-location-textview , .trip-start-date-textview, .trip-notes-textview{
+  font-size: 14px;
+  margin-bottom: 6px;
+  color: var(--muted)
+}
diff --git a/frontend/src/css/TripPage.css b/frontend/src/css/TripPage.css
index a0a85e4..2d0171f 100644
--- a/frontend/src/css/TripPage.css
+++ b/frontend/src/css/TripPage.css
@@ -204,10 +204,10 @@
 
 .trip-page .modal-content .textarea-notes {
     padding: 12px;
-    border: 1px solid var(--border-input);
+    border: 1px solid var(--border-light);
     border-radius: var(--radius);
     font-size: 14px;
-    background: var(--bg-input);
+    background: var(--bg-white);
     color: var(--text);
     width: 100%;
 }
@@ -317,10 +317,10 @@
 
 .modal-content input {
     padding: 12px;
-    border: 1px solid var(--border-input);
+    border: 1px solid var(--border-light);
     border-radius: var(--radius);
     font-size: 14px;
-    background: var(--bg-input);
+    background: var(--bg-white);
     color: var(--text);
     width: 100%;
 }
@@ -346,11 +346,11 @@
     box-shadow: 0 0 0 3px var(--accent-soft);
 }
 
-html[data-theme="dark"] .modal-content input {
+/* html[data-theme="dark"] .modal-content input {
     background: var(--bg-hover2);
     color: var(--static-white);
     border-color: var(--border-input);
-}
+} */
 
 html[data-theme="dark"] .modal-content input::placeholder {
     color: var(--text-placeholder);
@@ -502,9 +502,9 @@ html[data-theme="dark"] .trip-page :is(
   .react-datepicker__input-container input,
   .date-input
 ) {
-    background: var(--bg-hover2) !important;
+    background: var(--bg-white) !important;
     color: var(--static-white) !important;
-    border: 1px solid var(--border-input) !important;
+    border: 1px solid var(--border-light) !important;
     box-shadow: none !important;
 }
 
@@ -612,10 +612,10 @@ select:focus {
 .mobile-date-input {
     width: 100%;
     padding: 12px;
-    border: 1px solid var(--border-input);
-    border-radius: 4px;
+    border: 1px solid var(--border-light);
+    border-radius: var(--radius);
     font-size: 14px;
-    background: var(--bg-input);
+    background: var(--bg-white) !important;
     cursor: pointer;
     color: var(--text);
     user-select: none;