Update style.css

style.css

@@ -49,23 +49,28 @@ label {
   font-weight: bold;
 }
 
-input, select {
-  appearance: none; /* Hilangkan default dropdown */
-  -moz-appearance: none; /* Firefox */
-  -webkit-appearance: none; /* Safari */
+input, /* General Select Styling */
+select {
+  appearance: none; /* Hilangkan gaya default */
+  -moz-appearance: none;
+  -webkit-appearance: none;
   background-color: #001d57; /* Latar belakang biru gelap */
   color: #fff; /* Teks putih */
+  border: 1px solid #87cefa;
+  border-radius: 8px;
   padding: 12px;
   font-size: 16px;
-  border: 1px solid #ddd;
-  border-radius: 8px;
-  width: 100%;
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  font-weight: bold;
+  cursor: pointer;
   transition: border-color 0.3s ease, box-shadow 0.3s ease;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 12px center;
+  background-size: 16px;
 }
 
 select:hover {
-  border-color: #87cefa;
+  border-color: #5faad7;
 }
 
 select:focus {
@@ -74,20 +79,12 @@ select:focus {
   outline: none;
 }
 
-/* Tambahkan ikon dropdown */
-select {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-position: right 10px center;
-  background-size: 16px;
+/* Dropdown Options Styling */
+option {
+  background-color: #001d57; /* Warna latar dropdown */
+  color: #fff; /* Warna teks dropdown */
 }
 
-}
-
-input:focus, select:focus {
-  border-color: #87cefa;
-  outline: none;
-}
 
 /* Swap Button */
 .swap-group {