From 4ce677dccc9212b61dedfeebe272fcddcf42843c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Iv=C3=A1n=20Risue=C3=B1o?=
 <ivan.risueno_martin.ext@boehringer-ingelheim.com>
Date: Wed, 6 May 2026 13:45:33 +0200
Subject: [PATCH 1/2] Change simple dialog styling to match the other dialog

---
 ...uest-deletion-simple-dialog.component.scss | 295 +++++++++++++-----
 1 file changed, 211 insertions(+), 84 deletions(-)

diff --git a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
index 04065b5..3eea8dc 100644
--- a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
+++ b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
@@ -1,99 +1,226 @@
 app-request-deletion-dialog {
-  width: 38.25rem;
-  display: block !important;
-  padding: 1.5rem;
-  box-sizing: border-box;
-
-  > * {
-    padding: 0 !important;
-    color: var(--appshell-color-dark-green-main) !important;
-  }
-
-  .dialog-header {
-    margin: 0.5rem 0 0 !important;
-    display: inline-flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-
-    h2 {
-      margin: 0 !important;
-      padding: 0;
-      font-family: "AppShellHeadingFont";
-      font-size: 20px;
-      font-weight: 500;
-      line-height: 24px;
-
-      &::before,
-      &::after {
-        height: auto !important;
-      }
+    width: 38.25rem;
+    display: block!important;
+    padding: 1.5rem;
+    box-sizing: border-box;
+
+    &>* {
+        padding: 0!important;
+        color: var(--appshell-color-dark-green-main)!important;
     }
 
-    appshell-icon {
-      cursor: pointer;
-    }
-  }
-
-  mat-dialog-content {
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
-    min-height: 100px;
-
-    .help-message-ctn {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      gap: 0.75rem;
-      margin: 1.5rem 0 !important;
-      padding: 1rem;
-
-      background-color: #d2f2f7;
-      color: #076d7e;
-
-      font-size: 14px;
-      font-weight: 400;
-      line-height: 20px;
-    }
-  }
-
-    mat-dialog-actions {
-    gap: 1rem;
-
-    button:first-of-type {
-        padding: 0.75rem 1rem;
-
-        font-size: 0.875rem;
-        line-height: 1.25rem;
-
-        --mdc-text-button-container-height: unset !important;
-        --mdc-text-button-container-padding-horizontal: 0;
+    .dialog-header {
+        margin: 0.5rem 0 0!important;
+        display: inline-flex;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: center;
+        width: 100%;
+
+        h2 {
+            margin: 0!important;
+            padding: 0;
+            font-family: "AppShellHeadingFont";
+            font-size: 20px;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 24px; /* 120% */
+
+            &::before, &::after {
+                height: auto!important;
+            }
+        }
 
-        &:hover {
-        background-color: transparent;
+        appshell-icon {
+            cursor: pointer;
         }
     }
 
-    button:last-of-type {
-        padding: 0.75rem 1.5rem;
-        height: auto;
+    mat-dialog-content {
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+        min-height: 200px;
+
+        .help-message-ctn {
+            background-color: #D2F2F7;
+            color: #076D7E;
+            padding: 1rem;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            margin: 1.5rem 0!important;
+            gap: 0.75rem;
+            font-size: 14px;
+            font-style: normal;
+            font-weight: 400;
+            line-height: 20px;
+        }
+        
+        .deployment-status-group {
+            display: flex;
+            flex-direction: column;
+            margin-bottom: 1rem;
+            --mdc-radio-state-layer-size: 2rem;
+
+            mat-radio-button {
+                --mat-radio-label-text-color: var(--appshell-color-dark-green-main)!important;
+                --mat-radio-label-text-size: 14px;
+            }
+
+            &.ng-invalid.ng-touched mat-radio-button {
+                --mdc-radio-unselected-icon-color: #E10A0A!important;
+            }
+
+            mat-error {
+                line-height: var(--mat-form-field-subscript-text-line-height);
+                font-size: var(--mat-form-field-subscript-text-size);
+                letter-spacing: var(--mat-form-field-subscript-text-tracking);
+                font-weight: var(--mat-form-field-subscript-text-weight);
+            }
+        }
 
-        font-size: 0.875rem;
-        line-height: 1.25rem;
+        .change-request-section {
+            margin-top: 1rem;
+        }
+        
+        .full-width {
+            width: 100%;
+            margin-bottom: 1.5rem!important;
+            --mat-select-enabled-trigger-text-color: var(--appshell-color-secondary-main);
+            --mdc-outlined-text-field-focus-outline-color: var(--appshell-color-accent-green-main);
+            --mat-form-field-subscript-text-line-height: 1.5rem;
+            --mdc-outlined-text-field-container-shape: 0.125rem;
+            --mdc-outlined-text-field-disabled-input-text-color: var(--appshell-color-grey-strong);
+            --mdc-outlined-text-field-disabled-outline-color: #B7B6B2 !important;
+            --mat-form-field-error-text-color: #E10A0A;
+            --mdc-outlined-text-field-error-outline-color: #E10A0A;
+            --mdc-outlined-text-field-error-caret-color: #E10A0A;
+
+            .mat-mdc-form-field:not(.mat-form-field-invalid) {
+                --mdc-outlined-text-field-error-caret-color: initial;
+            }
+
+            .mat-mdc-form-field .mat-mdc-text-field-wrapper {
+                height: 3rem;
+
+                .mat-mdc-form-field-flex {
+                    height: 100%;
+                }
+
+                .mat-mdc-form-field-infix {
+                    height: 100%;
+                    min-height: unset;
+                    padding: 0.75rem 0;
+                }
+            }
+
+            .mdc-text-field--disabled {
+                background-color: var(--appshell-color-grey-medium);
+            }
+
+            .mat-mdc-form-field-subscript-wrapper {
+
+                .mat-mdc-form-field-hint-wrapper {
+                    padding: 0;
+                    padding-top: .5rem;
+
+                    mat-hint {
+                        opacity: 0.6;
+                    }
+                }
+                
+                .mat-mdc-form-field-error-wrapper {
+                    padding: 0;
+                }
+            }
+            
+            mat-error {
+                display: flex;
+                flex-direction: column;
+                gap: .25rem;
+
+                &::before {
+                    height: .25rem;
+                }
+
+                .error-message {
+                    display: flex;
+                    flex-direction: row;
+                    gap: .25rem;
+                }
+
+            }
+        }
 
-        --mdc-filled-button-container-height: unset !important;
+        textarea {
+            resize: none !important;
+            height: 3rem!important;
+        }
 
-        display: inline-flex;
-        align-items: center;
+        .field-label {
+            width: 100%;
+            display: inline-flex;
+            flex-direction: row;
+            justify-content: space-between;
+            font-size: 14px;
+            margin-bottom: 8px;
+            font-weight: 400;
+
+            span {
+                color: var(--appshell-color-grey-strong);
+                opacity: 0.6;
+            }
+        }
+    }
 
-        border: 2px solid var(--mdc-filled-button-container-color);
-        border-radius: 0.125rem;
+    mat-dialog-actions {
+        gap: 1rem;
+
+        button:first-of-type {
+            color: var(--appshell-color-secondary-main);
+            font-family: "AppShellTextFont";
+            padding: 0.75rem;
+            font-size: 0.875rem;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 1.25rem;
+            text-decoration-line: underline;
+            text-decoration-color: var(--appshell-color-accent-green-main);
+            text-decoration-thickness: 2px;
+            text-underline-offset: 6px;
+            
+            --mat-text-button-hover-state-layer-opacity: 0;
+            --mat-text-button-focus-state-layer-opacity: 0;
+            --mat-text-button-pressed-state-layer-opacity: 0;
+            --mat-text-button-ripple-color: transparent;
+
+            &:hover {
+                color: var(--appshell-color-secondary-medium);
+                background-color: transparent;
+                text-decoration-color: var(--appshell-color-accent-green-medium);
+            }
+        }
 
-        &:disabled {
-        border: none;
+        button:last-of-type {
+            --mdc-filled-button-container-height: unset!important;
+            display: inline-flex;
+            align-items: center;
+            padding: 0.75rem 1.5rem;
+            border-radius: 0.125rem;
+            font-size: 0.875rem;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 1.25rem;
+            height: auto;
+            color: var(--appshell-color-secondary-main)!important;
+            text-decoration: none;
+            font-family: AppShellTextFont;
+            border: 2px solid var(--mdc-filled-button-container-color);
+
+            &:disabled {
+                border: none;
+            }
         }
     }
-    }
 }
\ No newline at end of file

From 83e3b0a8bebda6765fc9d90ca739d216a14cf9c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Iv=C3=A1n=20Risue=C3=B1o?=
 <ivan.risueno_martin.ext@boehringer-ingelheim.com>
Date: Wed, 6 May 2026 14:00:36 +0200
Subject: [PATCH 2/2] Remove unused css styles for the simple dialog component

---
 ...uest-deletion-simple-dialog.component.scss | 120 +-----------------
 ...equest-deletion-simple-dialog.component.ts |   2 +-
 2 files changed, 3 insertions(+), 119 deletions(-)

diff --git a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
index 3eea8dc..cdded1f 100644
--- a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
+++ b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.scss
@@ -1,4 +1,4 @@
-app-request-deletion-dialog {
+app-request-deletion-simple-dialog {
     width: 38.25rem;
     display: block!important;
     padding: 1.5rem;
@@ -40,7 +40,7 @@ app-request-deletion-dialog {
         display: flex;
         flex-direction: column;
         gap: 16px;
-        min-height: 200px;
+        min-height: 100px;
 
         .help-message-ctn {
             background-color: #D2F2F7;
@@ -56,122 +56,6 @@ app-request-deletion-dialog {
             font-weight: 400;
             line-height: 20px;
         }
-        
-        .deployment-status-group {
-            display: flex;
-            flex-direction: column;
-            margin-bottom: 1rem;
-            --mdc-radio-state-layer-size: 2rem;
-
-            mat-radio-button {
-                --mat-radio-label-text-color: var(--appshell-color-dark-green-main)!important;
-                --mat-radio-label-text-size: 14px;
-            }
-
-            &.ng-invalid.ng-touched mat-radio-button {
-                --mdc-radio-unselected-icon-color: #E10A0A!important;
-            }
-
-            mat-error {
-                line-height: var(--mat-form-field-subscript-text-line-height);
-                font-size: var(--mat-form-field-subscript-text-size);
-                letter-spacing: var(--mat-form-field-subscript-text-tracking);
-                font-weight: var(--mat-form-field-subscript-text-weight);
-            }
-        }
-
-        .change-request-section {
-            margin-top: 1rem;
-        }
-        
-        .full-width {
-            width: 100%;
-            margin-bottom: 1.5rem!important;
-            --mat-select-enabled-trigger-text-color: var(--appshell-color-secondary-main);
-            --mdc-outlined-text-field-focus-outline-color: var(--appshell-color-accent-green-main);
-            --mat-form-field-subscript-text-line-height: 1.5rem;
-            --mdc-outlined-text-field-container-shape: 0.125rem;
-            --mdc-outlined-text-field-disabled-input-text-color: var(--appshell-color-grey-strong);
-            --mdc-outlined-text-field-disabled-outline-color: #B7B6B2 !important;
-            --mat-form-field-error-text-color: #E10A0A;
-            --mdc-outlined-text-field-error-outline-color: #E10A0A;
-            --mdc-outlined-text-field-error-caret-color: #E10A0A;
-
-            .mat-mdc-form-field:not(.mat-form-field-invalid) {
-                --mdc-outlined-text-field-error-caret-color: initial;
-            }
-
-            .mat-mdc-form-field .mat-mdc-text-field-wrapper {
-                height: 3rem;
-
-                .mat-mdc-form-field-flex {
-                    height: 100%;
-                }
-
-                .mat-mdc-form-field-infix {
-                    height: 100%;
-                    min-height: unset;
-                    padding: 0.75rem 0;
-                }
-            }
-
-            .mdc-text-field--disabled {
-                background-color: var(--appshell-color-grey-medium);
-            }
-
-            .mat-mdc-form-field-subscript-wrapper {
-
-                .mat-mdc-form-field-hint-wrapper {
-                    padding: 0;
-                    padding-top: .5rem;
-
-                    mat-hint {
-                        opacity: 0.6;
-                    }
-                }
-                
-                .mat-mdc-form-field-error-wrapper {
-                    padding: 0;
-                }
-            }
-            
-            mat-error {
-                display: flex;
-                flex-direction: column;
-                gap: .25rem;
-
-                &::before {
-                    height: .25rem;
-                }
-
-                .error-message {
-                    display: flex;
-                    flex-direction: row;
-                    gap: .25rem;
-                }
-
-            }
-        }
-
-        textarea {
-            resize: none !important;
-            height: 3rem!important;
-        }
-
-        .field-label {
-            width: 100%;
-            display: inline-flex;
-            flex-direction: row;
-            justify-content: space-between;
-            font-size: 14px;
-            margin-bottom: 8px;
-            font-weight: 400;
-
-            span {
-                color: var(--appshell-color-grey-strong);
-                opacity: 0.6;
-            }
-        }
     }
 
     mat-dialog-actions {
diff --git a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.ts b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.ts
index 65e4c3b..ddb6983 100644
--- a/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.ts
+++ b/src/app/components/request-deletion-simple-dialog/request-deletion-simple-dialog.component.ts
@@ -10,7 +10,7 @@ import { RequestDeletionDialogData } from "../../models/request-deletion-dialog-
 import { AppShellIconComponent } from "@opendevstack/ngx-appshell";
 
 @Component({
-  selector: 'app-request-deletion-dialog',
+  selector: 'app-request-deletion-simple-dialog',
   imports: [
     CommonModule,
     MatButtonModule,