diff --git a/src/lib/core/option/_option-theme.scss b/src/lib/core/option/_option-theme.scss
index 0c423048b005..38c37772f255 100644
--- a/src/lib/core/option/_option-theme.scss
+++ b/src/lib/core/option/_option-theme.scss
@@ -17,18 +17,6 @@
       background: mat-color($background, hover);
     }
 
-    .mat-primary &.mat-selected:not(.mat-option-disabled) {
-      color: mat-color($primary);
-    }
-
-    .mat-accent &.mat-selected:not(.mat-option-disabled) {
-      color: mat-color($accent);
-    }
-
-    .mat-warn &.mat-selected:not(.mat-option-disabled) {
-      color: mat-color($warn);
-    }
-
     // In multiple mode there is a checkbox to show that the option is selected.
     &.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {
       background: mat-color($background, hover);
@@ -43,6 +31,18 @@
       color: mat-color($foreground, hint-text);
     }
   }
+
+  .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
+    color: mat-color($primary);
+  }
+
+  .mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {
+    color: mat-color($accent);
+  }
+
+  .mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {
+    color: mat-color($warn);
+  }
 }
 
 @mixin mat-option-typography($config) {