<?php
 $fields = $model->detailArray();
 ?>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js"></script>
<script>
$(function(){
const observer = lozad(); // lazy loads elements with default selector as '.lozad'
observer.observe();
})
</script>
<style>
   .modal-open .modal {
       z-index: 111111;
} 
#send-enquiry-left-block-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;    overflow: hidden;
}.main-enquiry-form  input,.main-enquiry-form  textarea { 
    border: 1px solid #d1d2d3;
    padding: 10px;width:100%;
}.main-enquiry-form  textarea{
    height: 196px;
} .icon-cancel {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #eee;
    min-width: 30px;
    text-align: center;
    font-size: 25px;
    line-height: 1;
    border-radius: 5px;
    color: red;
    cursor: pointer;
}#send-enquiry-form-wrapper legend{
    font-weight: 800;
}#send-enquiry-form-wrapper .button-primary {
    background: #102448 none repeat scroll 0 0;
    box-shadow: 0 2px 0 #cc7600;
    color: #fff;
    padding-left: 30px;
    padding-right: 30px;
}#send-enquiry-form-wrapper .errorMessage {
    text-align: left;
    color: orange;
    font-weight: normal;
}html .breadcrumbs { 
    text-transform: initial; 
    z-index: 11111111111;
}.contact-btn { 
    max-width: 1024px; 
}html .video-container3 { 
    max-width: 100%; 
    margin-bottom: 40px;
}html .border-title { 
    border: 0;
    padding: 0;
    font-size: 24px;    text-transform: initial;
}
#send-enquiry-form-wrapper p.location{     font-weight: 600;    font-size: 16px;}
.main-enquiry-form fieldset{ display:flex; margin-left:-15px; margin-right:-15px;}.main-enquiry-form fieldset .division{ flex:1;padding: 10px;width:100%; }
.main-enquiry-form .pure-control-group{ margin-bottom:15px;}
#send-enquiry-left-block { display:flex; margin-bottom:15px; }#send-enquiry-left-block-content-wrapper{ padding-left:15px; }
#send-enquiry-left-block-img-wrapper{ width:150px;height:150px; border-radius:10px;}.send-enquiry-left-block-img-wrapper img{ width:100%;height:100%;object-fit:cover; }
.payment-list li div.dec {
    
    text-align: left;
    background-color: #F2F2F2;
    -webkit-box-shadow: inset 0 -1px 0 0 #000000;
    box-shadow: inset 0 -1px 0 0 #000000;
    margin-bottom: 20px;
     width:100%; margin-bottom:0px; 
    float: left;color:#333;
    padding: 15px 25px;
}.payment-list li{ padding-left:0px; margin-bottom:15px; }
.payment-list li:nth-child(2n+1){padding-right:15px;}
.payment-list li::before {
  
    content: unset; 
}
    .video-container3 {
    position: relative;
    padding-bottom: 56.25%;
    margin-top: 15px;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}.video-container3 iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}.page-banner { 
    padding: 62px;
}
#mstcky {
    position: sticky;
    position: -webkit-sticky;
    top: 105px;
    background: #eee;
    z-index: 111;
}body{
    overflow: initial;
}
</style>
<div class="section-dark page-banner">
      <div class="full-block page-banner-image" ></div>
      <div class="full-block overlay"></div>
     </div>
      <div class="breadcrumbs">
        <div class="container">
          <div class="row">
            <div class="col col-sm-12"> <span>
				<span><a href="<?php echo $this->app->createUrl('site/index');?>">Home</a> <i class="fa fa-angle-right"></i> 
				<span><a href="<?php echo $this->app->createUrl('off-plan-properties');?>">Off Plan Properties</a> <i class="fa fa-angle-right"></i>
			 
				 <span class="breadcrumb_last" aria-current="page"><?php echo $model->adTitle;?></span></span></span></span></span></div>
          </div>
        </div>
      </div>
      
  <div>
      <?php 
          echo '<div class="clearfix"></div>';
    echo '<div style="position:relative;margin-top:0px" class="mb-0  "  >';
    $this->renderPartial('_detail_banner_project');
    echo '</div>';
    echo '<div class="clearfix"></div>';
      ?>
  </div>
  <div  id="mstcky">
       <div class="container">
            <div class="  contact-btn">
                <style>
                    .btnPrimaryGreen {
    background-color: #102448;
    border: none;
    border-radius: 5px;
    box-shadow: none!important;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    font-weight: 900;
    outline: none!important;
    padding: 1rem 2.5rem;
    text-align: center;
    text-decoration: none!important;
    height: 48px;
    padding-top: 0;
    padding-bottom: 0;
}.contact-btn {
    display: flex;     flex-direction: row;
    flex-wrap: nowrap;    padding: 15px 0px;
}.btnPrimaryGreen.whitein {
    background-color: #fff;
    color: initial;
    border: 1px solid #959199;
}   .sharethis {  max-width: 234px;    margin-left: auto; }  .btnPrimaryGreen.whitein.sharethis { background-color:#eee;    font-weight: 500;    font-size: 16px; }
      .call-clixk {
    position: absolute;
    background: #fff;
    padding: 20px 10px;
 box-shadow:0 1px 20px 0 rgba(0, 0, 0, 0.1);border-radius:32px
    border-radius: 10px;
    z-index: 111;
    top: 64px;
    min-width: 320px;
    left: -41px;padding-top:0px;
}.desc-ref p { 
    font-weight: normal;margin-bottom:5px;
}.desc-ref .ment--ref {
    font-size: 30px;
    margin-bottom:  5px;
}.call-clixk a {
    line-height: 74px;
    display: block;
    font-size: 21px;
    font-weight: 500;
    letter-spacing: 2px;
}.call-us-title {
    /* text-transform: uppercase; */
    font-size: 22px;
    font-weight: 900;
    color: #000;
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 0px;
    margin-left: -10px;
    margin-right: -10px;
    margin-top: 0px;
    background: #eee;
    padding-top: 9px;
}.sh-me .call-clixk { 
    cursor: default;
}
.call-clixk { display:none; }
.sh-me .call-clixk { display:block; }
.call-now .bi{ color: red; top:10px;   position: absolute;    right: 11px; display:none;}
.sh-me  .bi{ display:block; }
#now-click {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;min-width:100%;
}.spl-desc {
    padding-left: 20px;
    position: relative;
    margin-bottom: 25px;
}.spl-desc::before {
    content: '';
    position: absolute;
    left: 0px;
    width: 4px;
    height: 100%;
    background-color: #102448;
}.loc-font {
    font-size: 17px;
    font-weight: normal;
    color: rgba(0,0,0,0.7);
}.overview-ul {
    flex-wrap: nowrap;
    box-shadow: 0px 2px 20px rgba(72, 86, 100, 0.1);
    padding: 10px;
}.page-section .container {
    width: 1170px;
    max-width: 1024px;
}
                </style>
                <script>
                     function toggleoppen(k){
     jQuery('#call-now').toggleClass('sh-me');
 }jQuery(document).mouseup(function(e) 
{
    var container1 = jQuery(".call-now");

    // if the target of the click isn't the container1 nor a descendant of the container1
    if (!container1.is(e.target) && container1.has(e.target).length === 0) 
    {
         jQuery('#call-now').removeClass('sh-me');
    }
});
                </script>
                <button type="button" data-toggle="modal" data-target="#viewing" class="btnPrimaryGreen scrollTo flx1 enquire-now" fdprocessedid="o4mdvo">Enquire Now</button> 
                <button style="margin-left:15px;position:relative;" class="flx1 call-now flx1 call-now btnPrimaryGreen whitein" id="call-now" fdprocessedid="7akg2k"><div onclick="toggleoppen(this)" id="now-click">Call Now <i class="bi bi-x-square-fill"></i></div>
                
                <div class="call-clixk">
                    <div class="call-us-title">Call Us</div>
                    <div class=""><a href="tel:+<?php echo Yii::t('app',$model->agent_phone,array(' '=>''));?>"><?php echo $model->agent_phone;?></a></div>
                    <div class="desc-ref">
                        <p>Please quote property reference</p>
