<div>
  <div class="modal-header">
    <h3 class="modal-title" translate>{{ 'app.admin.invoices.payment.stripe_keys' }}</h3>
  </div>
  <div class="modal-body">
    <div class="alert alert-info" ng-bind-html="'app.admin.invoices.payment.stripe_keys_info_html' | translate"></div>
    <form name="stripeKeysForm">
      <div class="row m-md">
        <label for="stripe_public_key" class="control-label">{{ 'app.admin.invoices.payment.public_key' | translate }} *</label>
        <div class="input-group">
          <span class="input-group-addon"><i class="fa fa-info"></i></span>
          <input type="text"
                 class="form-control"
                 id="stripe_public_key"
                 ng-model="publicKey"
                 ng-model-options='{ debounce: 200 }'
                 ng-change='testPublicKey()'
                 required>
          <span class="input-group-addon" ng-class="{'label-success': publicKeyStatus, 'label-danger text-white': !publicKeyStatus}" ng-show="publicKeyStatus !== undefined && publicKey">
              <i class="fa fa-times" ng-show="!publicKeyStatus"></i>
              <i class="fa fa-check" ng-show="publicKeyStatus"></i>
            </span>
        </div>
      </div>
      <div class="row m-md">
        <label for="stripe_secret_key" class="control-label">{{ 'app.admin.invoices.payment.secret_key' | translate }} *</label>
        <div class="input-group">
          <span class="input-group-addon"><i class="fa fa-key"></i></span>
          <input type="text"
                 class="form-control"
                 id="stripe_secret_key"
                 ng-model="secretKey"
                 ng-model-options='{ debounce: 200 }'
                 ng-change='testSecretKey()'
                 required>
          <span class="input-group-addon" ng-class="{'label-success': secretKeyStatus, 'label-danger text-white': !secretKeyStatus}" ng-show="secretKeyStatus !== undefined && secretKey">
              <i class="fa fa-times" ng-show="!secretKeyStatus"></i>
              <i class="fa fa-check" ng-show="secretKeyStatus"></i>
            </span>
        </div>
      </div>
    </form>
  </div>
  <div class="modal-footer">
    <button class="btn btn-warning" ng-click="ok()" ng-disabled="stripeKeysForm.$invalid" translate>{{ 'app.shared.buttons.confirm' }}</button>
    <button class="btn btn-default" ng-click="cancel()" translate>{{ 'app.shared.buttons.cancel' }}</button>
  </div>
</div>
