<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>{{ $invoice->official_number }}</title>
    <style type="text/css" media="all">
        * {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        h1,h2,h3,h4,h5,h6,p,span,div {
            font-family: Arial, Helvetica, sans-serif;
            font-weight: normal;
        }
        p,span,div {
            font-size:10px;
        }
        th,td {
            font-family: Arial, Helvetica, sans-serif;
            font-size:10px;
        }
        footer *,
        header * {
            color: white !important;
        }
        .panel {
            margin-bottom: 20px;
            background-color: #fff;
            border: 1px solid transparent;
            border-radius: 4px;
            -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
            box-shadow: 0 1px 1px rgba(0,0,0,.05);
        }
        .panel-default {
            border-color: #ddd;
        }
        .panel-body {
            padding: 15px;
        }
        table {
            width: 100%;
            max-width: 100%;
            border-spacing: 0;
            border-collapse: collapse;
            background-color: transparent;
        }
        thead  {
            text-align: left;
            display: table-header-group;
            vertical-align: middle;
        }
        th, td  {
            border: 1px solid #ddd;
            padding: 6px;
        }
        .well {
            min-height: 20px;
            padding: 19px;
            margin-bottom: 20px;
            background-color: #f5f5f5 !important;
            border: 1px solid #e3e3e3;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
            box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
        }
        .row-custom {
            display: inline-block;
            width: 100%
        }
        .col-custom {
            width: 50%;
            padding: 30px;
        }
        .invoice {
            width: 100%;
            display: inline-block;
            justify-content: space-evenly;
        }
        .header-title {
            font-size: 18px;
        }
        .header-description {
            font-size: 15px;
        }
    </style>
</head>
<body>
<header style="background-color: #1f6fb2; color: white !important;">
    <div class="row-custom">
        <div class="col-custom" style="float: left;">
            <img src="{{$company->logo_url}}" style="height: 100px; width: 100px">
        </div>

        <div class="col-custom" style="float: right;">
            <p>
                <span class="header-title">Fecha de emisión: </span> {{ $invoice->emitted_date }}
            </p>
            <p>
                @if ($invoice->due_date)
                    <span class="header-title">Fecha de vencimiento: </span>{{ $invoice->due_date }}
                @endif
            </p>
            <p>
                @if ($invoice->official_number)
                    <span class="header-title">Número de factura: </span> {{ $invoice->official_number }}
                @endif
            </p>
            <br />
        </div>
    </div>

</header>
<main>
    <div class=".invoice">
        <div class="row-custom">
            <div class="col-custom" style="float: left;">
                <h4>Detalle de la empresa:</h4>
                <div class="panel panel-default">
                    <div class="panel-body">
                        {{ $invoice->from_fiscal_name }}<br />
                        ID: {{ $invoice->from_nif_cif }}<br />
                        {{ $invoice->from_fiscal_address }}<br />
                    </div>
                </div>
            </div>

            <div class="col-custom" style="float: right;">
                <h4>Detalle del cliente:</h4>
                <div class="panel panel-default">
                    <div class="panel-body">
                        {{ $invoice->to_fiscal_name }}<br />
                        ID: {{ $invoice->to_nif_cif }}<br />
                        {{ $invoice->to_fiscal_address }}<br />
                    </div>
                </div>
            </div>
        </div>

        <table class="table table-bordered">
            <thead>
            <tr>
                <th>#</th>
                <th>Ref.</th>
                <th>Nombre</th>
                <th>Descripción</th>
                <th>Precio sin IVA</th>
                <th>IVA</th>
                <th>Total</th>
            </tr>
            </thead>
            <tbody>
            @if ($lineUserSubscription)
                <tr>
                    <td> 1 </td>
                    <td>{{ $lineUserSubscription['id'] }}</td>
                    <td>{{ $lineUserSubscription['name'] }}</td>
                    <td>{{ $lineUserSubscription['description'] }}</td>
                    <td>{{ number_format($lineUserSubscription['subtotal'],2) }} €</td>
                    <td>{{ number_format(($lineUserSubscription['subtotal']*$lineUserSubscription['vat']),2) }} € ({{number_format($lineUserSubscription['vat'],2)}} %)</td>
                    <td>{{ number_format($lineUserSubscription['total'],2) }} €</td>
                </tr>
            @endif

            @foreach ($lines as $item)
                <tr>
                    <td>{{ $loop->iteration+1 }}</td>
                    <td>{{ $item->id}}</td>
                    <td> </td>
                    <td> </td>
                    <td>{{ number_format($item->subtotal,2) }} €</td>
                    <td>{{ number_format(($item->subtotal*$item->vat),2) }} € ({{number_format($item->vat,2)}} %)</td>
                    <td>{{ number_format($item->total,2) }} €</td>
                </tr>
            @endforeach
            </tbody>
        </table>

        <div class="row-custom">
            <div class="col-custom" style="float: left;">
                <div>
                    <h4>Notes:</h4>
                    <div class="panel panel-default">
                        <div class="panel-body">
                            {{ $invoice->concept }}
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-custom" style="float: right;">
                <h4>Total:</h4>
                <table class="table table-bordered">
                    <tbody>
                    <tr>
                        <td><b>Subtotal</b></td>
                        <td>{{ number_format($subtotal,2) }} €</td>
                    </tr>
                    <tr>
                        <td><b>IVA</b></td>
                        <td>{{ number_format(($boxOrder->subtotal*$boxOrder->vat),2) }} € ({{number_format($boxOrder->vat,2)}} %)</td>
                    </tr>
                    {{--@foreach($invoice->tax_rates as $tax_rate)
                        <tr>
                            <td>
                                <b>
                                    {{ $tax_rate['name'].' '.($tax_rate['tax_type'] == 'percentage' ? '(' . $tax_rate['tax'] . '%)' : '') }}
                                </b>
                            </td>
                            <td>{{ $invoice->taxPriceFormatted((object)$tax_rate) }} {{ $invoice->formatCurrency()->symbol }}</td>
                        </tr>
                    @endforeach--}}
                    <tr>
                        <td><b>TOTAL</b></td>
                        <td><b>{{ number_format($total,2) }} €</b></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

</main>
</body>
<footer style="background-color: #1f6fb2; color: white !important; padding: 20px;">
    <div style="display: grid; grid-template-columns: repeat(3,1fr);">
        <div style="display: flex; justify-content: center; align-items: center">
            <img src="{{asset('assets/images/white-text.png')}}" style="height: 20px">
        </div>

        <div style="text-align: center; display: flex; justify-content: center; align-items: center; color: white !important;">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam gravida efficitur scelerisque. Pellentesque interdum sem nec hendrerit convallis. Aliquam tempor consequat dignissim. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis vitae commodo est.
        </div>

        <div style="padding-left: 50px;color: white !important;">
            <p>Email: {{ $preferences['admin_email'] }}</p>
            <p>Teléfono: {{ $preferences['phone'] }}</p>
            <p>Dirección: {{ $preferences['fact_address'] . ", " . $preferences['fact_poblacio']. ", " . $preferences['fact_zipcode']. ", " . $preferences['fact_country'] }}</p>
        </div>
    </div>
</footer>
</html>
