@extends('layout.master')
@section('content')

<meta name="csrf-token" content="{{ csrf_token() }}">

<style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            padding: 20px;
        }
        .product-container {
            border: 1px solid #ddd;
            padding: 20px;
            border-radius: 10px;
            width: 60%;
            margin: auto;
        }
        .product-images img {
            width: 150px;
            margin: 5px;
        }
    </style>
<div class="main-content app-content">
    <div class="container-fluid">

    
        <div class="d-md-flex d-block align-items-center justify-content-between page-header-breadcrumb">
            <div>
                <h2 class="main-content-title fs-24 mb-1">Product Detail</h2>
                <ol class="breadcrumb mb-0 w-auto">
                    <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Show</li>
                </ol>
            </div>
            <div class="d-flex">
            </div>
        </div>
        <div class="row card custom-card">
            <div class="card-body">
               
                <div class="product-container">
                    <h2>Product Details</h2>
                    <p><strong>SKU:</strong> {{ $product['sku'] }}</p>
                    <p><strong>Name:</strong> {{ $product['product_name'] }}</p>
                    <p><strong>Detail:</strong> {{ $product['product_detail'] }}</p>
                    <p><strong>Short Detail:</strong> {{ $product['product_short_detail'] }}</p>
                    <p><strong>Price:</strong> ${{ $product['price'] }}</p>
                    <p><strong>Sale Price:</strong> ${{ $product['sale_price'] }}</p>
                    <p><strong>Available Quantity:</strong> {{ $product['available_quantity'] }}</p>
                    <p><strong>Marketplace:</strong> {{ $product['marketplace_id'] }}</p>
                    <p><strong>Format:</strong> {{ $product['format'] }}</p>
                    <p><strong>Listing Duration:</strong> {{ $product['listing_duration'] }}</p>
                    
                    <h3>Supplier Information</h3>
                    <p><strong>Company Name:</strong> {{ $product['supplier']['company_name'] ?? "No Supplier"}}</p>
                    <p><strong>Contact:</strong> {{ $product['supplier']['contact_name'] ?? "No Supplier" }}</p>
                    <p><strong>Email:</strong> {{ $product['supplier']['email'] ?? "No Supplier" }}</p>
                    <p><strong>Phone:</strong> {{ $product['supplier']['phone'] ?? "No Supplier"}}</p>
                    <p><strong>City:</strong> {{ $product['supplier']['city'] ?? "No Supplier"}}</p>
                    <p><strong>Country:</strong> {{ $product['supplier']['country'] ?? "No Supplier"}}</p>
                    
                    <h3>Product Images</h3>
                    <div class="product-images">
                        @foreach($product['images'] as $image)
                            <img src="{{ $image['image_url'] }}" alt="Product Image">
                        @endforeach
                    </div>
                </div>
               



            </div>
        </div>

    </div>
</div>



@endsection