<div class="col-md-9 col-12 p-0">
    <!-- Adjust column size based on screen width -->
    <!--=========== Source VMs Page=================== -->
    <div class="main-form active" id="incoming-sourceOutMig">
        <div class="font-weight-bold p-2 border-bottom">
            <label class="pr-2 m-0">Destination Site</label>
            <select class="line-select" style="width: 150px;">
                <option value="">avmzone1</option>
                <option value="">avmzone1vcf</option>
                <option value="">avmzone3vcf</option>
            </select>
        </div>
        <div class="m-3">
            <div class="table-responsive scroll-widget">
                <div id="data_table_s3_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                    <div class="row">
                        <div class="col-sm-12 col-md-6">
                            <div class="dataTables_length" id="data_table_s3_length">
                                <label>Show
                                    <select name="data_table_s3_length" aria-controls="data_table_s3" class="custom-select custom-select-sm form-control form-control-sm" style="width: 70px;">
                                        <option value="10">10</option>
                                        <option value="25">25</option>
                                        <option value="50">50</option>
                                        <option value="100">100</option>
                                    </select> entries
                                </label>
                            </div>
                        </div>
                        <div class="col-sm-12 col-md-6 py-2 text-right">
                            <a href="" class="">&nbsp;<i class="fas fa-sync fa-rotate-90" style="color: #57ba4b;"></i>&nbsp;Refresh</a>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer" role="grid" aria-describedby="data_table_event_info">
                                <thead>
                                    <tr role="row">
                                        <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 10%;" aria-sort="ascending">
                                            <input type="checkbox" id="clr-form-control-239">
                                        </th>
                                        <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                            VM
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Encrypted</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            CPUs</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Memory</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            State</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr role="row" class="odd">
                                        <td><input type="checkbox" class="select-checkbox" id="clr-dg-row-cb28"></td>
                                        <td>abc123</td>
                                        <td>N/A</td>
                                        <td>1</td>
                                        <td>1.00 GB</td>
                                        <td><i class="fas fa-check-circle" style="color: #54b948;"></i> Ready</td>
                                    </tr>
                                    <tr role="row" class="odd">
                                        <td><input type="checkbox" class="select-checkbox" id="clr-dg-row-cb29"></td>
                                        <td>DevTestWin</td>
                                        <td>N/A</td>
                                        <td>2</td>
                                        <td>4.00 GB</td>
                                        <td><i class="fas fa-exclamation-triangle" style="color: #f2c973;"></i> Power Off</td>
                                    </tr>
                                </tbody>
                            </table>
                            <div id="" class="dataTables_processing card" style="display: none;">
                                Processing...
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12 col-md-5">
                            <div class="dataTables_info" id="data_table_s3_info" role="status" aria-live="polite">Showing 1 to 1 of 1 entries</div>
                        </div>
                        <div class="col-sm-12 col-md-7">
                            <div class="dataTables_paginate paging_simple_numbers" id="data_table_s3_paginate">
                                <ul class="pagination">
                                    <li class="paginate_button page-item previous disabled" id="data_table_s3_previous"><a href="#" aria-controls="data_table_s3" data-dt-idx="0" tabindex="0" class="page-link">Previous</a></li>
                                    <li class="paginate_button page-item active"><a href="#" aria-controls="data_table_s3" data-dt-idx="1" tabindex="0" class="page-link">1</a></li>
                                    <li class="paginate_button page-item next disabled" id="data_table_s3_next"><a href="#" aria-controls="data_table_s3" data-dt-idx="2" tabindex="0" class="page-link">Next</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="alert alert-warning-custom alert-warning-custom1 m-3 row" role="alert" style="display: none;">
            <div class="col-1">
                <i class="fas fa-exclamation-triangle py-3" style="color: #ad7600;font-size: 20px;"></i>
            </div>
            <div class="col">One or more of the selected VMs are powered off.<br>
                The replication traffic will not start until the VMs are powered on or the user synchronizes the replication manually.
            </div>
        </div>
    </div>
    <!--============ Destination VDC and Storage policy Page =================-->
    <div class="main-form" id="incoming-destinationOutMig" style="height: 60vh;overflow-y: auto;">
        <div class="font-weight-bold p-2 border-bottom">
            Select a virtual data center from avmzone1vcf to be used as replication target:
        </div>
        <div class="m-3">
            <div class="table-responsive scroll-widget mb-3">
                <div id="data_table_s3_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                    <div class="row">
                        <div class="col-sm-12 col-md-6">
                            <div class="dataTables_length" id="data_table_s3_length">
                                <label>Show
                                    <select name="data_table_s3_length" aria-controls="data_table_s3" class="custom-select custom-select-sm form-control form-control-sm">
                                        <option value="10">10</option>
                                        <option value="25">25</option>
                                        <option value="50">50</option>
                                        <option value="100">100</option>
                                    </select> entries
                                </label>
                            </div>
                        </div>
                        <div class="col-sm-12 col-md-6 py-2 text-right">
                            <a href="" class="">&nbsp;<i class="fas fa-sync fa-rotate-90" style="color: #57ba4b;"></i>&nbsp;Refresh</a>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table1" role="grid" aria-describedby="data_table_event_info">
                                <thead>
                                    <tr role="row">
                                        <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 10%;" aria-sort="ascending">
                                        </th>
                                        <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                            Name
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Used CPU</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Used memory</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Used storage</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            VMs</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Quota</th>
                                        <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                            Ongoing replications</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr role="row" class="odd">
                                        <td><input type="radio" id="clr-dg-row-rd50" checked></td>
                                        <td>ovdc-tn01-dr</td>
                                        <td>0 M</td>
                                        <td>0.00 B</td>
                                        <td>23.28 GB</td>
                                        <td>1</td>
                                        <td>Currently unavailable</td>
                                        <td>0</td>
                                    </tr>
                                    <tr role="row" class="odd">
                                        <td><input type="radio" id="clr-dg-row-rd34"></td>
                                        <td>ovdc-tn02-kub</td>
                                        <td>15000 M</td>
                                        <td>60.00 B</td>
                                        <td>0.00 GB</td>
                                        <td>0</td>
                                        <td>Currently unavailable</td>
                                        <td>0</td>
                                    </tr>
                                    <tr role="row" class="odd">
                                        <td><input type="radio" id="clr-dg-row-rd35"></td>
                                        <td>TN-0000-AR</td>
                                        <td>0 M</td>
                                        <td>0.00 B</td>
                                        <td>11.00 GB</td>
                                        <td>0</td>
                                        <td>100</td>
                                        <td>1</td>
                                    </tr>
                                </tbody>
                            </table>
                            <div id="" class="dataTables_processing card" style="display: none;">
                                Processing...
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12 col-md-5">
                            <div class="dataTables_info" id="data_table_s3_info" role="status" aria-live="polite">Showing 1 to 1 of 1 entries</div>
                        </div>
                        <div class="col-sm-12 col-md-7 text-right">
                            <a href=""><i class="fas fa-columns" style="color: #007bff;"></a></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="mb-3 p-2 bg-primary text-light font-weight-bold">
                Storage Policy
            </div>
            <b>Select the new storage policy placement for the recovered VMs</b>
            <i class="fas fa-info-circle px-2" style="color: #5aa6c9;" data-toggle="tooltip" data-placement="top" title="Storage policy encryption capability and VM/vApp encryption should match."></i>
            <div class="my-3">
                <div class="table-responsive scroll-widget">
                    <div id="data_table_s3_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                        <div class="row">
                            <div class="col-sm-12 col-md-6">
                                <div class="dataTables_length" id="data_table_s3_length">
                                    <label>Show
                                        <select name="data_table_s3_length" aria-controls="data_table_s3" class="custom-select custom-select-sm form-control form-control-sm">
                                            <option value="10">10</option>
                                            <option value="25">25</option>
                                            <option value="50">50</option>
                                            <option value="100">100</option>
                                        </select> entries
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12">
                                <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table2" role="grid" aria-describedby="data_table_event_info">
                                    <thead>
                                        <tr role="row">
                                            <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 10%;" aria-sort="ascending">
                                            </th>
                                            <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                                Name
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                                Encryption capability</th>
                                            <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                                Used</th>
                                            <th class="sorting" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending" style="width: 30%;">
                                                Limit</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr role="row" class="odd">
                                            <td><input type="radio" id="clr-dg-row-rd53" checked></td>
                                            <td>tenantdev-policy</td>
                                            <td>No</td>
                                            <td>23.28 GB</td>
                                            <td>200.00 GB</td>
                                        </tr>
                                    </tbody>
                                </table>
                                <div id="" class="dataTables_processing card" style="display: none;">
                                    Processing...
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 col-md-5">
                                <div class="dataTables_info" id="data_table_s3_info" role="status" aria-live="polite">Showing 1 to 1 of 1 entries</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--=========== Settings =================== -->
    <div class="main-form" id="incoming-settingsOutMig" style="height: 60vh;overflow-y: auto;">
        <h5 class="font-weight-bold p-2 border-bottom">Settings</h5>
        <div class="m-3">
            <div class="mb-2">
                <b>Compress replication traffic</b>
                <div class="d-flex">
                    <div class="switch_box box_1 pr-2">
                        <input type="checkbox" class="switch_1" name="compress" id="encryption_toggle">
                    </div>
                    <label for="" class="">
                        Compressing the data is a CPU-expensive operation and
                        should be enabled only if the transfer of compressed
                        data yields better throughput in environments with slow
                        and/or unstable network connectivity.
                    </label>
                </div>
            </div>
            <div class="mb-2">
                <b>Delay start synchronization</b>&nbsp;
                <i class="fas fa-info-circle px-2" style="color: #5aa6c9;" data-toggle="tooltip" data-placement="top" title="Enter the local time when to initiate the first synchronization."></i>
                <div class="d-flex">
                    <div class="switch_box box_1 pr-2">
                        <input type="checkbox" class="switch_1" name="schedule" id="schedule-toggle">
                    </div>
                    <label for="" class="">
                        Set time that is convenient for the first synchronization.
                    </label>
                </div>
                <input type="datetime-local" class="form-datetime-picker">
            </div>
            <div class="mb-3 p-2 bg-primary text-light font-weight-bold">
                VDC policy settings
            </div>
            <b>Select a VM placement and sizing policy to be applied to the recovered virtual machine.</b>
            <div class="p-3">
                <div class="row mb-3">
                    <label for="" class="col-4">
                        VDC VM placement policy
                    </label>
                    <select class="col-2 browser-default custom-select mr-3" style="width: 50px;" id="placementPolicy_select">
                        <option selected>None</option>
                    </select>
                </div>
                <div class="row">
                    <label for="" class="col-4">
                        VDC VM sizing policy
                    </label>
                    <select class="col-2 browser-default custom-select mr-3" style="width: 50px;" id="placementPolicy_select">
                        <option selected>None</option>
                    </select>
                </div>
            </div>
            <div class="mb-3 p-2 bg-primary text-light font-weight-bold">
                Advanced disk settings
            </div>
            <div class="mb-2">
                <b>Exclude disks</b>
                <div class="d-flex">
                    <div class="switch_box box_1 pr-2">
                        <input type="checkbox" class="switch_1" name="descs" id="discs-toggle">
                    </div>
                    <label for="" class="">
                        Save disk space on the target site by excluding disks that are not necessary.
                    </label>
                </div>
            </div>
            <div class="mb-2">
                <b>Configure Seed VMs</b>
                <div class="d-flex">
                    <div class="switch_box box_1 pr-2">
                        <input type="checkbox" class="switch_1" name="seed" id="seed-toggle">
                    </div>
                    <label for="" class="">
                        Use an older copy of the protected VMs on the target site to reduce the data traffic.
                    </label>
                </div>
            </div>
        </div>
    </div>
    <!--=========== Seed VM =================== -->
    <div class="main-form" id="incoming-seedOutMig">
        <div class="font-weight-bold p-2 border-bottom">
            The following VApps/VMs exist on the target site. If any of them is an older copy
            of the replicated ones, you can use it as a seed in order to avoid transferring
            large amounts of data over the network during the initial sync.
        </div>
        <div class="m-3">
            <div class="alert alert-warning-custom m-2 row" role="alert">
                <div class="col-1">
                    <i class="fas fa-exclamation-triangle py-3" style="color: #ad7600;font-size: 20px;"></i>
                </div>
                <div class="col">
                    Selecting a seed will discard previously selected storage profile and use the one in the seed.
                </div>
            </div>
            <div class="text-right">
                <a href="" class="pr-0">
                    &nbsp;<i class="fas fa-sync fa-rotate-90" style="color: #57ba4b;"></i>&nbsp;Refresh
                </a>
            </div>
            <div class="row">
                <div class="col-sm-4">
                    <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table1" role="grid" aria-describedby="data_table_event_info">
                        <thead>
                            <tr role="row">
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    VM
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr role="row" class="odd">
                                <td>
                                    <input type="radio" name="sourceRadioGroup" id="clr-form-control-249" checked>
                                    <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                        <path d="M11,5H25V8h2V5a2,2,0,0,0-2-2H11A2,2,0,0,0,9,5v6.85h2Z"></path>
                                        <path d="M30,10H17v2h8v6h2V12h3V26H22V17a2,2,0,0,0-2-2H6a2,2,0,0,0-2,2V31a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V28h8a2,2,0,0,0,2-2V12A2,2,0,0,0,30,10ZM6,31V17H20v9H16V20H14v6a2,2,0,0,0,2,2h4v3Z"></path>
                                    </svg>
                                    abc123
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div id="" class="dataTables_processing card" style="display: none;">
                        Processing...
                    </div>
                </div>
                <div class="col-sm-8">
                    <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table1" role="grid" aria-describedby="data_table_event_info">
                        <thead>
                            <tr role="row">
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    Seed
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr role="row" class="odd">
                                <td>
                                    <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                        <polygon points="28 22 30 22 30 30 22 30 22 28 20 28 20 32 32 32 32 20 28 20 28 22"></polygon>
                                        <polygon points="14 30 6 30 6 22 8 22 8 20 4 20 4 32 16 32 16 28 14 28 14 30"></polygon>
                                        <polygon points="8 14 6 14 6 6 14 6 14 8 16 8 16 4 4 4 4 16 8 16 8 14"></polygon>
                                        <polygon points="20 4 20 8 22 8 22 6 30 6 30 14 28 14 28 16 32 16 32 4 20 4"></polygon>
                                        <rect x="11" y="11" width="6" height="6"></rect>
                                        <rect x="19" y="11" width="6" height="6"></rect>
                                        <rect x="11" y="19" width="6" height="6"></rect>
                                        <rect x="19" y="19" width="6" height="6"></rect>
                                    </svg>
                                    ttt-f19111ec-316d-4bdd-bf73-99458522c08c<br>
                                    <input type="radio" id="clr-form-control-251" checked>
                                    <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                        <path d="M11,5H25V8h2V5a2,2,0,0,0-2-2H11A2,2,0,0,0,9,5v6.85h2Z"></path>
                                        <path d="M30,10H17v2h8v6h2V12h3V26H22V17a2,2,0,0,0-2-2H6a2,2,0,0,0-2,2V31a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V28h8a2,2,0,0,0,2-2V12A2,2,0,0,0,30,10ZM6,31V17H20v9H16V20H14v6a2,2,0,0,0,2,2h4v3Z"></path>
                                    </svg>
                                    ttt
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div id="" class="dataTables_processing card" style="display: none;">
                        Processing...
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--=========== Replicated Disks =================== -->
    <div class="main-form" id="incoming-disksOutMig">
        <div class="font-weight-bold p-2 border-bottom">
            Choose which disks of the selected VMs/VApps should be replicated
        </div>
        <div class="m-3">
            <div class="row">
                <div class="col-sm-4">
                    <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table1" role="grid" aria-describedby="data_table_event_info">
                        <thead>
                            <tr role="row">
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    VM
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr role="row" class="odd">
                                <td>
                                    <input type="radio" id="select-vm-radio-ttt" checked name="selectedVmId">
                                    <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                        <path d="M11,5H25V8h2V5a2,2,0,0,0-2-2H11A2,2,0,0,0,9,5v6.85h2Z"></path>
                                        <path d="M30,10H17v2h8v6h2V12h3V26H22V17a2,2,0,0,0-2-2H6a2,2,0,0,0-2,2V31a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V28h8a2,2,0,0,0,2-2V12A2,2,0,0,0,30,10ZM6,31V17H20v9H16V20H14v6a2,2,0,0,0,2,2h4v3Z"></path>
                                    </svg>
                                    abc123
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div id="" class="dataTables_processing card" style="display: none;">
                        Processing...
                    </div>
                </div>
                <div class="col-sm-8">
                    <table id="data_table_event" class="table table-striped table-bordered nowrap dataTable no-footer radio-table1" role="grid" aria-describedby="data_table_event_info">
                        <thead>
                            <tr role="row">
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    <input type="checkbox" id="">
                                </th>
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    Key
                                </th>
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    Label
                                </th>
                                <th class="sorting_asc" tabindex="0" aria-controls="data_table_event" rowspan="1" colspan="1" aria-label="Name: activate to sort column descending" style="width: 30%;" aria-sort="ascending">
                                    Capacity
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr role="row" class="odd">
                                <td><input type="checkbox" class="select-checkbox" id="clr-dg-row-cb58"></td>
                                <td>2000</td>
                                <td>Hard disk 1</td>
                                <td>10.00 GB</td>
                            </tr>
                        </tbody>
                    </table>
                    <div id="" class="dataTables_processing card" style="display: none;">
                        Processing...
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--=========== Ready to complete =================== -->
    <div class="main-form" id="incoming-completeOutMig" style="height: 60vh;overflow-y: auto;">
        <h5 class="font-weight-bold p-2 border-bottom">Ready to Complete</h5>
        <div class="m-3">
            <p>Verify the selected settings before clicking Finish:</p>
            <table class="tg" style="table-layout: fixed; width: 539px">
                <colgroup>
                    <col style="width: 270px">
                    <col style="width: 269px">
                </colgroup>
                <tbody>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">VMs</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">
                                <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                    <path d="M11,5H25V8h2V5a2,2,0,0,0-2-2H11A2,2,0,0,0,9,5v6.85h2Z"></path>
                                    <path d="M30,10H17v2h8v6h2V12h3V26H22V17a2,2,0,0,0-2-2H6a2,2,0,0,0-2,2V31a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V28h8a2,2,0,0,0,2-2V12A2,2,0,0,0,30,10ZM6,31V17H20v9H16V20H14v6a2,2,0,0,0,2,2h4v3Z"></path>
                                </svg>
                                abc123
                            </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Source site</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">
                                <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details-source">
                                    <path d="M31.25,7.4a43.79,43.79,0,0,1-6.62-2.35,45,45,0,0,1-6.08-3.21L18,1.5l-.54.35a45,45,0,0,1-6.08,3.21A43.79,43.79,0,0,1,4.75,7.4L4,7.59v8.34c0,13.39,13.53,18.4,13.66,18.45l.34.12.34-.12c.14,0,13.66-5.05,13.66-18.45V7.59ZM30,15.93c0,11-10,15.61-12,16.43-2-.82-12-5.44-12-16.43V9.14a47.54,47.54,0,0,0,6.18-2.25,48.23,48.23,0,0,0,5.82-3,48.23,48.23,0,0,0,5.82,3A47.54,47.54,0,0,0,30,9.14Z"></path>
                                    <path d="M10.88,16.87a1,1,0,0,0-1.41,1.41l6,6L26.4,13.77A1,1,0,0,0,25,12.33l-9.47,9.19Z"></path>
                                </svg>
                                organization-developer@avmzone3vcf</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Source VDC</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">
                                <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                    <path d="M31,8H23v2h8V31H23v2H33V10A2,2,0,0,0,31,8Z"></path>
                                    <path d="M19.88,3H6.12A2.12,2.12,0,0,0,4,5.12V33H22V5.12A2.12,2.12,0,0,0,19.88,3ZM20,31H17V28H9v3H6V5.12A.12.12,0,0,1,6.12,5H19.88a.12.12,0,0,1,.12.12Z"></path>
                                    <rect x="8" y="8" width="2" height="2"></rect>
                                    <rect x="12" y="8" width="2" height="2"></rect>
                                    <rect x="16" y="8" width="2" height="2"></rect>
                                    <rect x="8" y="13" width="2" height="2"></rect>
                                    <rect x="12" y="13" width="2" height="2"></rect>
                                    <rect x="16" y="13" width="2" height="2"></rect>
                                    <rect x="8" y="18" width="2" height="2"></rect>
                                    <rect x="12" y="18" width="2" height="2"></rect>
                                    <rect x=" 16" y="18" width="2" height="2"></rect>
                                    <rect x=" 8" y="23" width="2" height="2"></rect>
                                    <rect x=" 12" y="23" width="2" height="2"></rect>
                                    <rect x=" 16" y="23" width="2" height="2"></rect>
                                    <rect x=" 23" y="13" width="2" height="2"></rect>
                                    <rect x=" 27" y="13" width="2" height="2"></rect>
                                    <rect x=" 23" y="18" width="2" height="2"></rect>
                                    <rect x=" 27" y="18" width="2" height="2"></rect>
                                    <rect x=" 23" y="23" width="2" height="2"></rect>
                                    <rect x=" 27" y="23" width="2" height="2"></rect>
                                </svg>
                                20ac7ba5-dd36-449b-88fc-7cedf5471408</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Destination organization</span></td>
                        <td class="tg-0lax">
                            <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                <path d="M27.14,33H10.62C5.67,33,1,28.19,1,23.1a10,10,0,0,1,8-9.75,10.19,10.19,0,0,1,20.33,1.06A10.07,10.07,0,0,1,29,16.66a8.29,8.29,0,0,1,6,8C35,29.1,31.33,33,27.14,33ZM19.09,6.23a8.24,8.24,0,0,0-8.19,8l0,.87-.86.1A7.94,7.94,0,0,0,3,23.1c0,4,3.77,7.9,7.62,7.9H27.14C30.21,31,33,28,33,24.65a6.31,6.31,0,0,0-5.37-6.26l-1.18-.18.39-1.13A8.18,8.18,0,0,0,19.09,6.23Z"></path>
                            </svg>
                            organization-developer@avmzone1vcf
                        </td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Destination VDC</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">
                                <svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="icon-details">
                                    <path d="M31,8H23v2h8V31H23v2H33V10A2,2,0,0,0,31,8Z"></path>
                                    <path d="M19.88,3H6.12A2.12,2.12,0,0,0,4,5.12V33H22V5.12A2.12,2.12,0,0,0,19.88,3ZM20,31H17V28H9v3H6V5.12A.12.12,0,0,1,6.12,5H19.88a.12.12,0,0,1,.12.12Z"></path>
                                    <rect x="8" y="8" width="2" height="2"></rect>
                                    <rect x="12" y="8" width="2" height="2"></rect>
                                    <rect x="16" y="8" width="2" height="2"></rect>
                                    <rect x="8" y="13" width="2" height="2"></rect>
                                    <rect x="12" y="13" width="2" height="2"></rect>
                                    <rect x="16" y="13" width="2" height="2"></rect>
                                    <rect x="8" y="18" width="2" height="2"></rect>
                                    <rect x="12" y="18" width="2" height="2"></rect>
                                    <rect x=" 16" y="18" width="2" height="2"></rect>
                                    <rect x=" 8" y="23" width="2" height="2"></rect>
                                    <rect x=" 12" y="23" width="2" height="2"></rect>
                                    <rect x=" 16" y="23" width="2" height="2"></rect>
                                    <rect x=" 23" y="13" width="2" height="2"></rect>
                                    <rect x=" 27" y="13" width="2" height="2"></rect>
                                    <rect x=" 23" y="18" width="2" height="2"></rect>
                                    <rect x=" 27" y="18" width="2" height="2"></rect>
                                    <rect x=" 23" y="23" width="2" height="2"></rect>
                                    <rect x=" 27" y="23" width="2" height="2"></rect>
                                </svg>
                                ovdc-tn01-dr
                            </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Storage policy</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">tenantdev-policy</span></td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">VDC VM sizing policy</span></td>
                        <td class="tg-0lax">None</td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">VDC VM placement policy</span></td>
                        <td class="tg-0lax">None</td>
                    </tr>
                    <tr>
                        <td class="tg-1wig"><span style="color:#000;background-color:#FFF">Sync time</span></td>
                        <td class="tg-0lax"><span style="color:#000;background-color:#FFF">No delay</span></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>



</div>