fix(console): minor UI issues (#8192)

# Which Problems Are Solved

- The console has some dialog UI issues reported in #7404 
- There's some horizontal scrolling in dialogs due to field errors width
overflow. In dialogs like Twilio or add flow the x-scroll show always.

![action_trigger_scroll](https://github.com/zitadel/zitadel/assets/30386061/6b574dd7-e309-4a21-a34a-6a1a98ef57ab)

![twilio_scroll](https://github.com/zitadel/zitadel/assets/30386061/48bf5af8-a8cd-4594-acf6-ef61b678443a)

- New Factor MFA title has no styles applied
![Captura desde 2024-06-25
08-37-40](https://github.com/zitadel/zitadel/assets/30386061/931419b4-7f37-4cd1-9b37-9b7fa9ff8453)

# How the Problems Are Solved

- A new style for field wrappers inside mat-dialog-component to
form-field scss that sets width to auto.
- This PR fix a missing MFA mat-dialog-title to apply styles to New
Factor title
- Issues with secret generators had been already fixed in #8141
- Issues with padding for Twilio and Actions were fixed by @peintnermax

# Additional Changes


# Additional Context

- Closes #7404

---------

Co-authored-by: Max Peintner <[email protected]>

console/src/app/modules/form-field/field/form-field.component.scss

@@ -53,6 +53,10 @@
     overflow: hidden; // prevents multi-line errors from overlapping the control
   }
 
+  mat-dialog-container .cnsl-form-field-subscript-wrapper {
+    width: auto;
+  }
+
   .cnsl-form-field-hint-wrapper,
   .cnsl-form-field-error-wrapper {
     display: flex;

console/src/app/modules/policies/login-policy/factor-table/dialog-add-type/dialog-add-type.component.html

@@ -1,4 +1,4 @@
-<h1 class="title">
+<h1 mat-dialog-title class="title">
   <span>{{ data.title | translate }}</span>
 </h1>
 <div mat-dialog-content>