<section class="dialog">
    <div
        [translate]="!isInConfiguration ? translations.title.beforeConfiguration : translations.title[selectedOption]"
        class="dialog-header heading-l"
    ></div>

    <div class="dialog-content">
        <form *ngIf="!isInConfiguration" [formGroup]="form">
            <iqser-details-radio [options]="options" formControlName="option"></iqser-details-radio>
        </form>
        <ng-container *ngIf="isInConfiguration">
            {{ 'digital-signature-dialog.upload-warning-message' | translate }}

            <redaction-pkcs-signature-configuration
                *ngIf="selectedOption === digitalSignatureOptions.PKCS"
            ></redaction-pkcs-signature-configuration>
            <redaction-kms-signature-configuration
                *ngIf="selectedOption === digitalSignatureOptions.KMS"
            ></redaction-kms-signature-configuration>
        </ng-container>
    </div>

    <div class="dialog-actions">
        <ng-container *ngIf="!isInConfiguration">
            <iqser-icon-button
                buttonId="configure-digital-certificate-modal-continue-btn"
                (action)="toggleIsInConfiguration()"
                [label]="'digital-signature-dialog.actions.continue' | translate"
                [type]="iconButtonTypes.primary"
            ></iqser-icon-button>
            <div
                id="configure-digital-certificate-modal-cancel-btn"
                [translate]="'digital-signature-dialog.actions.cancel'"
                class="all-caps-label cancel"
                mat-dialog-close
            ></div>
        </ng-container>
        <ng-container *ngIf="isInConfiguration">
            <iqser-icon-button
                buttonId="configure-digital-certificate-modal-save-btn"
                (action)="save()"
                [disabled]="disabled"
                [label]="'digital-signature-dialog.actions.save' | translate"
                [type]="iconButtonTypes.primary"
            ></iqser-icon-button>
            <div
                id="configure-digital-certificate-modal-back-btn"
                (click)="toggleIsInConfiguration()"
                [translate]="'digital-signature-dialog.actions.back'"
                class="all-caps-label cancel"
            ></div>
        </ng-container>
    </div>

    <iqser-circle-button
        buttonId="configure-digital-certificate-modal-close-btn"
        (action)="close()"
        class="dialog-close"
        icon="iqser:close"
    ></iqser-circle-button>
</section>
