@extends('layouts.email', ['width' => '100%'])
@section('content')
    <div class="upper-div">
        <div class="title">Kedves {{ $name }}!</div>
        <div class="text text-0">
            A rendelésed (Rendelési azonosító: #{{ $order->id }}) sikeresen elkészült. Köszönjük, hogy nálunk vásároltál!
        </div>
        <div class="order-details">
            <div class="top-details">
                <div class="title">Számlázási cím:</div>
                <div class="flex">
                    <div class="data"><b>Név:</b> {{ $order->name }}</div>
                    <div class="data"><b>Irányítószám:</b> {{ $order->postal_code }}</div>
                    <div class="data"><b>Település:</b> {{ $order->city }}</div>
                </div>
                <div class="flex">
                    <div class="data"><b>Utca és házszám:</b> {{ $order->street }}</div>
                    <div class="data"><b>Telefonszám:</b> {{ $order->phone }}</div>
                    <div class="data"><b>Email:</b> {{ $order->user->email }}</div>
                </div>
                <div class="spacer-0"></div>
                <div class="title">Szállítási cím:</div>
                <div class="flex">
                    <div class="data"><b>Név:</b> {{ $order->shipping_name }}</div>
                    <div class="data"><b>Irányítószám:</b> {{ $order->shipping_postal_code }}</div>
                    <div class="data"><b>Település:</b> {{ $order->shipping_city }}</div>
                    <div class="data"><b>Utca és házszám:</b> {{ $order->shipping_street }}</div>
                </div>
                <div class="spacer-0"></div>
                <div class="flex">
                    <div class="title">Megrendelés dátuma:</div>
                    <div class="data no-margin-bottom big">&nbsp;&nbsp;&nbsp;{{ convertToTimezone($order->created_at) }}</div>
                </div>
                <div class="spacer-0"></div>
                <div class="flex">
                    <div class="title">Státusz:</div>
                    <div class="data no-margin-bottom big">&nbsp;&nbsp;&nbsp;{{ $order->status->label() }}</div>
                </div>
                <div class="spacer-0"></div>
                <div class="flex">
                    <div class="title">Szállítási költség:</div>
                    <div class="data no-margin-bottom big">&nbsp;&nbsp;&nbsp;{{ $order->shipping_price }} Ft</div>
                </div>
                <div class="spacer-0"></div>
                <div class="flex">
                    <div class="title">Fizetve a termékekért:</div>
                    <div class="data no-margin-bottom big">&nbsp;&nbsp;&nbsp;{{ $order->paid_price }} Ft</div>
                </div>
            </div>
            <div class="spacer-0"></div>
            <div class="title text-left">Megrendelt termékek:</div>
            <div class="spacer-0"></div>
            <table class="w-100 custom-table">
                <thead>
                    <th></th>
                    <th>Terméknév</th>
                    <th>db.</th>
                    <th>Ár</th>
                    <th>Ár össz.</th>
                </thead>
                <tbody>
                    <tr>
                        <td class="spacer">
                            &nbsp;
                        </td>
                    </tr>
                    @foreach ($order->orderItems as $item)
                        <tr class="green">
                            <td class="first"><img
                                    src="{{ env('APP_URL') }}/storage/product_images/{{ $item->product->id }}.{{ $item->product->image_extension }}"
                                    alt="{{ $item->product->name }}" width="50"></td>
                            <td>{{ $item->product->name }}</td>
                            <td>{{ $item->quantity }}</td>
                            <td>{{ $item->price }} Ft</td>
                            <td class="last">{{ $item->price * $item->quantity }} Ft</td>
                        </tr>
                        <tr>
                            <td class="spacer">
                                &nbsp;
                            </td>
                        </tr>
                    @endforeach
                    <tr>
                        <td class="spacer">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td><b>Összesen:</b></td>
                        <td></td>
                        <td></td>
                        <td><b>{{ $order->orderItems->sum(fn($item) => $item->price * $item->quantity) }} Ft</b></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="green">
        <div class="text text-2">Üdvözlettel,<br>{{ env('APP_NAME') }}</div>
    </div>
@endsection