<div class="ment--ref"><?php echo $model->SystemRefNo;?></div>
 <p>when calling us </p>
                    </div>
                </div>
                </button> 
                <button type="button" class="btnPrimaryGreen whitein flx1 sharethis" onclick="showSharePopup()" fdprocessedid="8srp6j">Share this property</button> 
            </div>
        </div>
   
  </div>
  <div id="content">
     <div class="section page-section">
        <div class="container">
          <div class="row">
            <div class="col col-md-12 page-content clearfix">
		 
         
               <div class="tab-content">
                <div id="description" class="tab-pane fade in active" style="padding-top:0px;">
                  <div class="row">
                    <div class="col col-sm-12">
                      <h3><?php echo $model->ad_title;?></h3>
                    
                      <ul class="overview-ul mt-0">
                    
                    <li><label><i class="bi   bi-circle"></i> Property Type</label><?php echo $fields['category'];unset($fields['category']);?></li><li><label><i class="bi   bi-circle"></i> Bedrooms</label><?php echo @$fields['bedrooms'];unset($fields['bedrooms']);?></li>                   
                    <li><label><i class="bi   bi-circle"></i> Size (SQFT)</label><?php echo @$fields['builtup_area'];unset($fields['builtup_area']);?></li>
                     
                     
                </ul>
                      <div class="row">
                    <div class="col-sm-8">
                    
                     <div class="spl-desc">
                   <div><label class="d-block mb-0">
                       Starting From  <b><?php echo $model->priceWithCurrncy;?></b></label></div>
                  
                <div class="property-header__reference1 d-block text-left mt-1 loc-font"><i class="bi bi-geo-alt"></i> <?php echo $model->LocationString2;?></div>
                
                </div>
                
                    
                </div>
                
                <div class="col-sm-4">
                       <div class=" " style="    text-align: right;">
                   <button id="PDPShareButton" style="    border: 1px solid var(--bs-black);    line-height: 1;    border-radius: 2px;" class="iconMail phl btn btnSml btnDefault phmXxsVisible" onclick="showSharePopup()" fdprocessedid="se1qcl">
                       <div style="display:flex;"><i class="bi bi-share mr-2"></i>&nbsp;Share </div>
                       </button>
               </div>
             
                </div>
                
             
            </div>
                      
                      <p class="lead">Property reference: <?php echo $model->SystemRefNo;?></p>
                         
                      <div class="list list-check">
					         <h3>Features</h3>
                        <ul class="row">
								<?php
           
            foreach($fields as $k=>$v){
				if(!empty($v)){
					?>
					 <li class="col-sm-4"><?php echo $model->getAttributeLabel($k);?> : <?php echo  $v; ?> </li>
						 
					<?
				}
				
			}
			?>
				
                           
                        </ul>
                      </div>
                      
                        <div class="list list-check">
                        <h3>Project Overview</h3>
                        <div class="content-font text-t" id="dec-det"><?php echo nl2br($model->ad_description);?></div>
                        <a href="javascript:void(0)" onclick="showmore(this)" class="mt-3 content-font" style="color:var(--logo-color);display:block;font-weight:600;margin-bottom: 40px;">Read more</a>
                        </div> 
                    </div>
                    <div class="col col-sm-12">
						<style>.halfsize{overflow:hidden}.halfsize li{ width:50%; float:left; }.amenities-list li {padding-left:0px; } </style>
					<?php 
					$adAmenities = $model->adAmenities; 
					if(!empty($adAmenities)){ 
					$total_amenities = sizeOf($adAmenities);
					  ?> 
					  <div class="list list-check">
					         <h3>Amenities</h3>
                        <ul class="row">
								<?php
          
            foreach($adAmenities as $k=>$v){
				if(!empty($v)){
					?>
					 <li class="col-sm-4"><?php echo   $v->amenities->amenities_name; ?> </li>
						 
					<?
				}
				
			}
			?>
				
                           
                        </ul>
                      </div>
                     
                      <?php } ?> 
                     
                     
                    </div>
                 
                      <div class="col col-sm-12">
						<style>.halfsize{overflow:hidden}.halfsize li{ width:50%; float:left; }.amenities-list li {padding-left:0px; } </style>
					<?php 
					$adAmenities = $model->pTypes; 
					if(!empty($adAmenities)){ 
					$total_amenities = sizeOf($adAmenities);
					  ?> 
					  <div class="list list-check">
					         <h3>Payment Plan</h3>
                        <ul class="row payment-list">
								<?php
          
            foreach($adAmenities as $k=>$v){
				if(!empty($v)){
					?>
					 <li class="col-sm-6"><div class="dec" ><strong><?php echo   $v->title ; ?></strong><br /><?php echo nl2br( $v->description ) ;?></div></li>
						 
					<?
				}
				
			}
			?>
				
                           
                        </ul>
                      </div>
                     
                      <?php } ?> 
                     
                   <?php
                   
	if(!empty($model->youtube_url)){
	preg_match('%(?:youtube(?:-nocookie)?\.com/(?:[^/]+/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})%i', $model->youtube_url, $match);
	$youtube_id = @$match[1];

	echo '<div class="clearfix"></div>';
	echo '  <h3>Video</h3>';
	echo '<div style="position:relative"><div class="video-container3"><iframe class="video"   src="https://www.youtube.com/embed/'.@$youtube_id.'" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> ';
	echo '<div class="clearfix"></div></div>';
	echo '<div class="clearfix"></div>';
	?>

	<?
	}
	?>  
                    </div>
               
                 
                  </div>
                 
                 <?php /*
                  <h3>Agent Details</h3>
                  <div class="rooms">
                    <div class="room-content">
                      <ul class="list list-check">
                        <li>
                          <h4>Name</h4>
                          <p class="measurement"><?php echo @$model->agent_name;?></p>
                        </li>
                        <li>
                          <h4>Email</h4>
                          <p class="measurement"><?php echo @$model->agent_email;?></p>
                        </li>
                        <li>
                          <h4>Phone</h4>
                          <p class="measurement"><?php echo @$model->agent_phone;?> </p>
                        </li>
                        <li>
                          <h4>Licence number</h4>
                          <p class="measurement"><?php echo @$model->agent_licence_number;?> </p>
                        </li>
                      </ul>
                    </div>
                  </div>
                  */
                  ?>
                  
                </div>
               
              </div>
          
              <div id="mapview">
                <h4 class="border-title">Map View</h4>
                <div style="width: 100%; height: 450px;">
					<iframe dat width="100%" height="450" frameborder="0" style="border:0" src="https://www.google.com/maps/embed/v1/place?q=<?php echo $model->location_longitude;?>,<?php echo $model->location_latitude;?>&amp;key=AIzaSyAuq0074pFpCc_GKeTNEIpLTrNbQWTFRBQ" width="100%" height="100%" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe></div>
              </div>
              <style>
               .share-post ul .twitter a {
    background: #55acee;
}
              .share-post ul {
    position: relative;
    display: block;
}.share-post {
    position: relative;
    padding: 50px 10px 40px;
    text-align: center;
    border-top: 1px solid rgba(0, 0, 0, 0.10);
    margin-bottom: 30px;
}
                  .share-post ul .facebook a {
    background: #3b5998;
}
.share-post ul li a {
    position: relative;
    display: block;
    text-align: center;
    min-width: 140px;
    font-size: 14px;
    padding: 10px 25px;
    line-height: 24px;
    color: #ffffff;
    background: #222222;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}.fa-facebook-f::before {
    content: "\f39e";
}
       .share-post ul li {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0px 5px 10px;
}           .share-post ul .pinterest a {
    background: #bd081c;
}.share-post ul .linkedin a {
    background: #dc4e41;
}.share-post ul li a .icon {
    position: relative;
    font-size: 12px;
    vertical-align: middle;
    padding-right: 10px;
}.share-post strong {
    position: relative;
    display: block;
    font-weight: 700;
    color: #fff;
    font-size: 18px;
     
    margin-bottom: 20px;
}
              </style>
              	  <div class="share-post">

                                    <strong>Share this property  with your friends</strong>

                                          <ul class="links clearfix">

                                        <li class="facebook"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode($model->DetailUrlAbs);?>&quote="   ><span class="icon fa fa-facebook"></span><span class="txt">Facebook</span></a></li>

                                        <li class="twitter"><a  target="_blank" href="http://twitter.com/share?url=<?php echo  urlencode($model->DetailUrlAbs);?>"><span class="icon fa fa-twitter"></span><span class="txt">Twiter</span></a></li>

                                        <li class="linkedin"><a target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url=<?php echo  urlencode($model->DetailUrlAbs);?>&source=LinkedIn"><span class="icon fa fa-linkedin-in"></span><span class="txt">Linkedin</span></a></li>

                                        <li class="pinterest"><a target="_blank"  href="http://pinterest.com/pin/create/button/?url=<?php echo  urlencode($model->DetailUrlAbs);?>"><span class="icon fa fa-pinterest-p"></span><span class="txt">Pinterest</span></a></li>

                                    </ul>

                                </div>
           
              
            </div>
          </div>
        </div>
      </div>
    </div>
    <style>
 
