@extends('layouts.site')

@section('title', $lot->title.' - Auctions Ontario')

@section('content')
  @include('partials.page-banner', ['title' => 'Item Details'])

  <section class="ct_py_80">
    <div class="container">
      <div class="row">
        <div class="col-lg-7">
          <div class="d-flex justify-content-between align-items-end flex-wrap gap-3">
            <div>
              <h2 class="at-contact-title mb-3 fs-5">{{ $lot->title }}</h2>

              <p class="mb-2 ct_fs_14"><strong>Lot # :</strong> {{ $lot->lot_number }}</p>

              <p class="mb-2 ct_fs_14">
                <strong>Category :</strong> {{ $lot->category->name ?? 'Uncategorized' }}
              </p>

              <p class="mb-0 ct_fs_14">
                <strong>Auctioneer :</strong> {{ $lot->auction->auctioneer->name }}
              </p>
            </div>
          </div>

          <div class="at-product-preview mt-4">
            <img src="{{ asset($lot->cover_image ?? 'assets/img/item_big.png') }}" class="img-fluid w-100" alt="{{ $lot->title }}" />
          </div>

          <div class="row g-3 mt-2">
            @forelse ($lot->images as $image)
              <div class="col-3">
                <div class="at-gallery-thumb @if ($loop->first) active @endif">
                  <img src="{{ asset($image->path) }}" class="img-fluid" alt="" />
                </div>
              </div>
            @empty
              <div class="col-3">
                <div class="at-gallery-thumb active">
                  <img src="{{ asset($lot->cover_image ?? 'assets/img/item_big.png') }}" class="img-fluid" alt="" />
                </div>
              </div>
            @endforelse
          </div>

          <h3 class="at-section-heading mt-5">Description</h3>
          <p>{{ $lot->description }}</p>

          <p class="mb-1"><strong>Condition:</strong> {{ $lot->condition }}</p>

          <div class="at-bid-card mt-5 rounded">
            <h3 class="at-section-heading">Auctioneer</h3>

            <div class="row align-items-center">
              <div class="col-md-4 text-center mb-4 mb-md-0">
                <img
                  src="{{ asset($lot->auction->auctioneer->logo_path ?? 'assets/img/2_guy.png') }}"
                  class="img-fluid at-auctioneer-logo"
                  alt="{{ $lot->auction->auctioneer->name }}"
                />
              </div>

              <div class="col-md-8">
                <ul class="at-auctioneer-info">
                  <li>{{ $lot->auction->auctioneer->name }}</li>
                  <li>{{ $lot->auction->auctioneer->location }}</li>
                  @if ($lot->auction->auctioneer->phone)
                    <li>{{ $lot->auction->auctioneer->phone }}</li>
                  @endif
                  @if ($lot->auction->auctioneer->email)
                    <li>
                      <a href="mailto:{{ $lot->auction->auctioneer->email }}">Email Auctioneer</a>
                    </li>
                  @endif
                </ul>
              </div>
            </div>
          </div>
        </div>

        <div class="col-lg-5">
          <div class="at-bid-card rounded">
            <div class="d-flex justify-content-between align-items-end">
              <div>
                <p class="at-bid-label">Current Highest Bid</p>

                <h2 class="at-current-price">
                  $ {{ number_format($lot->current_bid ?? $lot->starting_bid, 2) }}
                  <span>CAD</span>
                </h2>
              </div>

              <span class="at-bids-count">{{ $lot->bid_count }} Bids</span>
            </div>

            <hr />

            <div class="row">
              <div class="col-6">
                <p class="at-bid-label">Starting Bid</p>
                <h5 class="ct_fw_600">$ {{ number_format($lot->starting_bid, 2) }} CAD</h5>
              </div>

              @if ($lot->ends_at)
                <div class="col-6 text-end">
                  <p class="at-bid-label">Ends</p>
                  <h5 class="ct_fw_600">{{ $lot->ends_at->format('M j, g:ia') }}</h5>
                </div>
              @endif
            </div>

            <hr />

            @if (session('status'))
              <div class="alert alert-success">{{ session('status') }}</div>
            @endif

            @auth
              <h4 class="at-section-heading">Place your Bid</h4>

              <p class="mb-3">
                Minimum Next Bid:
                <strong>$ {{ number_format(($lot->current_bid ?? $lot->starting_bid) + 1, 2) }} CAD</strong>
              </p>

              <form method="POST" action="{{ route('items.bid', $lot) }}">
                @csrf
                <div class="mb-3 position-relative">
                  <input
                    type="number"
                    step="0.01"
                    name="amount"
                    class="form-control checkout_input ps-5"
                    value="{{ old('amount', ($lot->current_bid ?? $lot->starting_bid) + 1) }}"
                    required
                  />
                  <span class="ct_show_left border-0 bg-transparent">$</span>
                </div>
                @error('amount')
                  <p class="text-danger">{{ $message }}</p>
                @enderror

                <button type="submit" class="ct_orange_btn w-100">PLACE BID</button>
              </form>

              <a href="{{ route('checkout', $lot) }}" class="at-outline-btn w-100 d-block text-center mt-3">
                PROCEED TO CHECKOUT
              </a>
            @else
              <p><a href="{{ route('login') }}">Log in</a> to place a bid on this item.</p>
            @endauth
          </div>

          <div class="at-bid-card mt-4 rounded">
            <h4 class="at-section-heading mb-4">Bid History</h4>

            <div class="table-responsive">
              <table class="table at-bid-history mb-0">
                <thead>
                  <tr>
                    <th>Bidder</th>
                    <th>Amount</th>
                    <th>Date</th>
                  </tr>
                </thead>

                <tbody>
                  @forelse ($lot->bids as $bid)
                    <tr>
                      <td>{{ $bid->user->name }}</td>
                      <td>${{ number_format($bid->amount, 2) }}</td>
                      <td>{{ $bid->created_at->format('M j, Y') }}</td>
                    </tr>
                  @empty
                    <tr>
                      <td colspan="3">No bids yet. Be the first to bid!</td>
                    </tr>
                  @endforelse
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>

      @if ($relatedLots->isNotEmpty())
        <h2 class="at-contact-title mb-0 mt-5">Related Auction Items</h2>

        <div class="et_auction_grid mt-4">
          @foreach ($relatedLots as $related)
            @include('partials.lot-card', ['lot' => $related])
          @endforeach
        </div>
      @endif
    </div>
  </section>
@endsection