	   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" />

    <link href="{{ asset('')}}assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="{{ asset('')}}assets/plugins/perfect-scrollbar/dist/css/perfect-scrollbar.min.css" rel="stylesheet">
    <!-- This page CSS -->
    <!--c3 CSS -->
    
    <link href="{{ asset('')}}assets/plugins/c3-master/c3.min.css" rel="stylesheet">
    <!-- Custom CSS -->
    <link href="{{ asset('')}}assets/css/style.css" rel="stylesheet">
    <!-- Dashboard 1 Page CSS -->
    <link href="{{ asset('')}}assets/css/legacy.css" rel="stylesheet">
    <!-- You can change the theme colors from here -->
    <link href="{{ asset('')}}assets/css/colors/colors.css" id="themes" rel="stylesheet">
    <!--Toaster Popup message CSS -->
    <link href="{{ asset('')}}assets/plugins/toast-master/css/jquery.toast.css" rel="stylesheet">
    <link href="{{ asset('')}}assets/plugins/bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet">

    <link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">





    <script src="{{ asset('')}}assets/plugins/moment/moment.js"></script>
    <script src="{{ asset('')}}assets/js/sximo.min.js"></script>
    <!-- Bootstrap popper Core JavaScript -->
    <script src="{{ asset('')}}assets/plugins/bootstrap/js/popper.min.js"></script>
    <script src="{{ asset('')}}assets/plugins/bootstrap/js/bootstrap.min.js"></script>
    
    <!-- slimscrollbar scrollbar JavaScript -->
    <script src="{{ asset('')}}assets/js/perfect-scrollbar.jquery.min.js"></script>
    <!--Wave Effects -->
    <script src="{{ asset('')}}assets/js/waves.js"></script>
    <!--Menu sidebar -->
    <script src="{{ asset('')}}assets/js/sidebarmenu.js"></script>
<!--stickey kit -->
    <script src="{{ asset('')}}assets/plugins/sticky-kit-master/dist/sticky-kit.min.js"></script>
    <script src="{{ asset('')}}assets/plugins/sparkline/jquery.sparkline.min.js"></script>
    <!--Custom JavaScript -->
    <script src="{{ asset('')}}assets/js/custom.min.js"></script>
   
    <!--c3 JavaScript 
    <script src="{{ asset('')}}assets/plugins/d3/d3.min.js"></script>
    <script src="{{ asset('')}}assets/plugins/c3-master/c3.min.js"></script> --> 
     <script src="{{ asset('')}}assets/js/sximo5.js"></script>
     <script src="{{ asset('')}}assets/plugins/styleswitcher/jQuery.style.switcher.js"></script>
    <!-- Chart JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
    
    
    <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
    <!-- Highcharts JS -->
    <script src="https://code.highcharts.com/highcharts.js"></script>
    <script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>
<script src="https://code.highcharts.com/modules/no-data-to-display.js"></script>
<script src="https://code.highcharts.com/modules/boost.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/offline-exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>
  <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
    <script src="https://unpkg.com/leaflet-omnivore@0.3.4/leaflet-omnivore.min.js"></script>

     <style>
      html{
        background: #ffffff00;
      }
      body{
        background: #ffffff00;
      }
      </style>
      <body>
    {!!
		$content
    !!}

    <div class="modal" id="sximo-modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1">
    <div class="modal-dialog" role="document" style="max-width: fit-content;">
        <div class="modal-content" style="border-radius: 16px; box-shadow: 0 8px 32px rgba(60,180,75,0.25); border: none;">
            <div class="modal-header bg-gradient-success" style="cursor: move; border-top-left-radius: 16px; border-top-right-radius: 16px; background: linear-gradient(90deg, #43e97b 0%, #38f9d7 100%); color: #fff;">
                <div style="display: flex; align-items: center; width: 100%;">
                    <i class="fa fa-envelope-open-text fa-lg mr-2"></i>
                    <h4 class="modal-title mb-0" id="exampleModalLabel1" style="flex: 1;">New Message</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: #fff; opacity: 0.8; font-size: 1.5rem;">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            </div>
            <div class="modal-body" id="sximo-modal-content" style="background: #f8fff8; border-bottom-left-radius: 16px; border-bottom-right-radius: 16px;">
                <!-- Modal content goes here -->
            </div>
        </div>
    </div>
</div>


<div class="modal" id="sximo-modal2" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel2">
    <div class="modal-dialog" role="document" style="max-width: fit-content;">
        <div class="modal-content" style="border-radius: 18px; box-shadow: 0 10px 36px rgba(255,127,80,0.25); border: none;">
            <div class="modal-header" style="cursor: move; border-top-left-radius: 18px; border-top-right-radius: 18px; background: linear-gradient(90deg, #ff9966 0%, #ff5e62 100%); color: #fff;">
                <div style="display: flex; align-items: center; width: 100%;">
                    <i class="fa fa-paper-plane fa-lg mr-2"></i>
                    <h4 class="modal-title mb-0" id="exampleModalLabel2" style="flex: 1;">New Message</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: #fff; opacity: 0.8; font-size: 1.5rem;">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            </div>
            <div class="modal-body" id="sximo-modal-content2" style="background: #fff8f4; border-bottom-left-radius: 18px; border-bottom-right-radius: 18px;">
                <!-- Modal content goes here -->
            </div>
        </div>
    </div>
</div>

<script>
function SximoModal( url , title)
{
	
  if (window.parent && window.parent !== window) {
    window.parent.$('#sximo-modal-content').html(' ....Loading content , please wait ...');
    window.parent.$('.modal-title').html(title);
    window.parent.$('#sximo-modal-content').load(url, function () {});
    window.parent.$('#sximo-modal').modal('show');
  } else {
    $('#sximo-modal-content').html(' ....Loading content , please wait ...');
    $('.modal-title').html(title);
    $('#sximo-modal-content').load(url, function () {});
    $('#sximo-modal').modal('show');
  }
}

function SximoModal2( url , title){
if (window.parent && window.parent !== window) {
  window.parent.$('#sximo-modal-content2').html(' ....Loading content , please wait ...');
  window.parent.$('.modal-title2').html(title);
  window.parent.$('#sximo-modal-content2').load(url, function () {});
  window.parent.$('#sximo-modal2').modal('show');
} else {
  $('#sximo-modal-content2').html(' ....Loading content , please wait ...');
  $('.modal-title2').html(title);
  $('#sximo-modal-content2').load(url, function () {});
  $('#sximo-modal2').modal('show');
}
}


</script>




