diff --git a/projects/common/directives/input-background-color.directive.ts b/projects/common/directives/input-background-color.directive.ts
index 54ff8c29db84a7e69c697f8d45e5254fce43a8c2..bbde71183f07316eecd583cb885753a7bf48e897 100644
--- a/projects/common/directives/input-background-color.directive.ts
+++ b/projects/common/directives/input-background-color.directive.ts
@@ -2,9 +2,7 @@ import {
   Directive, ElementRef, Input, OnChanges, SimpleChanges
 } from '@angular/core';
 
-@Directive({
-  selector: '[aspectInputBackgroundColor]'
-})
+@Directive({ selector: '[aspectInputBackgroundColor]'})
 export class InputBackgroundColorDirective implements OnChanges {
   @Input() backgroundColor!: string;
   @Input() appearance!: string;
@@ -23,9 +21,9 @@ export class InputBackgroundColorDirective implements OnChanges {
   private setBackgroundColor(): void {
     let targetElements: HTMLElement[];
     if (this.appearance === 'outline') {
-      targetElements = this.elementRef.nativeElement.querySelector('div.mat-form-field-outline')?.children;
+      targetElements = this.elementRef.nativeElement.querySelector('div.mdc-notched-outline')?.children;
     } else {
-      targetElements = [this.elementRef.nativeElement.querySelector('div.mat-form-field-flex')];
+      targetElements = [this.elementRef.nativeElement.querySelector('div.mat-mdc-form-field-flex')];
     }
     // This fails, when component is not set up yet, therefore the extra check
     if (targetElements) {