@extends('email-layout')

@section('head')
    <style>
        .product-description {
            font-size: 1em;
            color: #6e6e6e;
        }

        .image {
            width: 80px;
            height: 80px;
        }

        .product-image {
            height: 64px;
            width: 64px;
            border: 1px solid #ccc;
        }

        table {
            width: 400px;
            border-collapse: collapse;
        }

        .product-price {
            font-weight: 400;
            text-align: right;
            font-size: 16px;
        }

        .subtotal {
            border-top: 1px solid #d3d3d3;
            line-height: 2em;
        }

        .total {
            border-top: 1px solid #d3d3d3;
            height: 3em;
        }

        .total-amount {
            text-align: right;
            font-size: 18px;
            font-weight: 600;
        }
    </style>
@endsection

@section('title')
    Completa tu compra y unite al Club!
@endsection

@section('content')


    <p>Hola {{ $first_name }} {{  $last_name }}!</p>
    <h3>Completá tu compra:</h3>


    <table class="product-description">
        <tbody>
        @foreach($products as $product)
            <tr>
                <td class="image">
                    <img src="{{ $product['image_src'] }}" class="product-image">
                </td>
                <td>
                    {{ $product['name'] }}
                    @if($product['quantity']>1)
                        x{{ $product['quantity'] }}
                    @endif
                </td>
                <td class="product-price">
                    {{ $product['price'] }}
                </td>
            </tr>
        @endforeach

        <tr class="subtotal">
            <td>
                Subtotal
            </td>
            <td></td>
            <td class="product-price">
                {{ $account['subtotal'] }}
            </td>
        </tr>
        <tr style="line-height: 2em;">
            <td>
                Envío
            </td>
            <td></td>
            <td class="product-price">
                @if($account['allow_free_shipping'])
                    <span style="text-decoration: line-through"> {{ $account['shipping'] }}</span> Sin Cargo!
                @else
                    {{ $account['shipping'] }}
                @endif
            </td>
        </tr>
        <tr class="total">
            <td>
                Total
            </td>
            <td></td>
            <td class="total-amount">
                {{ $account['total'] }}
            </td>
        </tr>
        </tbody>
    </table>


    <p>
        Hace <a href="{{  $url }}" target="_blank">click aquí</a> para completar tu compra. </p>
    <br/>
    <p>Quedamos a disposición por cualquier cosa que necesites.<p>
    <p>¡Saludos!<br/>El equipo de Lecturita :)</p>
@endsection