diff --git a/templates/cassiopeia/scss/_variables.scss b/templates/cassiopeia/scss/_variables.scss
index 3247c31ebcb4..59dd8af4d876 100644
--- a/templates/cassiopeia/scss/_variables.scss
+++ b/templates/cassiopeia/scss/_variables.scss
@@ -135,7 +135,7 @@ $treeselect-line-height:             2.2rem;
 $list-group-bg:                      $white-offset;
 
 // Custom form
-$custom-select-bg:                   $white-offset;
+$custom-select-bg:                   $gray-200;
 
 // Custom form
 $custom-select-indicator-padding:    3rem;
diff --git a/templates/cassiopeia/scss/blocks/_modals.scss b/templates/cassiopeia/scss/blocks/_modals.scss
index 7596901f6aca..17d092ed4f0a 100644
--- a/templates/cassiopeia/scss/blocks/_modals.scss
+++ b/templates/cassiopeia/scss/blocks/_modals.scss
@@ -51,3 +51,7 @@
 .container-popup .mb-3 {
   margin: 1rem;
 }
+
+.container-popup .custom-select {
+  width: auto;
+}
diff --git a/templates/cassiopeia/scss/vendor/bootstrap/_custom-forms.scss b/templates/cassiopeia/scss/vendor/bootstrap/_custom-forms.scss
index ede44d606408..db0c10ce839a 100644
--- a/templates/cassiopeia/scss/vendor/bootstrap/_custom-forms.scss
+++ b/templates/cassiopeia/scss/vendor/bootstrap/_custom-forms.scss
@@ -52,4 +52,10 @@
       }
     }
   }
+
+  optgroup,
+  option {
+    color: var(--dark);
+    background-color: $white;
+  }
 }