.icon-bed::before {
    content: "";
}
[class^="icon-"]::before, [class*=" icon-"]::before {
    display: inline-block;
    font-family: "ps_modern_icons";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1em;
    margin-left: 0.2em;
    margin-right: 0.2em;
    text-align: center;
    text-decoration: inherit;
    text-transform: none;
    width: 1em;
}

.button-block {
    display: block;
    padding: 10px;
    width: 100%;
}
.button-secondary {
    background: #2980b9 none repeat scroll 0 0;
    box-shadow: 0 2px 0 #1b557a;
    color: #fff;
}
.button {
    font-size: 16px;
}
.button {
    border: 0 none;
    border-radius: 3px;
    cursor: pointer;
    padding: 10px;
}

[data-role="call"] a, [data-role="call"] b {
    color: #fff !important;
    display: block;
    font-weight: normal;
    padding: 10px !important;
}
b, strong {
    font-weight: 700;
}

.icon-phone::before {
    content: "";
}
[class^="icon-"]::before, [class*=" icon-"]::before {
    display: inline-block;
    font-family: "ps_modern_icons";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1em;
    margin-left: 0.2em;
    margin-right: 0.2em;
    text-align: center;
    text-decoration: inherit;
    text-transform: none;
    width: 1em;
}
 .button-primary {
    background: #550a12 none repeat scroll 0 0;
    box-shadow: 0 2px 0 #cc7600;
    color: #fff;
}
.errorMessage {
		
    text-align: left;
}
    </style>
    <script type="text/javascript" src="<?php echo Yii::app()->baseUrl.'/frontend/assets/js/yiiactiveform.js';?>"></script>
