Angular Material mat-form-field-appearance-outline style override in dialog doesn't work well

I got a problem with Angular Material and customizing the formfield styles.

I have got override the styles of the form-field-appearance-outline in the custom-theme.scss to add more border-radius in 4 corners and work ok everywhere except in dialogs in which only work in the right side (-end).

This is an example in the app

And this is in a Dialog

As you can see only happen in the dialogs.

this is what I have in the custom-theme.scss

////////////////////////// FORM FIELDS //////////////////////////

  .mat-form-field-appearance-outline {
    .mat-form-field-infix {
      padding: 0.4rem 0 0.7rem 0;
      span {
        top: -1.2em;
      }
    }
    .mat-form-field-outline {
      background-color: rgba(187, 187, 187, 0.2) !important;
      border-radius: 15px !important;
      border: none !important;
      .mat-form-field-outline-start {
        border-radius: 15px 0 0 15px !important;
      }
      .mat-form-field-outline-end {
        border-radius: 0 15px 15px 0 !important;
      }
    }
  }

Looking for a class a miss in the elements tab in devtools i that the element appears to be good overridden:

LEFT SIDE

RIGHT SIDE

Already try with ViewEncapsulation and styles in components but nothing.

any ideas how I can fix this?