SassError: Two forwarded modules both define a mixin named cdk-a11y

Question

When I run my angular 15 application I am getting an error named my-component.component.scss:17:100: ERROR: Unterminated string token but there is no character at that position also everytime I rerun the application component.scss name gets changed but with same error along with position .So looking into a stackoverflow suggestion I added the scss file in my styles array in angular.json After which I am getting a new error may be the actual error named SassError: Two forwarded modules both define a mixin named cdk-a11y.

@forward '../cdk/a11y/index.import';original @forward
 @forward '../cdk/overlay/index.import';new @forward



@angular\material\_theming.scss 6:1                                       @import
  src\app\Revamp\Components\login\my-component.component.scss 1:9  root stylesheet

These are the initial lines of my scss file

@import '@angular/material/theming';
.clickable {
    cursor: pointer;
    &:hover {
      @include mat-elevation(8);
    }
  }

This is my _theming.scss

@forward '../cdk/a11y/index.import';
@forward '../cdk/overlay/index.import';
@forward '../cdk/text-field/index.import';

And these are the code inside (../cdk/a11y/index.import)

@forward 'index' hide a11y, high-contrast;
@forward 'index' as cdk-* hide cdk-optionally-nest-content;

and (../cdk/overlay/index.import)

@forward '../a11y' as cdk-*;
@forward 'index' hide $dark-backdrop-background, $z-index-overlay, $z-index-overlay-backdrop,
  $z-index-overlay-container, overlay;
@forward 'index' as cdk-* hide $cdk-backdrop-animation-duration,
  $cdk-backdrop-animation-timing-function, $cdk-dark-backdrop-background;
@forward 'index' as cdk-overlay-* hide $cdk-overlay-backdrop-animation-duration,
  $cdk-overlay-backdrop-animation-timing-function, $cdk-overlay-z-index-overlay,
  $cdk-overlay-z-index-overlay-backdrop, $cdk-overlay-z-index-overlay-container,
  cdk-overlay-overlay;
@forward './index-deprecated' as cdk-*;
@forward './index-deprecated' as cdk-overlay-*;

(@import '../a11y');.

The versions which I am using are "@angular/cdk": "^15.2.9","@angular/material": "^15.2.9","@angular/core": "^15.2.0","tslib": "^2.3.0", "typescript": "~4.9.4"

What is the cause of the error and how to solve this ?