@php use App\Libraries\CartChannel; @endphp
<div>
    <!-- area_top -->
    <div class="area_top d-flex justify-content-start align-items-center flex-wrap mb-5">
        <!-- backpage -->
        <div class="backpage">
            <a href="#" onclick="history.back(-1);return false;"
               class="text-brown01 text-decoration-none fs-2 position-relative ps-5 link-opacity-50">回上頁
            </a>
        </div>
    </div>

    <!-- purchased_items sp -->
    <div class="purchased_items sp d-block d-md-none border border-1 border-brown01 m-0 p-4">
        <h2 class=" m-0 fs-1">
            <a class="d-flex justify-content-between align-items-center text-decoration-none collapsed"
               data-bs-toggle="collapse" data-bs-target="#item" aria-expanded="true" aria-controls="item">
                已選購商品
                <i class="fa-solid fa-angle-up"></i>
            </a>
        </h2>

        <div id="item" class="accordion-collapse collapse">
            <ul class="product_box m-0 mt-3 p-0">

                @foreach($cartContent as $item)
                    <livewire:product.special-promotion-cart-item :item="$item" :key="uniqid()"/>
                @endforeach


            </ul>
            <div class="under_box border-top border-1 border-brown01 mt-4 pt-4">
                <p>已選購
                    <span class="px-2">{{ $countItemsInCart }}</span>
                    件
                </p>
                <ul class="d-flex justify-content-start align-content-center m-0 p-0">
                    <li>原價
                        <span class="px-2">{{ $cartTotal }}</span>
                        元
                    </li>
                    <li>折扣價
                        <span class="px-2">{{ $discount }}</span>
                        元
                    </li>
                </ul>
                <p class="m-0 mt-4">
                    <a href="{{ route("foreground.cart.checkIndex", [CartChannel::SpecialPromotion->value]) }}"
                       class="rounded text-decoration-none">
                        <input class="Btns-Sans rounded w-100" type="submit" value="結帳">
                    </a>
                </p>
            </div>
        </div>
    </div>

    <!-- optional_title -->
    <p class="optional_title fs-1 mb-5 mt-5 mt-md-0">任選
        <span class="px-2">{{ $couponAboveLimit }}</span>
        件
        <span class="px-2">{{ $couponModelDiscountValue }}</span>
        元
    </p>
</div>