<form [formGroup]="formGroup" [bitSubmit]="submit" class="tw-h-full tw-flex tw-flex-col">
  <bit-dialog dialogSize="default" [loading]="loading">
    <ng-container bitDialogTitle>
      <span class="tw-flex tw-items-center tw-gap-2">
        {{ policy.name | i18n }}
        @if (isPolicyEnabled) {
          <span bitBadge variant="success">{{ "on" | i18n }}</span>
        }
      </span>
    </ng-container>
    <ng-container bitDialogContent>
      <div *ngIf="loading">
        <i
          class="bwi bwi-spinner bwi-spin tw-text-muted"
          title="{{ 'loading' | i18n }}"
          aria-hidden="true"
        ></i>
        <span class="tw-sr-only">{{ "loading" | i18n }}</span>
      </div>
      <div [hidden]="loading">
        @if (policy.showDescription) {
          <p bitTypography="body1">{{ policy.description | i18n }}</p>
        }
        <ng-template #policyForm></ng-template>
      </div>
    </ng-container>
    <ng-container bitDialogFooter>
      <button
        bitButton
        buttonType="primary"
        [disabled]="saveDisabled$ | async"
        bitFormButton
        type="submit"
      >
        {{ "save" | i18n }}
      </button>
      <button bitButton buttonType="secondary" bitDialogClose type="button">
        {{ "cancel" | i18n }}
      </button>
    </ng-container>
  </bit-dialog>
</form>