<script>
 function  ajaxSubmitHappen(form, data, hasError)
{
    if(!hasError)
{

                                 jQuery.ajax({

                                    "type":"POST",
                                    "url":"<?php echo Yii::app()->createUrl('site/SendEnquiry');?>",
                                    "data":form.serialize(),
                                    "success":function(data){
										if(data=='1'){
											jQuery('#send-enquiry-left-block,#send-enquiry-right-block').hide();
											jQuery('#send-enquiry-success-outer').show();
										}
										else{
											alert(data);
										}
                                     },

                                  });
     }
      else
    { 
       alert('error');
     }
 }
</script>

	<div class="modal" tabindex="-1" role="dialog" id="viewing">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
        <div class="modal-body">
         <div id="send-enquiry-form-wrapper"  >
        <div class="overflow">
            <div id="send-enquiry-left-block">
        
    <div id="send-enquiry-left-block-img-wrapper">
		<?php
		if(!empty($model->singleAdImage)){
			?>
			 <img src="<?php echo  $model->renderImageNew(@$model->singleAdImage->image_name);;?>">
			<?
		}
		?>
       
    </div>
    <div id="send-enquiry-left-block-content-wrapper"> 
        <p class="location"><?php echo $model->ad_title;?>    - <?php echo $model->locationString;?></p>
         <div class="price"><?php echo $model->detailsPriceHtml;?></div>
        <div>
            <p class="logo-title">This property is brought to you by:</p>
            <div class="logo-container">
               <a href="#"><?php echo @$model->agent_name;?></a>
            </div> 
        </div>
    </div>

        </div>
            <div id="send-enquiry-right-block">
                






 
	<?php
	$contact = new SendEnquiry();
	$contact->ad_id = $model->id ;
	$contact->meassage = 'Hello 
