.bw-modal-content {
  display: none;
  padding: 10px;
  border-radius: 6px;
  background-color: #f1f1f1;
  position: absolute;

  &.bw-modal-show {
    display: block;
    z-index: 100001;
  }

  .bw-modal-actions {
    margin-top: 10px;
  }
}

.set-modal-dimensions(@width, @height) {
  .bw-modal-content {
    width: @width;
    height: @height;
    top: ~"calc(50% - @{height}/2)";
    left: ~"calc(50% - @{width}/2)";
  }
}

#bw-modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: #000;
  z-index: 100000;
  pointer-events: none;
  transition: opacity 0.3s;

  &.bw-modal-show {
    opacity: 0.6;
    pointer-events: auto;
  }
}

@pairing-update-notice-modal-width: 300px;
@pairing-update-notice-modal-height: 130px;
#bw-pairing-update-modal {
  .set-modal-dimensions(@pairing-update-notice-modal-width, @pairing-update-notice-modal-height);

  .bw-modal-content {
    input {
      max-width: 40px;

      &:nth-child(3) {
        margin-right: 20px;
      }
    }
  }
}