<ion-header class="theme_dark_bg" [ngClass]="lang=='ar' ? 'ar' : ''">
  <button ion-button class="nav_btn theme_color floatLeft"(click)="dismiss()">
     <ion-icon name="ios-arrow-back"></ion-icon>
  </button>
  <div class="nav_header_title floatLeft">{{'payment.Payment Details'|translate}}</div>
  <div class="clear"></div>
</ion-header>
<ion-content padding class="cab_coupon_bg" [ngClass]="lang=='ar' ? 'ar' : ''">
	<div class="cab_trip_detail_wrapper">
			<h4 class="text_white">{{'payment.Pickup Point'|translate}}</h4>
			<p class="floatLeft textLeft width50">{{book.from}}</p>
			<!-- <p class="floatRight textRight width50">11 :23 am, 02-08-2017</p> -->
			<div class="clear"></div>
			<br>
			<h4 class="text_white">{{'payment.Drop Point'translate}}</h4>
			<p class="floatLeft textLeft width50">{{book.to}}</p>
			<!-- <p class="floatRight textRight width50">12 :00 am, 02-08-2017</p> -->
			<div class="clear"></div>
			<br>
			<br>
	</div>

		<div class="cab_coupon_content">
			<p style="padding-top: 0px;margin-top: 0px;margin-bottom: 0px;">{{'payment.Ride Details'|translate}}</p>
			<li>
				<div class="child textLeft">{{'payment.Distance'|translate}}</div>
				<div class="child textRight">Rs. {{details?.distance}}</div>
				<div class="clear"></div>
			</li>
			<li>
				<div class="child textLeft">{{'payment.Hours'|translate}}</div>
				<div class="child textRight">Rs. {{details?.hours}}</div>
				<div class="clear"></div>
			</li>
		</div>

	<div class="cab_coupon_content">
		<p style="padding-top: 0px;margin-top: 0px;margin-bottom: 0px;">{{'payment.Payment Details'|translate}}</p>
		<li>
			<div class="child textLeft">{{'payment.Total'|translate}}</div>
			<div class="child textRight">Rs. {{details?.bfor_deduction}}</div>
			<div class="clear"></div>
		</li>
		<li>
			<div class="child textLeft">{{'payment.Discount'|translate}}</div>
			<div class="child textRight">Rs. {{book?.discount}}</div>
			<div class="clear"></div>
		</li>
		<li>
			<div class="child textLeft">{{'payment.Due after service'|translate}}</div>
			<div class="child textRight">Rs. {{details?.amount}}</div>
			<div class="clear"></div>
		</li>
	</div>
	
</ion-content>
<ion-footer [ngClass]="lang=='ar' ? 'ar' : ''">
	<div class="theme_bgcolor p10 text_white">
		<p class="floatLeft text_size_18">{{'payment.Total'|translate}}</p>
		<p class="floatRight text_size_18">Rs.{{details?.amount}}</p>
		<div class="clear"></div>
	</div>
	<button ion-button class="cab_footer_btn width100 text_white" (click)="done()">{{'payment.Completed'|translate}}</button>
</ion-footer>