I found your property on  '.Yii::app()->options->get('system.common.site_name').'. Please send me more information about this property
Thank you';
				$form = $this->beginWidget('CActiveForm', array(
				'action'=>Yii::app()->createUrl('site/validateEnquiry'),
				'enableAjaxValidation'=>true,
				'clientOptions'=>array(
				'validateOnSubmit'=>true,
				'afterValidate' => 'js:function(form, data, hasError) { 
				if(hasError) {
				return false;
				}
				else
				{
				 
						ajaxSubmitHappen(form, data, hasError); 
				}
				}',
				),
				'htmlOptions'=>array('class'=>'pure-form pure-form-aligned main-enquiry-form' ),
				));
				?>
    <legend><i class="icon icon-email"></i>Send Enquiry</legend>
    <fieldset>
        <div class="division">
            <div class="pure-control-group form-icon form-icon-person">
				<?php echo $form->textField($contact, 'name',$model->getHtmlOptions('name',array('class'=>'pure-input-1'))); ?>
				<?php echo $form->hiddenField($contact, 'ad_id'); ?>
				<?php echo $form->error($contact, 'name');?>
				<?php echo $form->error($contact, 'ad_id');?>
                
            </div>
            <div class="pure-control-group form-icon form-icon-mail">
				<?php echo $form->textField($contact, 'email',$contact->getHtmlOptions('email',array('class'=>'pure-input-1'))); ?>
				<?php echo $form->error($contact, 'email');?>
            </div>
            <div class="pure-control-group form-icon form-icon-mobile">
				<?php echo $form->textField($contact, 'phone',$contact->getHtmlOptions('phone',array('class'=>'pure-input-1'))); ?>
				<?php echo $form->error($contact, 'phone');?>
            </div>
        </div>
        <div class="division">
            <div class="pure-control-group">
                
                <?php echo $form->textArea($contact, 'meassage',$contact->getHtmlOptions('meassage',array('class'=>'pure-input-1'))); ?>
                <?php echo $form->error($contact, 'meassage');?>
            </div>
            <div class="pure-control-group">
                <div style="width: 270px;">
                    <div data-sitekey="6Ld4-_8SAAAAAHpnkLeO07DUb1_4OXBFi7Fm91wb" class="g-recaptcha"><div>  </div>
                </div>
            </div>
            <div class="pure-control-group">
                <button class="button button-primary" id="submit" name="submit" type="submit" role="trigger-sending">
                    <span class="icon-mail-3"></span> Send Enquiry
                </button>
            </div>
        </div>
    </fieldset>
