@extends(backpack_view('layouts.top_left'))

@section('content')
<div class="card card-invoice">
    <div class="card-header">
      <div>
        <h5 class="mg-b-3">{{ trans_choice('admin.invoice.title', 1)}} #DF032AZ00022</h5>
        <span class="tx-sm text-muted">{{ __('admin.invoice.fields.due_date') }} 15/09/2019</span>
      </div>
      <div class="btn-group-invoice">
        <a href="" class="btn btn-white btn-sm btn-uppercase"><i data-feather="download"></i> {{ __('admin.invoice.buttons.download') }}</a>
        <a href="" class="btn btn-white btn-sm btn-uppercase"><i data-feather="printer"></i> {{ __('admin.invoice.buttons.print') }}</a>
        <a href="" class="btn btn-brand-02 btn-sm btn-uppercase"><i data-feather="mail"></i> {{ __('admin.invoice.buttons.email') }}</a>
      </div>
    </div><!-- card-header -->
    <div class="card-body">
      <div class="row">
        <div class="col-sm-6">
          <label class="content-label">{{ __('admin.invoice.fields.billed_from') }}</label>
          <h6 class="tx-15 mg-b-10">Nom Entreprise</h6>
          <p class="mg-b-0">Adresse, Code postal + Ville</p>
          <p class="mg-b-0">{{ __('admin.invoice.fields.phone') }} : XX XX XX XX XX</p>
          <p class="mg-b-0">{{ __('admin.invoice.fields.email') }} : mail@mail.fr</p>
        </div><!-- col -->
        <div class="col-sm-6 tx-right d-none d-md-block">
          <label class="content-label">{{ __('admin.invoice.fields.invoice_number') }}</label>
          <h2 class="tx-normal tx-gray-400 mg-b-10 tx-spacing--2">#DF032AZ00022</h2>
        </div><!-- col -->
        <div class="col-sm-6 col-lg-8 mg-t-40 mg-sm-t-0 mg-md-t-40">
          <label class="content-label">{{ __('admin.invoice.fields.billed_to') }}</label>
          <h6 class="tx-15 mg-b-10">Isaac Rimokh</h6>
          <p class="mg-b-0">4033 Patterson Road, Staten Island, NY 10301</p>
          <p class="mg-b-0">Tel No: 324 445-4544</p>
          <p class="mg-b-0">Email: youremail@companyname.com</p>
        </div><!-- col -->
        <div class="col-sm-6 col-lg-4 mg-t-40">
          <label class="content-label">{{ __('admin.invoice.fields.invoice_information') }}</label>
          <ul class="list-unstyled lh-7">
            <li class="d-flex justify-content-between">
              <span>{{ __('admin.invoice.fields.invoice_number') }}</span>
              <span>DF032AZ00022</span>
            </li>
            <li class="d-flex justify-content-between">
              <span>{{ __('admin.invoice.fields.due_date') }}</span>
              <span>January 20, 2019</span>
            </li>
          </ul>
        </div><!-- col -->
      </div><!-- row -->

      <div class="table-responsive mg-t-25">
        <table class="table table-invoice bd-b">
          <thead>
            <tr>
              <th class="wd-20p">{{ __('admin.invoice.fields.type') }}</th>
              <th class="wd-40p d-none d-sm-table-cell">{{ __('admin.invoice.fields.description') }}</th>
              <th class="tx-center">{{ __('admin.invoice.fields.quantity') }}</th>
              <th class="tx-right">{{ __('admin.invoice.fields.unit_price') }}</th>
              <th class="tx-right">{{ __('admin.invoice.fields.amount') }}</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td class="tx-nowrap">Commande</td>
              <td class="d-none d-sm-table-cell tx-color-03">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam...</td>
              <td class="tx-center">2</td>
              <td class="tx-right">150.00 €</td>
              <td class="tx-right">300.00 €</td>
            </tr>
            <tr>
              <td class="tx-nowrap">Projet</td>
              <td class="d-none d-sm-table-cell tx-color-03">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque...</td>
              <td class="tx-center">1</td>
              <td class="tx-right">1,200.00 €</td>
              <td class="tx-right">1,200.00 €</td>
            </tr>
            <tr>
              <td class="tx-nowrap">AT</td>
              <td class="d-none d-sm-table-cell tx-color-03">Et harum quidem rerum facilis est et expedita distinctio</td>
              <td class="tx-center">2</td>
              <td class="tx-right">850.00 €</td>
              <td class="tx-right">1,700.00 €</td>
            </tr>
            <tr>
              <td class="tx-nowrap">Commande</td>
              <td class="d-none d-sm-table-cell tx-color-03">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut</td>
              <td class="tx-center">3</td>
              <td class="tx-right">850.00 €</td>
              <td class="tx-right">2,550.00 €</td>
            </tr>
          </tbody>
        </table>
      </div>

      <div class="row justify-content-between mg-t-25">
        <div class="col-sm-6 col-lg-6 order-2 order-sm-0 mg-t-40 mg-sm-t-0">
          <label class="content-label mg-b-10">{{ __('admin.invoice.fields.notes') }}</label>
          <p class="tx-sm">
            {{ __('admin.invoice.legals') }}
          </p>
        </div><!-- col -->
        <div class="col-sm-6 col-lg-4 order-1 order-sm-0">
          <ul class="list-unstyled lh-7 pd-r-10">
            <li class="d-flex justify-content-between">
              <span>{{ __('admin.invoice.fields.subtotal') }}</span>
              <span>5,750.00 €</span>
            </li>
            <li class="d-flex justify-content-between">
              <span>{{ __('admin.invoice.fields.taxes') }} (5%)</span>
              <span>287.50 €</span>
            </li>
            <li class="d-flex justify-content-between">
              <span>{{ __('admin.invoice.fields.discount') }}</span>
              <span>-50.00 €</span>
            </li>
            <li class="d-flex justify-content-between">
              <strong>{{ __('admin.invoice.fields.total') }}</strong>
              <strong>5,987.50 €</strong>
            </li>
          </ul>

          <button class="btn btn-block btn-primary btn-brand-02">{{ __('admin.invoice.buttons.save') }}</button>
        </div><!-- col -->
      </div>
    </div><!-- card-body -->
  </div><!-- card -->
  @endsection