<div class="d-flex" style="gap: 20px">
    <div class="input text flex-col w-100">
        <label class="tx-14" translate>E-mail address</label>
        <input class="mb-0" type="text" ng-model="alert.Recipient" placeholder="{{'Enter mail here' | translate}}" style="min-width: 200px;" />
        <label class="error tx-14" ng-show="emailIsValid != true" translate>Mail is not valid</label>
    </div>
    <div class="input text flex-col w-100">
        <label class="tx-14" translate>Notify for</label>
        <ul class="select-notification-levels pt-2">
            <li class="mb-0">
                <label class="checkbox-level checkbox-all-levels">
                    <input type="checkbox" ng-model="AllLevelsChecked" ng-change="SelectRemoveAll()">
                    <span class="tx-14">{{ 'All' | translate }}</span>
                </label>
            </li>
            <li class="mb-0" ng-repeat="l in Levels track by $index">
                <label class="checkbox-level checkbox-{{ l.label }}-level">
                    <input type="checkbox" ng-model="l.checked" ng-change="CheckIfAllSelected()">
                    <span class="tx-14">{{ l.label | translate }}</span>
                </label>
            </li>
        </ul>
        <label class="error tx-14" ng-show="levelIsValid != true" translate>You must select at least one notification level</label>
    </div>
</div>