<input type="hidden" name="data_src" value="4"><input type="hidden" name="listing_ids[]" value="707410"> 

<?php $this->endWidget(); ?>

            </div>
            <div id="send-enquiry-success-outer" style="display: none;">
            <div id="send-enquiry-success">
                <div id="send-enquiry-success-top row">
                    <h3><span class="icon-ok-1"></span>Enquiry successfully sent</h3>
                </div>
                <div class="row" id="send-enquiry-success-bottom"></div>
            </div>
            </div>
        </div>
        <div class="icon-cancel" id="send-enquiry-popup-close" class="close" data-dismiss="modal" aria-label="Close" >
		 
          <span aria-hidden="true">×</span>
        
        </div>
    </div>
</div>

    <div class="clearfix"></div>
      </div>
     </div>
  </div>
</div>
 	 <div class="modal" id="openp" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
   
        <button type="button" class="close" data-dismiss="modal" aria-label="Close" onclick="$('#openp').modal('hide')">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
 
      <div class="modal-body">
          <div class="main_title_3"> <span></span>
        <h2>Share this<span class="d-block">listing</span></h2>
        </div>
         
    	<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style mt-5"  style="line-height: 32px;display: flex;position: unset;">

						<a class="a2a_button_facebook">Facebook</a>
					<a class="a2a_button_whatsapp">WhatsApp</a>
					<a class="a2a_button_twitter">Twitter</a>
					<a class="a2a_button_pinterest">Pinterest</a> 
					<a class="a2a_button_linkedin">Linkedin</a> 
					<a class="a2a_button_email">Email</a>
					<a class="a2a_button_print">Print</a> 
				</div>
					<script async src="https://static.addtoany.com/menu/page.js"></script>
                    <script>
                    var a2a_config = a2a_config || {};
                    a2a_config.thanks = {
                    postShare: false,
                    }; 
                    </script>
                        <div hidden><svg id="svg_tick" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs"   x="0" y="0" viewBox="0 0 520 520" style="enable-background:new 0 0 512 512" xml:space="preserve" class=""><g><g xmlns="http://www.w3.org/2000/svg" id="_15-Checked" data-name="15-Checked"><path d="m232.019 422.469a10 10 0 0 1 -8.624-4.938c-33.227-56.607-121.81-177.14-122.7-178.351a10 10 0 0 1 1.027-13.039l27.239-26.918a10 10 0 0 1 12.755-1.085l88.222 61.6c59.034-75.7 113.87-128 149.946-158.861 40.616-34.738 66.471-50.377 67.553-51.021a10 10 0 0 1 5.145-1.425h44.068a10 10 0 0 1 6.65 17.469c-125.143 111.464-261.232 349.13-262.592 351.518a10 10 0 0 1 -8.624 5.05z" fill="currentColor" data-original="currentColor" class=""></path><path d="m230.1 464.132c-99.252 0-180-80.747-180-180s80.748-180 180-180a179.651 179.651 0 0 1 58.491 9.72 10 10 0 1 1 -6.5 18.916 159.712 159.712 0 0 0 -52-8.636c-88.225 0-160 71.776-160 160s71.775 160 160 160 160-71.776 160-160a161.236 161.236 0 0 0 -3.246-32.231 10 10 0 1 1 19.6-4.005 181.324 181.324 0 0 1 3.651 36.236c.004 99.253-80.744 180-179.996 180z" fill="currentColor" data-original="currentColor" class=""></path></g></g></svg></div>
    <?php $url = 'http' . (isset($_SERVER['HTTPS']) ? 's' : '') . '://' . "{$_SERVER['HTTP_HOST']}{$_SERVER['REQUEST_URI']}"; ?> 
      <div class="copylink mt-3">
        <div class="col-sm-12">
        <div class="input-group mb-3">
        <input type="text" class="form-control" readonly id="cpy_text" value="<?php echo $url;?>" >
        <div class="input-group-append">
        <span class="input-group-text" id="basic-addon2" onclick="copyToClipboard()" ><svg viewBox="0 0 70.098 53.605" class="nicon-share"><use xlink:href="#svg_tick"></use> </svg> Copy Link</span>
        </div>
        </div>
        </div>
      </div>
     
      </div>
      <style>
        .copylink  .input-group {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
}.input-group-text {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
        border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
        background-color: #262e42;
    color: #fff;
    cursor: pointer;
}#openp .modal-body {
    padding: 40px 40px 40px !important;
}#openp .modal-content {
    border-radius: 0;
    border: none;
    box-shadow: 0 5px 60px rgba(0, 0, 0, 0.5);
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-color: var(--bs-modal-bg);
    background-clip: padding-box;
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
}.copylink .input-group-text {
    background-color: #000;
    color: #fff;
    cursor: pointer;
    height: 100%;
}
      </style>
      <script>
        function copyToClipboard() {
            var input = jQuery('#cpy_text');
            input.value = input.val();
            input.focus();
            input.select();
            document.execCommand('copy'); 
            jQuery('#basic-addon2').addClass('copied');
        }
        function showSharePopup(){
            jQuery('#openp').modal('show');
        }
        function showmore(k){
            if(jQuery('#dec-det').hasClass('text-t')){
                jQuery('#dec-det').removeClass('text-t') ;
                jQuery(k).html('Read less');
                }else{
                jQuery('#dec-det').addClass('text-t') ;
                jQuery(k).html('Read more');jQuery('#focs-me').focus();
            }
        }
      </script>
     </div>
  </div>
  
  </div>
