How to open booking form in popup (modal window) ?

For ability to open the booking form in popup window (in paid versions of Booking Calendar), please follow these steps:
1) Create new page (or edit existing page) and add the "Custom HTML block" to the page.
Then insert the code similar to this:

<script src="https://server.com/wp-content/plugins/booking/assets/libs/ui/_out/dropdown_modal.js"></script>
<a  href="javascript:void(0)" onclick="javascript:jQuery('.bookingFormModal').wpbc_my_modal('show');"
    class="wp-element-button">Booking</a>
[booking resource_id=1]

Where [booking type=1] - shortcode for your booking form. Please check more here.

Also you need to define correct URL to dropdown_modal.js script.

<script src="https://server.com/wp-content/plugins/booking/assets/libs/ui/_out/dropdown_modal.js"></script>

You need to replace server.com to your website DNS. And if you are using some paid version of Booking Calendar, then you need to replace /booking/ to correct Booking Calendar Folder. Usually it's similar to this: /booking.bs.10.0/

2) Now open the WP Booking Calendar > Settings > Booking Form page and configure the booking form similar to this:

<div class="wpdevelop">
    <div class="modal bookingFormModal" tabindex="-1" role="dialog" style="display:none;z-index:9999999;">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button><h4 class="modal-title">Booking Form</h4></div>
              <div class="modal-body">
<!-- Start Booking form configuration -->				  </p>
<p>[calendar]
<div class="standard-form">
     <p>First Name (required):<br />[text* name] </p>
     <p>Last Name (required):<br />[text* secondname] </p>
     <p>Email (required):<br />[email* email] </p>
     <p>Phone:<br />[text phone] </p>
     <p>Adults:<br />[select visitors "1" "2" "3" "4"]</p>
     <p>Children:<br />[select children "0" "1" "2" "3"]</p>
     <p>Details:<br /> [textarea details] </p>
     <p>[checkbox* term_and_condition use_label_element "I Accept term and conditions"] </p>
     <p>[captcha]</p>
     <p>[submit class:btn "Send"]</p>
</div></p>
<p> <!-- End configuration  of the booking form -->
             </div>
            </div>
        </div>
    </div>
</div>
<style type="text/css"> .wpdevelop .modal { overflow-y: scroll; } </style>

3) The result will be like this:

Such configuration possible in the Booking Calendar updates 9.8 or newer.