fix(cdk/overlay): resolve regression when overlay is imported through shorthand path (#22043) (#22086)

Fixes a regression caused by #21896 where importing the overlay styles through
`~@angular/cdk/overlay` would result in a compilation error.

Co-authored-by: Kristiyan Kostadinov <[email protected]>

Author: wagnermaciel

src/cdk/a11y/_a11y.scss

@@ -60,6 +60,8 @@
     $selector-context: #{&};
 
     @if ($encapsulation != 'on') {
+      // Note that if this selector is updated, the same change has to be made inside
+      // `_overlay.scss` which can't depend on this mixin due to some infrastructure limitations.
       .cdk-high-contrast-#{$target} {
         @include _cdk-optionally-nest-content($selector-context) {
           @content;

src/cdk/overlay/_overlay.scss

@@ -1,5 +1,3 @@
-@import '../a11y/a11y';
-
 // We want overlays to always appear over user content, so set a baseline
 // very high z-index for the overlay container, which is where we create the new
 // stacking context for all overlays.
@@ -82,11 +80,12 @@ $backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
     &.cdk-overlay-backdrop-showing {
       opacity: 1;
 
-      // In high contrast mode the rgba background will become solid so we need to fall back
-      // to making it opaque using `opacity`. Note that we can't use the `cdk-high-contrast`
-      // mixin, because we can't normalize the import path to the _a11y.scss both for the
-      // source and when this file is distributed. See #10908.
-      @include cdk-high-contrast(active, off) {
+      // Note that we can't import and use the `high-contrast` mixin from `_a11y.scss`, because
+      // this file will be copied to the top-level `cdk` package when putting together the files
+      // for npm. Any relative import paths we use here will become invalid once the file is copied.
+      .cdk-high-contrast-active & {
+        // In high contrast mode the rgba background will become solid
+        // so we need to fall back to making it opaque using `opacity`.
         opacity: 0.6;
       }
     }