@extends('layouts.user')

@section('content')

<div class="content-wrap gray-bg">

	<div class="container">

		<div class="row">
			<!-- =========INVOICE STARTS======= -->
			<div class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3">
				<div class="border-cls" >
					<div class="invoice-bg" style="background-image: url({{asset('invoice1.png')}});">
						<div class="invoice-overlay text-center">
							<h3 class="sec-head1  top">{{tr('subscription_plan_title')}}</h3>
							<h4 class="top">{{tr('total_minutes')}}</h4>
							<div class="table-responsive">
								<table class="table table-bordered top2 text-right">
									<tbody>
										<tr>
											<td>{{tr('amount')}}</td>
											<td>{{tr('price_invoice')}}</td>
										</tr>
										<tr>
											<td>{{tr('tax')}}</td>
											<td>{{tr('invoice_tax_price')}}</td>
										</tr>
										<tr>
											<td>{{tr('total')}}</td>
											<td>{{tr('price_invoice')}}</td>
										</tr>
									</tbody>
								</table>
							</div>
							
							<form class="payment">
								<h3 class="sec-head1  top">{{tr('payment_options')}}</h3>
								<ul>
									<li>
										<input type="radio" id="f-option" name="selector">
										<label for="f-option">{{tr('pizza')}}</label>
										<div class="check"></div>
									</li>

									<li>
										<input type="radio" id="s-option" name="selector">
										<label for="s-option">{{tr('bacon')}}</label>
										<div class="check"><div class="inside"></div></div>
									</li>
								</ul>
								<div class="text-right">
									<a class="common-bg-link task-work-link">
										<i class="fa fa-credit-card"></i> &nbsp; {{tr('paynow_cap')}}
									</a>
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
			<!-- =========INVOICE ENDS====== -->
		</div>

	</div>

</div>

@endsection