@if(Yard::instance('shopping')->content()->count())
    @if(Yard::instance('shopping')->compCount() > 0)

<style>
    .yard-items-head {
        border-bottom: 1px solid #ddd;
        padding-bottom: 8px;
        margin-bottom: 8px;
    }

    .yard-item {
        position: relative;
        padding-top: 8px;
        border-bottom: 1px solid #ddd;
        padding-bottom: 8px;
    }

    .yard-item a.shop-item-hl {
        color: #9aa983;
        font-size: 1.1em;
        font-weight: bold;
    }

    .yard-item .options {
        margin-top: 4px;
    }

    .yard-item a.auto-delete-product {
        font-size: 0.7em;
        font-weight: bold;
        text-transform: uppercase;
    }

    .yard-item .quantity {
        position: relative;
    }

    .quantity-select {
        text-align: right;
    }

    .quantity-select select.form-control:not([size]):not([multiple]) {
        width: auto;
        min-width: 5em;
        display: inline-block;
    }

    .yard-item .price-total {
        margin-top: 6px;
        white-space: nowrap;
    }

    .yard-item .font-semi-bold {
        color: #393939;
        font-weight: 500;
    }

    .yard-item .font-semi-bold .small {
        font-size: 1rem;
    }

    .yard-item .font-bold {
        color: #393939;
        font-weight: bold;
    }

    .price-single {
        white-space: nowrap;
    }

    .price-total {
        font-weight: 600;
        font-size: 0.95rem;
        white-space: nowrap;
    }
    .quantity-select {
        text-align: right;
    }
    .quantity-select input.form-control {
        width: auto;
        min-width: 4em;
        display: inline-block;
    }
</style>
        <div id="cartContent">

            <div class="yard-items-head d-none d-sm-block">
                <div class="row">
                    <div class="col-3 col-sm-2">
                        <div class="row">&nbsp;</div>
                    </div>
                    <div class="col-9 col-sm-10">
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-7">
                                Artikel
                            </div>
                            <div class="col-6 col-sm-3 col-md-2 text-left">
                                Einzelpreis
                            </div>
                            <div class="col-6 col-sm-3 col-md-3 text-right">
                                Anzahl
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @foreach(Yard::instance('shopping')->getContentByOrder() as $row)
                @php($product = \App\Models\Product::find($row->id))
            <div class="row yard-item">

                <div class="col-3 col-sm-2">
                    @if($row->options->has('image'))
                        <img src="{{ route('product_image', [$row->options->image]) }}" class="d-block ui-w-80 ui-bordered mr-4" alt="">
                    @else
                        <img src="{{ asset('/assets/images/1x1.png') }}" class="d-block ui-w-80 ui-bordered mr-4" alt="">
                    @endif
                </div>

                <div class="col-9 col-sm-10">
                    <div class="row">
                        <div class="col-12 col-sm-6 col-md-7 description">
                            <div class="media-body">
                                <div class="d-block text-body" style="font-size: 15px; font-weight: 500;">{{ $row->name }}</div>
                                <div class="text-body">
                                    <div>Inhalt: {{ $product->contents }}</div>
                                    <div>Art.-Nr.: {{ $product->number }}</div>
                                </div>
                            </div>
                            <div class="options">
                                @if(!$row->options->comp)
                                <a href="#" class="auto-delete-product remove_item_form_cart product-tooltip" data-row-id="{{$row->rowId}}" data-product-id="{{ $product->id }}"><i class="fa fa-times"></i>  Artikel entfernen</a>
                                @else
                                    @if(Yard::instance('shopping')->getNumComp() > 1)
                                        {{$row->options->comp}}. Kompensationsprodukt
                                    @else
                                        Kompensationsprodukt
                                    @endif

                                @endif
                            </div>
                        </div>

                        <div class="col-6 col-sm-3 col-md-2 text-left font-semi-bold price-single">
                            <div class="no-line-break">{{  Yard::instance('shopping')->rowPriceNet($row, 3) }} &euro;</div>
                        </div>

                        <div class="col-6 col-sm-3 col-md-3 quantity">
                            <div class="quantity-select">
                                @if($row->options->comp)
                                    <span class="text-right product-tooltip" data-toggle="tooltip" title="Kompensationsprodukt">1 x</span>
                                @else
                                    <input type="number" class="form-control text-center cart-input-event-onchange" data-row-id="{{$row->rowId}}" data-product-id="{{ $product->id }}" value="{{ $row->qty }}" name="quantity[{{$row->rowId}}]" maxlength="3" max="999" min="1">
                                @endif
                            </div>
                            <div class="price-total text-right">
                                <div class="no-line-break">{{  Yard::instance('shopping')->rowSubtotalNet($row) }} &euro;</div>
                            </div>

                        </div>
                    </div>
                </div>

            </div>
            @endforeach
            <div class="clearfix"></div>
        </div>

    <!-- / Shopping cart table -->
    <div class="d-flex flex-wrap justify-content-between pb-4">
        <div class="mt-2">
            <p class="small mb-2">Du hast {{ Yard::instance('shopping')->compCount() }} Artikel in Deinem Warenkorb</p>
            <p>Gesamte Points:  {{ Yard::instance('shopping')->points() }}</p>
            <button type="button" class="btn btn-default btn-sm" id="clear-products-basket"><i class="ion ion-ios-trash"></i> Warenkorb löschen</button>
        </div>
        <div class="d-flex">
            <div class="text-right mt-2">
                <table class="table">
                    <tbody>
                    <tr>
                        <td class="text-left" style="border-top:none;">Zwischensumme:</td>
                        <td style="border-top:none;">{{ Yard::instance('shopping')->subtotal() }} €</td>
                    </tr>
                    <tr>
                        <td class="text-left">Lieferland:</td>
                        <td>{{ Yard::instance('shopping')->getShippingCountryName() }}</td>
                    </tr>
                    <tr>
                        <td class="text-left">Versandkosten:</td>
                        <td>
                            {{  Yard::instance('shopping')->shippingNet() }} €
                        </td>
                    </tr>
                    <tr>
                        <td class="text-left">Summe ohne MwSt:</td>
                        <td>
                            {{  Yard::instance('shopping')->subtotalWithShipping() }} €
                        </td>
                    </tr>
                    <tr>
                        <td class="text-left">zzgl. MwSt:</td>
                        <td>{{  Yard::instance('shopping')->taxWithShipping() }} €</td>
                    </tr>
                    <tr>
                        <td class="text-left"><strong>Gesamtsumme Brutto:</strong></td>
                        <td><strong>{{ Yard::instance('shopping')->totalWithShipping() }} €</strong></td>
                    </tr>
                    </tbody>
                </table>

            </div>
        </div>
    </div>
    <hr>
    <div class="float-right">
        <button type="submit" class="btn btn-secondary"><i class="ion ion-ios-redo"></i> bestätigen und weiter zur Kasse</button>
    </div>
    <br><br>
    <em class="small text-center"> <i class="fa fa-lock"></i> Du wirst auf unseren checkout Server weitergeletet, die Verbindung ist SSL verschlüsselt.</em>
        @endif

@endif