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 dc2c6d4..2c6f8f3 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
@@ -6,112 +6,124 @@
     [isPeriodDate]="true"
   >
     <div class="gemensam-planering" *ngIf="currentGenomforandeReferens$ | async as genomforandeReferens">
-      <div class="gemensam-planering__confirmation" *ngIf="lastSubmittedGP$ | async as lastSubmittedGP; else formRef">
-        <digi-notification-alert
-          class="gemensam-planering__alert"
-          af-variation="success"
-          af-heading="Allt gick bra"
-          af-heading-level="h3"
-        >
-          <p>
-            Gemensam planering för deltagare {{avrop.fullName}} är nu inskickad till Arbetsförmedlingen och inväntar
-            godkännande.
-          </p>
-          <dl>
-            <dt>Datum</dt>
-            <dd>{{lastSubmittedGP | date:'longDate'}} kl {{lastSubmittedGP | date:'shortTime'}}</dd>
-          </dl>
+      <div class="gemensam-planering__warning" *ngIf="today < avrop.startDate; else reportRef">
+        <digi-notification-alert af-variation="warning" af-heading="Kan inte skapa Gemensam planering">
+          <p>Det går inte att skicka Gemensam planering eftersom tjänsten inte har startat ännu.</p>
         </digi-notification-alert>
-        <msfa-back-link [route]="['/deltagare/'+ genomforandeReferens]">Tillbaka till deltagaren</msfa-back-link>
+
+        <msfa-back-link [route]="['../']">Tillbaka till deltagaren</msfa-back-link>
       </div>
