diff --git a/apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html b/apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html
index e35efbc..d559258 100644
--- a/apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html
@@ -30,7 +30,7 @@
           afDescription="Fältet accepterar kommaseparerade e-postadresser för att skicka inbjudningar till flera e-postadresser samtidigt."
           [afRequired]="true"
           [afDisableValidStyle]="true"
-          [afInvalidMessage]="emailsControl.errors?.message || 'Ogiltig e-postadress'"
+          [afInvalidMessage]="emailsControl.errors?.required || emailsControl.errors?.invalid || 'Ogiltig e-postadress'"
           [afInvalid]="emailsControl.invalid && emailsControl.dirty"
           afLabel="E-postadresser"
         ></digi-ng-form-textarea>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts
index f39de83..feda2c7 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts
@@ -1,9 +1,5 @@
-import { FormSelectItem } from '@af/digi-ng/_form/form-select';
 import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
-import { AbstractControl, FormBuilder, FormGroup } from '@angular/forms';
-import { Router } from '@angular/router';
 import { ReportsData } from '@msfa-models/report.model';
-import { RequiredValidator } from '@msfa-utils/validators/required.validator';
 
 @Component({
   selector: 'msfa-deltagare-tab-reports',
@@ -13,53 +9,8 @@ import { RequiredValidator } from '@msfa-utils/validators/required.validator';
 })
 export class DeltagareTabReportsComponent {
   @Input() reportsData: ReportsData;
-  @Input() genomforandeReferens: number;
   @Output() reportsPaginated = new EventEmitter<number>();
 
-  readonly reportsFormControlName = 'reports';
-  reportPickerFormGroup: FormGroup = this.formBuilder.group({
-    reports: this.formBuilder.control('', [RequiredValidator('Rapporttyp är obligatoriskt')]),
-  });
-
-  selectableReportTypes: Array<FormSelectItem> = [
-    { name: 'Avvikelse', value: 'avvikelse' },
-    { name: 'Gemensam Planering', value: 'planering' },
-    // { name: 'Signal om arbete eller studier', value: 'signal' },
-  ];
-
-  constructor(private formBuilder: FormBuilder, private router: Router) {}
-
-  get reportsFormControl(): AbstractControl | null {
-    return this.reportPickerFormGroup?.get(this.reportsFormControlName);
-  }
-
-  onFormSubmitted(event: Event, reportType: string): void {
-    event.preventDefault();
-    this.reportsFormControl.markAsTouched();
-
-    if (this.reportsFormControl.invalid) {
-      return;
-    }
-
-    switch (reportType) {
-      case 'planering':
-        void this.router.navigateByUrl(`/deltagare/${this.genomforandeReferens}/gemensam-planering`);
-        break;
-      case 'avvikelse':
-        void this.router.navigateByUrl(`/deltagare/${this.genomforandeReferens}/avvikelserapport`);
-        break;
-      case 'signal':
-        void this.router.navigate([`/deltagare/${this.genomforandeReferens}/signal`]);
-        break;
-      default:
-        return;
-    }
-
-    if (!this.selectableReportTypes || this.reportPickerFormGroup.invalid) {
-      return;
-    }
-  }
-
   emitNewPage(page: number): void {
     this.reportsPaginated.emit(page);
   }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.html
index 5f4c6c1..33ec2b2 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.html
@@ -34,7 +34,6 @@
             <ng-container *ngIf="activeTab === '1'">
               <msfa-deltagare-tab-reports
                 [reportsData]="reportsData$ | async"
-                [genomforandeReferens]="currentGenomforandeReferens$ | async"
                 (reportsPaginated)="setNewPage($event)"
               ></msfa-deltagare-tab-reports>
             </ng-container>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.html
index dc80af6..9b9cded 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.html
@@ -1,142 +1,147 @@
 <msfa-layout>
   <msfa-report-layout
+    *ngIf="avrop$ | async as avrop; else skeletonRef"
     [avrop]="avrop$ | async"
     description="Här rapporterar du deltagarens avvikelser. Exempelvis kan du rapportera om tjänsten inte fungerar för deltagaren eller om deltagaren misskött sig under tjänsten."
-    reportSubTitle="Skapa rapport"
     reportTitle="Avvikelserapport (avvikelse)"
-    *ngIf="avrop$ | async as avrop; else skeletonRef"
   >
-    <div *ngIf="submittedDate$ | async as submittedDate; else formRef" class="deltagare-avvikelse__confirmation">
-      <digi-notification-alert
-        af-heading="Allt gick bra"
-        af-heading-level="h3"
-        af-variation="success"
-        class="deltagare-avvikelse__alert"
-      >
-        <p>
-          Avvikelserapport för deltagare {{avrop.fullName}} är nu inskickad till Arbetsförmedlingen och inväntar
-          godkännande.
-        </p>
-        <dl>
-          <dt>Datum</dt>
-          <dd>{{submittedDate | date:'longDate'}} kl {{submittedDate | date:'shortTime'}}</dd>
-        </dl>
-      </digi-notification-alert>
-      <msfa-back-link route="../">Tillbaka till deltagaren</msfa-back-link>
-    </div>
+    <div class="deltagare-avvikelse">
+      <div *ngIf="submittedDate$ | async as submittedDate; else formRef" class="deltagare-avvikelse__confirmation">
+        <digi-notification-alert
+          af-heading="Allt gick bra"
+          af-heading-level="h3"
+          af-variation="success"
+          class="deltagare-avvikelse__alert"
+        >
+          <p>
+            Avvikelserapport för deltagare {{avrop.fullName}} är nu inskickad till Arbetsförmedlingen och inväntar
+            godkännande.
+          </p>
+          <dl>
+            <dt>Datum</dt>
+            <dd>{{submittedDate | date:'longDate'}} kl {{submittedDate | date:'shortTime'}}</dd>
+          </dl>
+        </digi-notification-alert>
+        <msfa-back-link route="../">Tillbaka till deltagaren</msfa-back-link>
+      </div>
 
-    <ng-template #formRef>
-      <form [formGroup]="avvikelseFormGroup" (ngSubmit)="openConfirmDialog()">
-        <div class="orsaks-form__content">
-          <digi-ng-form-select
-            *ngIf="reasonsAsNgDigiFormSelectItems$ | async; let reason; else loadingRef"
-            [formControlName]="reasonFormName"
-            [afLabel]=" 'Orsak till avvikelse'"
-            [afPlaceholder]="'Välj orsak till avvikelse'"
-            [afSelectItems]="reason"
-            [afDisableValidStyle]="true"
-            [afInvalid]="formControlIsInvalid(reasonFormControl)"
-          ></digi-ng-form-select>
-          <digi-form-validation-message *ngIf="formControlIsInvalid(reasonFormControl)" af-variation="error"
-            >{{reasonFormControl.errors?.message}}
-          </digi-form-validation-message>
-        </div>
-
-        <div [formArrayName]="questionsFormName">
-          <ng-container *ngIf="questionsForChosenReason$ | async; let questions">
-            <div *ngFor="let question of questionsFormArray.controls; let i=index">
-              <div class="fragor-form__content">
-                <digi-ng-form-textarea
-                  [formControlName]="i"
-                  [afLabel]="questions[i]?.name"
-                  [afDisableValidStyle]="true"
-                  [afRequired]="questionIsRequired(questions[i])"
-                  [afMaxLength]="2000"
-                  [afInvalid]="formControlIsInvalid(question)"
-                ></digi-ng-form-textarea>
+      <ng-template #formRef>
+        <form class="deltagare-avvikelse__form" [formGroup]="avvikelseFormGroup" (ngSubmit)="openConfirmDialog()">
+          <div class="deltagare-avvikelse__form-item">
+            <digi-ng-form-select
+              *ngIf="reasonsAsNgDigiFormSelectItems$ | async; let reason; else loadingRef"
+              [formControlName]="reasonFormName"
+              afLabel="Orsak till avvikelse"
+              afPlaceholder="Välj orsak till avvikelse"
+              [afSelectItems]="reason"
+              [afRequired]="true"
+              [afAnnounceIfOptional]="true"
+              [afDisableValidStyle]="true"
+              [afInvalid]="formControlIsInvalid(reasonFormControl)"
+            ></digi-ng-form-select>
+            <div aria-atomic="true" role="alert">
+              <digi-form-validation-message *ngIf="formControlIsInvalid(reasonFormControl)" af-variation="error"
+                >{{reasonFormControl.errors?.required}}
+              </digi-form-validation-message>
+            </div>
+          </div>
 
+          <div
+            class="deltagare-avvikelse__form-item deltagare-avvikelse__textareas"
+            [formArrayName]="questionsFormName"
+            *ngIf="questionsForChosenReason$ | async; let questions"
+          >
+            <div
+              class="deltagare-avvikelse__form-item"
+              *ngFor="let question of questionsFormArray.controls; let i=index"
+            >
+              <digi-ng-form-textarea
+                [formControlName]="i"
+                [afLabel]="questions[i]?.name"
+                [afDisableValidStyle]="true"
+                [afRequired]="questionIsRequired(questions[i])"
+                [afAnnounceIfOptional]="true"
+                [afMaxLength]="2000"
+                [afInvalid]="formControlIsInvalid(question)"
+              ></digi-ng-form-textarea>
+              <div aria-atomic="true" role="alert">
                 <digi-form-validation-message *ngIf="formControlIsInvalid(question)" af-variation="error"
-                  >{{question.errors?.message}}
+                  >{{question.errors?.required}}
                 </digi-form-validation-message>
               </div>
             </div>
-          </ng-container>
-        </div>
+          </div>
 
-        <ng-container *ngIf="chosenReasonId$ | async">
-          <digi-ng-form-datepicker
-            [afDisableValidStyle]="true"
-            [afMinDate]="minDate(avrop)"
-            [afMaxDate]="maxDate"
-            [afInvalid]="formControlIsInvalid(avvikelseDateFormControl)"
-            [afLabel]="'Välj dag för avvikelse'"
-            [formControlName]="reportingDateFormName"
-          ></digi-ng-form-datepicker>
+          <div class="deltagare-avvikelse__form-item" *ngIf="chosenReasonId$ | async">
+            <digi-ng-form-datepicker
+              [afDisableValidStyle]="true"
+              [afMinDate]="minDate(avrop)"
+              [afMaxDate]="maxDate"
+              [afInvalid]="formControlIsInvalid(avvikelseDateFormControl)"
+              [afValidationMessages]="{required: 'Datum är obligatoriskt'}"
+              [afAnnounceIfOptional]="true"
+              [afRequired]="true"
+              [afLabel]="'Välj dag för avvikelse'"
+              [formControlName]="reportingDateFormName"
+            ></digi-ng-form-datepicker>
+          </div>
 
-          <!-- NOTE: Other errors (such as formatting) are captured and displayed within digi-ng-form-datepicker -->
-          <digi-form-validation-message
-            *ngIf="avvikelseDateFormControl?.errors?.type === 'required'"
-            af-variation="error"
-            >{{avvikelseDateFormControl.errors?.message}}
-          </digi-form-validation-message>
-        </ng-container>
-
-        <div class="deltagare-avvikelse__cta-wrapper">
-          <digi-button af-type="submit" af-size="m">Förhandsgranska</digi-button>
-          <msfa-back-link [showIcon]="false" [asButton]="true" route="../">
-            <span>Avbryt</span>
-            <span class="msfa__a11y-sr-only">&nbsp;och gå tillbaka till deltagaren</span>
-          </msfa-back-link>
-        </div>
-      </form>
-    </ng-template>
-    <digi-ng-dialog
-      [afActive]="confirmDialogIsOpen$ | async"
-      (afOnPrimaryClick)="submitAndCloseConfirmDialog()"
-      (afOnInactive)="cancelConfirmDialog()"
-      afHeadingLevel="h2"
-      afPrimaryButtonText="Skicka in"
-      afSecondaryButtonText="Avbryt"
-      (afOnSecondaryClick)="cancelConfirmDialog()"
-      afHeading="Vill du skicka in Avvikelserapport (avvikelse)"
-      afAriaLabel="Förhandsgranska och skicka in Avvikelserapport (avvikelse)"
-      id="confirmAvvikelserapport"
-    >
-      <dl>
-        <dt>Namn</dt>
-        <dd>{{avrop.fullName}}</dd>
-        <dt>Personnummer</dt>
-        <dd>
-          <msfa-hide-text
-            symbols="********-****"
-            [changingText]="avrop.ssn"
-            ariaLabelType="Personnummer"
-          ></msfa-hide-text>
-        </dd>
-        <dt>Tjänst</dt>
-        <dd>{{avrop.tjanst}}</dd>
-        <dt>Startdatum</dt>
-        <dd>
-          <digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
-        </dd>
-        <dt>Slutdatum</dt>
-        <dd>
-          <digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
-        </dd>
-        <dt>Orsak till avvikelse:</dt>
-        <dd>{{(chosenReason$ | async)?.name }}</dd>
-        <ng-container *ngIf="avvikelseSubmitData$ | async; let avvikelseSubmitData; else loadingRef">
-          <ng-container *ngFor="let question of avvikelseSubmitData.avvikelseAlternativ.frageformular">
-            <dt>{{getCurrentQuestionFromId(question.fraga).name}}</dt>
-            <dd>{{question.svar.length === 0 ? 'Inget svar' : question.svar }}</dd>
-          </ng-container>
-          <dt>Dag för avvikelse:</dt>
-          <dd>{{avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}</dd>
-        </ng-container>
-      </dl>
-
-      <msfa-loader *ngIf="submitIsLoading$ | async"></msfa-loader>
-    </digi-ng-dialog>
+          <div class="deltagare-avvikelse__cta-wrapper">
+            <digi-button af-type="submit" af-size="m">Förhandsgranska</digi-button>
+            <msfa-back-link [showIcon]="false" [asButton]="true" route="../">
+              <span>Avbryt</span>
+              <span class="msfa__a11y-sr-only">&nbsp;och gå tillbaka till deltagaren</span>
+            </msfa-back-link>
+          </div>
+        </form>
+        <digi-ng-dialog
+          [afActive]="confirmDialogIsOpen$ | async"
+          (afOnPrimaryClick)="submitAndCloseConfirmDialog()"
+          (afOnInactive)="cancelConfirmDialog()"
+          afHeadingLevel="h2"
+          afPrimaryButtonText="Skicka in"
+          afSecondaryButtonText="Avbryt"
+          (afOnSecondaryClick)="cancelConfirmDialog()"
+          afHeading="Vill du skicka in Avvikelserapport (avvikelse)"
+          afAriaLabel="Förhandsgranska och skicka in Avvikelserapport (avvikelse)"
+          id="confirmAvvikelserapport"
+        >
+          <msfa-loader *ngIf="submitIsLoading$ | async" type="absolute"></msfa-loader>
+          <dl>
+            <dt>Namn</dt>
+            <dd>{{avrop.fullName}}</dd>
+            <dt>Personnummer</dt>
+            <dd>
+              <msfa-hide-text
+                symbols="********-****"
+                [changingText]="avrop.ssn"
+                ariaLabelType="Personnummer"
+              ></msfa-hide-text>
+            </dd>
+            <dt>Tjänst</dt>
+            <dd>{{avrop.tjanst}}</dd>
+            <dt>Startdatum</dt>
+            <dd>
+              <digi-typography-time [afDateTime]="avrop.startDate"></digi-typography-time>
+            </dd>
+            <dt>Slutdatum</dt>
+            <dd>
+              <digi-typography-time [afDateTime]="avrop.endDate"></digi-typography-time>
+            </dd>
+            <dt>Orsak till avvikelse:</dt>
+            <dd>{{(chosenReason$ | async)?.name }}</dd>
+            <ng-container *ngIf="avvikelseSubmitData$ | async; let avvikelseSubmitData; else loadingRef">
+              <ng-container *ngFor="let question of avvikelseSubmitData.avvikelseAlternativ.frageformular">
+                <dt>{{getCurrentQuestionFromId(question.fraga).name}}</dt>
+                <dd>{{question.svar.length === 0 ? 'Inget svar' : question.svar }}</dd>
+              </ng-container>
+              <dt>Dag för avvikelse:</dt>
+              <dd>{{avvikelseSubmitData.avvikelseAlternativ.rapporteringsdatum }}</dd>
+            </ng-container>
+          </dl>
+        </digi-ng-dialog>
+      </ng-template>
+    </div>
   </msfa-report-layout>
 </msfa-layout>
 <ng-template #skeletonRef>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.scss
index 8e59404..f94ae02 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-avvikelserapport/deltagare-avvikelserapport.component.scss
@@ -1,61 +1,18 @@
 @import 'variables/gutters';
 
 .deltagare-avvikelse {
+  max-width: var(--digi--typography--text--max-width);
+
   &__confirmation,
+  &__textareas,
   &__form {
     display: flex;
     flex-direction: column;
     gap: $digi--layout--gutter--l;
   }
 
-  &__deltagare,
-  &__alternative,
-  &__description,
-  &__datepicker,
-  &__dayOrPartOfDay {
-    max-width: var(--digi--typography--text--max-width);
-    margin-bottom: $digi--layout--gutter--xl;
-
-    span {
-      font-weight: var(--digi--typography--font-weight--semibold);
-    }
-
-    p {
-      margin: var(--digi--layout--gutter--s) 0 0;
-    }
-  }
-
-  &__alternative-heading {
-    font-size: var(--digi--typography--font-size--h3);
-  }
-
-  &__step-buttons-wrapper--space-right {
-    margin-right: var(--digi--layout--gutter--s);
-  }
-
-  &__alert {
-    max-width: var(--digi--typography--text--max-width);
-  }
-
-
   &__cta-wrapper {
     display: flex;
     gap: var(--digi--layout--gutter);
   }
-
-}
-
-.fragor-form {
-  &__content {
-    max-width: var(--digi--typography--text--max-width);
-    margin-bottom: $digi--layout--gutter--xl;
-  }
-}
-
-
-.orsaks-form {
-  &__content {
-    max-width: var(--digi--typography--text--max-width);
-    margin-bottom: $digi--layout--gutter--xl;
-  }
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.html
index 6a27c13..5014391 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.html
@@ -39,7 +39,6 @@
             (ngSubmit)="openConfirmDialog()"
             id="gemensam-planering-form"
           >
-            <msfa-loader *ngIf="submitLoading$ | async" type="absolute"></msfa-loader>
             <digi-form-fieldset
               af-legend="Deltar arbetssökande på distans?"
               af-name="distance"
@@ -70,9 +69,7 @@
                     ></digi-form-checkbox>
                   </li>
                 </ul>
-                <digi-form-validation-message
-                  *ngIf="shouldValidate && gpFormGroup.errors?.activityIds"
-                  af-variation="error"
+                <digi-form-validation-message *ngIf="formControlIsInvalid('activityIds')" af-variation="error"
                   >{{gpFormGroup.errors.activityIds}}</digi-form-validation-message
                 >
               </ng-container>
@@ -97,13 +94,19 @@
               </div>
             </footer>
           </form>
-          <msfa-confirm-dialog
-            [dialogOpen]="confirmDialogOpen"
-            dialogTitle="Vill du skicka in Gemensam planering?"
-            ariaLabel="Förhandsgranska och skicka in Gemensam planering"
-            primaryButtonText="Skicka in"
-            (confirmDialogChanged)="closeConfirmDialogAndProceed($event, genomforandeReferens)"
+          <digi-ng-dialog
+            [afActive]="confirmDialogOpen$ | async"
+            (afOnPrimaryClick)="submitAndCloseConfirmDialog(genomforandeReferens)"
+            (afOnInactive)="cancelConfirmDialog()"
+            afHeadingLevel="h2"
+            afPrimaryButtonText="Skicka in"
+            afSecondaryButtonText="Avbryt"
+            (afOnSecondaryClick)="cancelConfirmDialog()"
+            afHeading="Vill du skicka in Gemensam planering"
+            afAriaLabel="Förhandsgranska och skicka in Gemensam planering"
+            id="confirm-gemensam-planering"
           >
+            <msfa-loader *ngIf="submitLoading$ | async" type="absolute"></msfa-loader>
             <dl>
               <dt>Namn</dt>
               <dd>{{avrop.fullName}}</dd>
@@ -140,7 +143,7 @@
                 </ul>
               </dd>
             </dl>
-          </msfa-confirm-dialog>
+          </digi-ng-dialog>
         </ng-template>
       </ng-template>
     </div>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.ts
index c2a123a..8b4220c 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.ts
@@ -2,7 +2,6 @@ import { RadiobuttonGroupDirection, RadiobuttonModel } from '@af/digi-ng/_form/f
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { FormArray, FormControl, FormGroup } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
-import { ConfirmDialog } from '@msfa-enums/confirm-dialog.enum';
 import { ErrorType } from '@msfa-enums/error-type.enum';
 import { Activity } from '@msfa-models/activity.model';
 import { Avrop } from '@msfa-models/avrop.model';
@@ -24,16 +23,13 @@ import { GemensamPlaneringValidator } from './gemensam-planering.validator';
 })
 export class DeltagareGemensamPlaneringComponent {
   obligatoryActivityIds = [165, 188];
-  shouldValidate = false;
+  shouldValidate$ = new BehaviorSubject<boolean>(false);
   RadiobuttonGroupDirection = RadiobuttonGroupDirection;
-  confirmDialogOpen = false;
+  confirmDialogOpen$ = new BehaviorSubject<boolean>(false);
   today = new Date();
-  private _error$ = new BehaviorSubject<CustomError>(null);
-  error$: Observable<CustomError> = this._error$.asObservable();
-  private _lastSubmittedGP$ = new BehaviorSubject<Date>(null);
-  lastSubmittedGP$: Observable<Date> = this._lastSubmittedGP$.asObservable();
-  private _submitLoading$ = new BehaviorSubject<boolean>(false);
-  submitLoading$: Observable<boolean> = this._submitLoading$.asObservable();
+  error$ = new BehaviorSubject<CustomError>(null);
+  lastSubmittedGP$ = new BehaviorSubject<Date>(null);
+  submitLoading$ = new BehaviorSubject<boolean>(false);
 
   activities$: Observable<Activity[]> = this.gemensamPlaneringService.activities$;
   currentGenomforandeReferens$: Observable<number> = this.activatedRoute.params.pipe(
@@ -82,7 +78,7 @@ export class DeltagareGemensamPlaneringComponent {
   }
 
   showActivityAsInvalid(id: number): boolean {
-    if (this.shouldValidate) {
+    if (this.shouldValidate$.getValue()) {
       if (this.isActivityObligatory(id) && !this.isActivityChecked(id)) {
         return true;
       }
@@ -94,6 +90,10 @@ export class DeltagareGemensamPlaneringComponent {
     return false;
   }
 
+  formControlIsInvalid(formControlName: string): boolean {
+    return this.gpFormGroup.errors && this.gpFormGroup.errors[formControlName] && this.shouldValidate$.getValue();
+  }
+
   constructor(private gemensamPlaneringService: GemensamPlaneringService, private activatedRoute: ActivatedRoute) {}
 
   updateActivityIds(activityId: string, checked: boolean): void {
@@ -109,36 +109,40 @@ export class DeltagareGemensamPlaneringComponent {
   }
 
   openConfirmDialog(): void {
-    this.shouldValidate = true;
+    this.shouldValidate$.next(true);
 
     if (this.gpFormGroup.invalid) {
       return;
     }
-    this.confirmDialogOpen = true;
+    this.confirmDialogOpen$.next(true);
   }
 
-  closeConfirmDialogAndProceed(confirmDialogAnswer: ConfirmDialog, genomforandeReferens: number): void {
-    this.confirmDialogOpen = false;
-
-    if (confirmDialogAnswer === ConfirmDialog.ACCEPTED) {
-      const distance = this.gpFormGroup.get('distance').value as boolean;
-      const activityIds = this.gpFormGroup.get('activityIds').value as number[];
-      void this.postGemensamPlanering({ distance, activityIds, genomforandeReferens });
-    }
+  cancelConfirmDialog(): void {
+    this.confirmDialogOpen$.next(false);
   }
 
-  async postGemensamPlanering(postRequest: GemensamPlanering): Promise<void> {
-    this._submitLoading$.next(true);
+  async submitAndCloseConfirmDialog(genomforandeReferens: number): Promise<void> {
+    this.submitLoading$.next(true);
+
+    const { distance, activityIds } = this.gpFormGroup.value as GemensamPlanering;
+
+    const postRequest = {
+      distance,
+      activityIds,
+      genomforandeReferens,
+    };
+
     return this.gemensamPlaneringService
       .postGemensamPlanering(mapGemensamPlaneringToGemensamPlaneringPostRequest(postRequest))
       .then(() => {
-        this._lastSubmittedGP$.next(new Date());
+        this.lastSubmittedGP$.next(new Date());
       })
       .catch((error: Error) => {
-        this._error$.next(new CustomError({ error, message: error.message, type: ErrorType.API }));
+        this.error$.next(new CustomError({ error, message: error.message, type: ErrorType.API }));
       })
       .finally(() => {
-        this._submitLoading$.next(false);
+        this.submitLoading$.next(false);
+        this.confirmDialogOpen$.next(false);
       });
   }
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.module.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.module.ts
index 0082b86..3dcc040 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.module.ts
@@ -1,3 +1,4 @@
+import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
 import { DigiNgFormCheckboxModule } from '@af/digi-ng/_form/form-checkbox';
 import { DigiNgFormRadiobuttonGroupModule } from '@af/digi-ng/_form/form-radiobutton-group';
 import { DigiNgProgressProgressbarModule } from '@af/digi-ng/_progress/progressbar';
@@ -7,7 +8,6 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
-import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
 import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
 import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
 import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
@@ -25,12 +25,12 @@ import { DeltagareGemensamPlaneringComponent } from './deltagare-gemensam-planer
     DigiNgFormRadiobuttonGroupModule,
     ReactiveFormsModule,
     ReportLayoutModule,
-    ConfirmDialogModule,
     BackLinkModule,
     LoaderModule,
     HideTextModule,
     DigiNgSkeletonBaseModule,
     DigiNgFormCheckboxModule,
+    DigiNgDialogModule,
   ],
   exports: [DeltagareGemensamPlaneringComponent],
 })
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-periodisk-redovisning/deltagare-periodisk-redovisning.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-periodisk-redovisning/deltagare-periodisk-redovisning.component.ts
index 72d4e7b..094e4d4 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-periodisk-redovisning/deltagare-periodisk-redovisning.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-periodisk-redovisning/deltagare-periodisk-redovisning.component.ts
@@ -39,8 +39,8 @@ export class DeltagarePeriodiskRedovisningComponent {
 
   initializePeriodiskRedovisningFormGroup(activitiesList: Activity[]): void {
     this.periodiskRedovisningFormGroup = new FormGroup({
-      lamnatJobbForslag: new FormControl(null, [RequiredValidator('lamnatJobbForslag är obligatoriskt')]),
-      providedSprakStod: new FormControl(null, [RequiredValidator('providedSprakStod är obligatoriskt')]),
+      lamnatJobbForslag: new FormControl(null, [RequiredValidator()]),
+      providedSprakStod: new FormControl(null, [RequiredValidator()]),
       activities: new FormArray([]),
     });
     this.getActivitesFormArray(activitiesList);
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.html
index 10a6325..636ba9c 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.html
@@ -37,7 +37,6 @@
             (ngSubmit)="openConfirmDialog()"
             id="franvaro-report-form"
           >
-            <msfa-loader *ngIf="submitLoading$ | async" type="absolute"></msfa-loader>
             <div class="franvaro-report__form-item">
               <digi-ng-form-select
                 *ngIf="reasons$ | async as reasons; else loadingRef"
@@ -130,7 +129,7 @@
                 </div>
               </div>
 
-              <div>
+              <div class="franvaro-report__form-item">
                 <h2>Tiden deltagaren var frånvarande</h2>
                 <digi-form-fieldset
                   af-legend="Heldag eller del av dag"
@@ -268,13 +267,19 @@
               </div>
             </footer>
           </form>
-          <msfa-confirm-dialog
-            [dialogOpen]="confirmDialogOpen$ | async"
-            dialogTitle="Vill du skicka in Avvikelserapport (frånvaro)?"
-            ariaLabel="Förhandsgranska och skicka in Avvikelserapport (frånvaro)"
-            primaryButtonText="Skicka in"
-            (confirmDialogChanged)="closeConfirmDialogAndProceed($event, genomforandeReferens)"
+          <digi-ng-dialog
+            [afActive]="confirmDialogOpen$ | async"
+            (afOnPrimaryClick)="submitAndCloseConfirmDialog(genomforandeReferens)"
+            (afOnInactive)="cancelConfirmDialog()"
+            afHeadingLevel="h2"
+            afPrimaryButtonText="Skicka in"
+            afSecondaryButtonText="Avbryt"
+            (afOnSecondaryClick)="cancelConfirmDialog()"
+            afHeading="Vill du skicka in Avvikelserapport (frånvaro)"
+            afAriaLabel="Förhandsgranska och skicka in Avvikelserapport (frånvaro)"
+            id="confirm-franvaro-report"
           >
+            <msfa-loader *ngIf="submitLoading$ | async" type="absolute"></msfa-loader>
             <dl *ngIf="reasons$ | async as reasons">
               <dt>Namn</dt>
               <dd>{{avrop.fullName}}</dd>
@@ -321,7 +326,7 @@
               <dt>Tid för förväntad närvaro</dt>
               <dd>{{expectedPresenceStartTimeFormControl.value}} - {{expectedPresenceEndTimeFormControl.value}}</dd>
             </dl>
-          </msfa-confirm-dialog>
+          </digi-ng-dialog>
         </ng-template>
       </ng-template>
     </div>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.scss
index a47f9dc..fd4d712 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.scss
@@ -14,6 +14,10 @@
     z-index: $msfa__z-index-default;
   }
 
+  &__dialog-contents {
+    position: relative;
+  }
+
   &__time-pickers {
     display: flex;
     gap: var(--digi--layout--gutter);
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.ts
index ddadf97..871f293 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.component.ts
@@ -3,7 +3,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 import { ANNAN_KAND_ORSAK_ID, ANNAN_ORSAK_ID } from '@msfa-constants/franvaro-reasons';
-import { ConfirmDialog } from '@msfa-enums/confirm-dialog.enum';
 import { ErrorType } from '@msfa-enums/error-type.enum';
 import { Avrop } from '@msfa-models/avrop.model';
 import { FranvaroRequestData } from '@msfa-models/avvikelse.model';
@@ -136,15 +135,11 @@ export class FranvaroReportComponent {
     this.confirmDialogOpen$.next(true);
   }
 
-  closeConfirmDialogAndProceed(confirmDialogAnswer: ConfirmDialog, genomforandeReferens: number): void {
+  cancelConfirmDialog(): void {
     this.confirmDialogOpen$.next(false);
-
-    if (confirmDialogAnswer === ConfirmDialog.ACCEPTED) {
-      void this.postFranvaroReport(genomforandeReferens);
-    }
   }
 
-  async postFranvaroReport(genomforandeReferens: number): Promise<void> {
+  async submitAndCloseConfirmDialog(genomforandeReferens: number): Promise<void> {
     this.submitLoading$.next(true);
 
     const {
@@ -190,6 +185,7 @@ export class FranvaroReportComponent {
       })
       .finally(() => {
         this.submitLoading$.next(false);
+        this.confirmDialogOpen$.next(false);
       });
   }
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.module.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.module.ts
index 6472e0d..391b284 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/franvaro-report/franvaro-report.module.ts
@@ -1,3 +1,4 @@
+import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
 import { DigiNgFormDatepickerModule } from '@af/digi-ng/_form/form-datepicker';
 import { DigiNgFormInputModule } from '@af/digi-ng/_form/form-input';
 import { DigiNgFormRadiobuttonGroupModule } from '@af/digi-ng/_form/form-radiobutton-group';
@@ -10,7 +11,6 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
-import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
 import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
 import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
 import { LoaderModule } from '@msfa-shared/components/loader/loader.module';
@@ -29,7 +29,6 @@ import { FranvaroReportService } from './franvaro-report.service';
     ReportLayoutModule,
     LoaderModule,
     BackLinkModule,
-    ConfirmDialogModule,
     HideTextModule,
     DigiNgFormSelectModule,
     DigiNgFormDatepickerModule,
@@ -38,6 +37,7 @@ import { FranvaroReportService } from './franvaro-report.service';
     DigiNgFormTextareaModule,
     DigiNgFormInputModule,
     DigiNgFormValidationMessageModule,
+    DigiNgDialogModule,
   ],
   providers: [FranvaroReportService],
   exports: [FranvaroReportComponent],
diff --git a/apps/mina-sidor-fa/src/app/shared/models/validation-error.model.ts b/apps/mina-sidor-fa/src/app/shared/models/validation-error.model.ts
index 9253548..1d39a9b 100644
--- a/apps/mina-sidor-fa/src/app/shared/models/validation-error.model.ts
+++ b/apps/mina-sidor-fa/src/app/shared/models/validation-error.model.ts
@@ -1,4 +1,3 @@
 export interface ValidationError {
-  type: string;
-  message: string;
+  [key: string]: string;
 }
diff --git a/apps/mina-sidor-fa/src/app/shared/utils/validators/date.validator.ts b/apps/mina-sidor-fa/src/app/shared/utils/validators/date.validator.ts
index 7e1688e..45ed1fa 100644
--- a/apps/mina-sidor-fa/src/app/shared/utils/validators/date.validator.ts
+++ b/apps/mina-sidor-fa/src/app/shared/utils/validators/date.validator.ts
@@ -12,7 +12,7 @@ export function isoDateWithoutTimeValidator(): ValidatorFn {
       const value: string = control.value as string;
 
       if (!isoDateIsValid(value)) {
-        return { type: 'invalid', message: `Ogiltigt datum, vänligen ange YYYY-MM-DD` };
+        return { invalid: `Ogiltigt datum, vänligen ange YYYY-MM-DD` };
       }
     }
 
diff --git a/apps/mina-sidor-fa/src/app/shared/utils/validators/email.validator.ts b/apps/mina-sidor-fa/src/app/shared/utils/validators/email.validator.ts
index db3ee55..971ba28 100644
--- a/apps/mina-sidor-fa/src/app/shared/utils/validators/email.validator.ts
+++ b/apps/mina-sidor-fa/src/app/shared/utils/validators/email.validator.ts
@@ -12,7 +12,7 @@ export function EmailValidator(label = 'Fältet'): ValidatorFn {
       const value: string = control.value as string;
 
       if (!emailIsValid(value)) {
-        return { type: 'invalid', message: `Ogiltig ${label}` };
+        return { invalid: `Ogiltig ${label}` };
       }
     }
 
@@ -38,7 +38,7 @@ export function CommaSeparatedEmailValidator(): ValidatorFn {
       if (invalidEmailaddresses.length) {
         const messagePrepend =
           invalidEmailaddresses.length > 1 ? 'Ogiltiga e-postadresser: ' : 'Ogiltig e-postadress: ';
-        return { type: 'invalid', message: `${messagePrepend}${invalidEmailaddresses.join(', ')}` };
+        return { invalid: `${messagePrepend}${invalidEmailaddresses.join(', ')}` };
       }
     }
 
diff --git a/apps/mina-sidor-fa/src/app/shared/utils/validators/required.validator.ts b/apps/mina-sidor-fa/src/app/shared/utils/validators/required.validator.ts
index 3f774f7..995711f 100644
--- a/apps/mina-sidor-fa/src/app/shared/utils/validators/required.validator.ts
+++ b/apps/mina-sidor-fa/src/app/shared/utils/validators/required.validator.ts
@@ -5,7 +5,7 @@ export function RequiredValidator(message = 'Fältet är obligatoriskt'): Valida
   return (control: AbstractControl): ValidationError => {
     if (control) {
       if (!control.value || (Array.isArray(control.value) && !control.value.length)) {
-        return { type: 'required', message };
+        return { required: message };
       }
     }
 
diff --git a/apps/mina-sidor-fa/src/app/shared/utils/validators/social-security-number.validator.ts b/apps/mina-sidor-fa/src/app/shared/utils/validators/social-security-number.validator.ts
index 6bbd18f..cf37c22 100644
--- a/apps/mina-sidor-fa/src/app/shared/utils/validators/social-security-number.validator.ts
+++ b/apps/mina-sidor-fa/src/app/shared/utils/validators/social-security-number.validator.ts
@@ -10,7 +10,7 @@ export function SocialSecurityNumberValidator(): ValidatorFn {
     const ssn = control.value as string;
 
     if (/[^0-9-]/g.test(ssn)) {
-      return { type: 'ssnInvalid', message: 'Inkorrekt personnummer' };
+      return { ssnInvalid: 'Inkorrekt personnummer' };
     }
 
     let strippedSsn = ssn.replace(/[^0-9]/g, '');
@@ -22,12 +22,12 @@ export function SocialSecurityNumberValidator(): ValidatorFn {
 
     // Check length
     if (strippedSsn.length !== 10) {
-      return { type: 'ssnNotComplete', message: 'Personnummret är inte fullständigt' };
+      return { ssnNotComplete: 'Personnummret är inte fullständigt' };
     }
 
     // Check month
     if (+strippedSsn.substr(2, 2) > 12 || strippedSsn.substr(2, 2) === '00') {
-      return { type: 'ssnInvalid', message: 'Inkorrekt personnummer' };
+      return { ssnInvalid: 'Inkorrekt personnummer' };
     }
 
     // Check date (valid date + 60 is also apporved because of co-ordination number)
@@ -35,10 +35,10 @@ export function SocialSecurityNumberValidator(): ValidatorFn {
       (+strippedSsn.substr(4, 2) > 31 || strippedSsn.substr(4, 2) === '00') &&
       (+strippedSsn.substr(4, 2) > 91 || +strippedSsn.substr(4, 2) <= 60)
     ) {
-      return { type: 'ssnInvalid', message: 'Inkorrekt personnummer' };
+      return { ssnInvalid: 'Inkorrekt personnummer' };
     }
 
-    return isControlDigitLegit(strippedSsn) ? null : { type: 'ssnInvalid', message: 'Inkorrekt personnummer' };
+    return isControlDigitLegit(strippedSsn) ? null : { ssnInvalid: 'Inkorrekt personnummer' };
   };
 }