<div class="slutredovisning-report-form-step0-still-unemployed">
  <div class="slutredovisning-report-form-step0-still-unemployed__form">
    <div>
      <digi-form-fieldset
        af-legend="Anledning till att arbetssökanden under tjänstens gång inte har nått målet"
        af-name="stillUnemployed"
        af-form="report-form"
        [formGroup]="stillUnemployedReasonFormControl"
      >
        <ui-checkbox
          *ngFor="let stillUnemployedReasonOption of stillUnemployedReasonOptions"
          [formControl]="stillUnemployedReasonFormControl.get(stillUnemployedReasonOption.formControlName)"
          [uiLabel]="stillUnemployedReasonOption.label"
          [uiInvalid]="(stillUnemployedReasonFormControl?.touched || this.shouldValidate) && formGroup?.errors?.atLeastOneSelected"
        ></ui-checkbox>
      </digi-form-fieldset>
      <div aria-atomic="true" role="alert">
        <digi-form-validation-message
          *ngIf="(stillUnemployedReasonFormControl?.touched || this.shouldValidate) && formGroup?.errors?.atLeastOneSelected"
          af-variation="error"
          >{{formGroup?.errors?.atLeastOneSelected}}</digi-form-validation-message
        >
      </div>
    </div>

    <ui-textarea
      *ngIf="showExplanationTextArea"
      [formControl]="stillUnemployedReasonDescriptionFormControl"
      uiLabel="Beskrivning av Annat"
      [uiValidationMessage]="formGroup?.errors?.needDescriptionOfOther"
      [uiAnnounceIfOptional]="false"
      [uiMaxLength]="200"
      [uiInvalid]="(stillUnemployedReasonDescriptionFormControl?.touched || this.shouldValidate) && formGroup.errors?.needDescriptionOfOther"
    ></ui-textarea>
  </div>
</div>