-      <ng-template #formRef>
-        <form
-          class="gemensam-planering__form"
-          [formGroup]="gpFormGroup"
-          (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"
-            af-form="gemensam-planering-form"
+      <ng-template #reportRef>
+        <div class="gemensam-planering__confirmation" *ngIf="lastSubmittedGP$ | async as lastSubmittedGP; else formRef">
+          <digi-notification-alert
+            class="gemensam-planering__alert"
+            af-variation="success"
+            af-heading="Allt gick bra"
+            af-heading-level="h3"
           >
-            <digi-ng-form-radiobutton-group
-              [afRadiobuttons]="distanceRadiobuttons"
-              formControlName="distance"
-              [afRequired]="true"
-              [afRadiobuttonGroupDirection]="RadiobuttonGroupDirection.HORIZONTAL"
-            ></digi-ng-form-radiobutton-group>
-          </digi-form-fieldset>
-          <digi-form-fieldset af-legend="Aktiviteter" af-name="aktivitetsIds" af-form="gemensam-planering-form">
             <p>
-              Varje Gemensam planering måste innehålla de två obligatoriska aktiviteterna samt en frivillig aktivitet
-              som en del av det individuella stödet för varje deltagare.
+              Gemensam planering för deltagare {{avrop.fullName}} är nu inskickad till Arbetsförmedlingen och inväntar
+              godkännande.
             </p>
-
-            <ng-container *ngIf="activities$ | async as activities; else loadingRef">
-              <ul class="gemensam-planering__activity-list">
-                <li class="gemensam-planering__activity-item" *ngFor="let activity of activities;">
-                  <digi-form-checkbox
-                    [afLabel]="activity.name + (isActivityObligatory(activity.id) ? ' (obligatorisk)' : '')"
-                    [afValue]="activity.id"
-                    [afValidation]="showActivityAsInvalid(activity.id) ? 'error' : 'neutral'"
-                    [afChecked]="isActivityChecked(activity.id) || isActivityObligatory(activity.id)"
-                    (afOnChange)="updateActivityIds(activity.id, $event.detail.target.checked)"
-                  ></digi-form-checkbox>
-                </li>
-              </ul>
-              <digi-form-validation-message
-                *ngIf="shouldValidate && gpFormGroup.errors?.activityIds"
-                af-variation="error"
-                >{{gpFormGroup.errors.activityIds}}</digi-form-validation-message
-              >
-            </ng-container>
-          </digi-form-fieldset>
-
-          <footer class="gemensam-planering__footer">
-            <digi-notification-alert
-              *ngIf="error$ | async as error"
-              class="gemensam-planering__alert"
-              af-variation="danger"
-              af-heading="Någonting gick fel"
+            <dl>
+              <dt>Datum</dt>
+              <dd>{{lastSubmittedGP | date:'longDate'}} kl {{lastSubmittedGP | date:'shortTime'}}</dd>
+            </dl>
+          </digi-notification-alert>
+          <msfa-back-link [route]="['/deltagare/'+ genomforandeReferens]">Tillbaka till deltagaren</msfa-back-link>
+        </div>
+        <ng-template #formRef>
+          <form
+            class="gemensam-planering__form"
+            [formGroup]="gpFormGroup"
+            (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"
+              af-form="gemensam-planering-form"
             >
-              <p>Kunde inte spara Gemensam planering. Ladda om sidan och försök igen.</p>
-              <p class="msfa__small-text" *ngIf="error.message">{{error.message}}</p>
-            </digi-notification-alert>
-            <div class="gemensam-planering__cta-wrapper">
-              <digi-button af-type="submit" af-size="m">Förhandsgranska</digi-button>
-              <msfa-back-link [showIcon]="false" [asButton]="true" [route]="['/deltagare/'+ genomforandeReferens]"
-                >Avbryt
-              </msfa-back-link>
-            </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)"
-        >
-          <dl>
-            <dt>Deltar arbetssökande på distans?</dt>
-            <dd>{{gpFormGroup.value.distance ? 'Ja' : 'Nej'}}</dd>
-            <dt>Aktiviteter</dt>
-            <dd>
-              <ul class="gemensam-planering__activity-list" *ngFor="let activity of activities$ | async">
-                <li class="gemensam-planering__activity-item" *ngIf="activityIdsFormArray.value.includes(activity.id)">
-                  <digi-icon-check-circle
-                    class="msfa__digi-icon gemensam-planering__activity-check"
-                    aria-hidden="true"
-                  ></digi-icon-check-circle>
-                  {{activity.name}}
-                </li>
-              </ul>
-            </dd>
-          </dl>
-        </msfa-confirm-dialog>
+              <digi-ng-form-radiobutton-group
+                [afRadiobuttons]="distanceRadiobuttons"
+                formControlName="distance"
+                [afRequired]="true"
+                [afRadiobuttonGroupDirection]="RadiobuttonGroupDirection.HORIZONTAL"
+              ></digi-ng-form-radiobutton-group>
+            </digi-form-fieldset>
+            <digi-form-fieldset af-legend="Aktiviteter" af-name="aktivitetsIds" af-form="gemensam-planering-form">
+              <p>
+                Varje Gemensam planering måste innehålla de två obligatoriska aktiviteterna samt en frivillig aktivitet
+                som en del av det individuella stödet för varje deltagare.
+              </p>
+
+              <ng-container *ngIf="activities$ | async as activities; else loadingRef">
+                <ul class="gemensam-planering__activity-list">
+                  <li class="gemensam-planering__activity-item" *ngFor="let activity of activities;">
+                    <digi-form-checkbox
+                      [afLabel]="activity.name + (isActivityObligatory(activity.id) ? ' (obligatorisk)' : '')"
+                      [afValue]="activity.id"
+                      [afValidation]="showActivityAsInvalid(activity.id) ? 'error' : 'neutral'"
+                      [afChecked]="isActivityChecked(activity.id) || isActivityObligatory(activity.id)"
+                      (afOnChange)="updateActivityIds(activity.id, $event.detail.target.checked)"
+                    ></digi-form-checkbox>
+                  </li>
+                </ul>
+                <digi-form-validation-message
+                  *ngIf="shouldValidate && gpFormGroup.errors?.activityIds"
+                  af-variation="error"
+                  >{{gpFormGroup.errors.activityIds}}</digi-form-validation-message
+                >
+              </ng-container>
+            </digi-form-fieldset>
+
+            <footer class="gemensam-planering__footer">
+              <digi-notification-alert
+                *ngIf="error$ | async as error"
+                class="gemensam-planering__alert"
+                af-variation="danger"
+                af-heading="Någonting gick fel"
+              >
+                <p>Kunde inte spara Gemensam planering. Ladda om sidan och försök igen.</p>
+                <p class="msfa__small-text" *ngIf="error.message">{{error.message}}</p>
+              </digi-notification-alert>
+              <div class="gemensam-planering__cta-wrapper">
+                <digi-button af-type="submit" af-size="m">Förhandsgranska</digi-button>
+                <msfa-back-link [showIcon]="false" [asButton]="true" [route]="['/deltagare/'+ genomforandeReferens]"
+                  >Avbryt
+                </msfa-back-link>
+              </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)"
+          >
+            <dl>
+              <dt>Deltar arbetssökande på distans?</dt>
+              <dd>{{gpFormGroup.value.distance ? 'Ja' : 'Nej'}}</dd>
+              <dt>Aktiviteter</dt>
+              <dd>
+                <ul class="gemensam-planering__activity-list" *ngFor="let activity of activities$ | async">
+                  <li
+                    class="gemensam-planering__activity-item"
+                    *ngIf="activityIdsFormArray.value.includes(activity.id)"
+                  >
+                    <digi-icon-check-circle
+                      class="msfa__digi-icon gemensam-planering__activity-check"
+                      aria-hidden="true"
+                    ></digi-icon-check-circle>
+                    {{activity.name}}
+                  </li>
+                </ul>
+              </dd>
+            </dl>
+          </msfa-confirm-dialog>
+        </ng-template>
       </ng-template>
     </div>
   </msfa-report-layout>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.scss
