diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index 4dd85cbf6e..2d12292c45 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -2168,6 +2168,56 @@ body:not(.spectator-view) {
         line-height: 20px;
         white-space: normal;
     }
+
+    &.compose_select_recipient-dropdown-list-container {
+        .dropdown-list .dropdown-list-item-common-styles {
+            /* We align items to center for the sake of the
+               compose_select_recipient dropdown, which has
+               icons not present in other dropdowns. */
+            align-items: center;
+        }
+    }
+
+    .dropdown-list .dropdown-list-item-common-styles {
+        position: relative;
+        display: flex;
+        color: var(--color-dropdown-item);
+        padding: 3px 10px 3px 8px;
+        font-weight: 400;
+        line-height: var(--base-line-height-unitless);
+        white-space: normal;
+
+        .stream-privacy-type-icon {
+            font-size: 0.93em;
+            /* We set only the width so that flexbox
+            can do its work to properly center,
+            regardless of the height. */
+            width: 0.93em;
+            padding-right: 5px;
+            /* Override the [data-tippy-root]
+            style in `tooltips.css`. */
+            top: 0;
+        }
+
+        .dropdown-list-delete {
+            position: absolute;
+            top: 0;
+            right: 5px;
+            visibility: hidden;
+        }
+
+        &:focus,
+        &:hover {
+            color: var(--color-dropdown-item);
+            text-decoration: none;
+            background-color: var(--background-color-active-dropdown-item);
+            outline: none;
+
+            .dropdown-list-delete {
+                visibility: visible;
+            }
+        }
+    }
 }
 
 .dropdown-list-container .list-item {
@@ -2196,48 +2246,6 @@ body:not(.spectator-view) {
     }
 }
 
-.dropdown-list-container .dropdown-list .dropdown-list-item-common-styles {
-    position: relative;
-    display: flex;
-    align-items: center;
-    color: var(--color-dropdown-item);
-    padding: 3px 10px 3px 8px;
-    font-weight: 400;
-    line-height: var(--base-line-height-unitless);
-    white-space: normal;
-
-    .stream-privacy-type-icon {
-        font-size: 0.93em;
-        /* We set only the width so that flexbox
-           can do its work to properly center,
-           regardless of the height. */
-        width: 0.93em;
-        padding-right: 5px;
-        /* Override the [data-tippy-root]
-           style in `tooltips.css`. */
-        top: 0;
-    }
-
-    .dropdown-list-delete {
-        position: absolute;
-        top: 0;
-        right: 5px;
-        visibility: hidden;
-    }
-
-    &:focus,
-    &:hover {
-        color: var(--color-dropdown-item);
-        text-decoration: none;
-        background-color: var(--background-color-active-dropdown-item);
-        outline: none;
-
-        .dropdown-list-delete {
-            visibility: visible;
-        }
-    }
-}
-
 .dropdown-list-item-common-styles .dropdown-list-bold-selected {
     font-weight: 700;
 }