index 4080376..4508320 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-reports/deltagare-gemensam-planering/deltagare-gemensam-planering.component.scss
@@ -5,6 +5,7 @@
   max-width: var(--digi--typography--text--max-width);
 
   &__confirmation,
+  &__warning,
   &__form {
     position: relative;
     display: flex;
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 2c1dd17..c2a123a 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
@@ -27,6 +27,7 @@ export class DeltagareGemensamPlaneringComponent {
   shouldValidate = false;
   RadiobuttonGroupDirection = RadiobuttonGroupDirection;
   confirmDialogOpen = false;
+  today = new Date();
   private _error$ = new BehaviorSubject<CustomError>(null);
   error$: Observable<CustomError> = this._error$.asObservable();
   private _lastSubmittedGP$ = new BehaviorSubject<Date>(null);
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 5753a14..824d050 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
@@ -6,26 +6,20 @@
     reportTitle="Avvikelserapport (frånvaro)"
   >
     <div class="franvaro-report" *ngIf="currentGenomforandeReferens$ | async as genomforandeReferens">
-      <ng-container *ngIf="maxDate < avrop.startDate; else reportRef">
+      <div class="franvaro-report__warning" *ngIf="maxDate < avrop.startDate; else reportRef">
         <digi-notification-alert af-variation="warning" af-heading="Kan inte skapa Avvikelserapport (frånvaro)">
           <p>Det går inte att rapportera frånvaro eftersom tjänsten inte har startat ännu.</p>
         </digi-notification-alert>
 
-        <!--        TODO: add spacing-->
         <msfa-back-link [route]="['../']">Tillbaka till deltagaren</msfa-back-link>
-      </ng-container>
+      </div>
 
       <ng-template #reportRef>
         <div
           class="franvaro-report__confirmation"
           *ngIf="lastSubmittedFranvaroReport$ | async as lastSubmittedFranvaroReport; else formRef"
         >
-          <digi-notification-alert
-            class="franvaro-report__alert"
-            af-variation="success"
-            af-heading="Allt gick bra"
-            af-heading-level="h3"
-          >
+          <digi-notification-alert af-variation="success" af-heading="Allt gick bra" af-heading-level="h3">
             <p>Avvikelserapport (frånvaro) för deltagare {{avrop.fullName}} är nu inskickad till Arbetsförmedlingen.</p>
             <dl>
               <dt>Datum</dt>
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 ee27625..a47f9dc 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
@@ -5,6 +5,7 @@
   max-width: var(--digi--typography--text--max-width);
 
   &__confirmation,
+  &__warning,
   &__form {
     position: relative;
     display: flex;