@extends('layouts.public.app')
@php
    $images = @$product->getimages
        ? @$product->getimages
            ->whereNull('deleted_at')
            ->whereIn('section', ['mainimage', 'gallery','packageimage'])
            ->groupby('section')
        : '';
@endphp

@section('title', @$product['name'] . ' | Chemical Wholesale')
@section('description'){{ isset($product['description']) && strlen($product['description']) > 20 
    ? Str::limit(strip_tags($product['description']), 160) 
    : 'Buy high-quality ' . ($product['name'] ?? 'chemicals') . ' from trusted suppliers on ChemicalWholesale. Fast shipping and competitive prices.' }}@endsection
@section('keywords'){{ isset($product['name']) 
        ? $product['name'] . ', buy ' . $product['name'] . ', wholesale ' . $product['name'] . ', bulk ' . $product['name'] . ', ' . $product['name'] . ' supplier, ' . $product['name'] . ' manufacturer'
        : 'Chemical Wholesale, bulk chemicals, chemical suppliers, buy chemicals online, industrial chemicals' }}@endsection
@section('metaimage', !empty($images['mainimage']) ? @$images['mainimage']->first()->path : asset('img/logo-lg2.png'))

@section('content')
    <div class="greybg">
        <div class="search-keywords">
            <div class="container-fluid">
                <p class="search-keywords-text">Category > <a href="#!">{{ @$product['name'] }} </a></p>
            </div>
        </div>
        <div class="detail-container mt-3 pb-5">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-6">
                        <div class="detail-main-img">
                            <img src="{{ !empty($images['mainimage']) ? @$images['mainimage']->first()->path : '' }}"
                                onclick="loadlightBox(1)" class="img-fluid" onerror="src='/assets/img/noimg.jpg'">
                        </div>
                        @if (@$images['gallery'] || @$images['packageimage'] )
                            <div class="detail-gallery-img mt-2">
                                <div class="d-flex mt-2">
                                    @php
                                        $product_images = 0;
                                        $all_images = collect($images['gallery'] ?? [])
                                                        ->merge($images['packageimage'] ?? [])
                                                        ->sortBy('order_number')
                                                        ->values();
                                    @endphp
                        
                                    @foreach ($all_images as $key => $img)
                                        @if ($product_images < 5)
                                            <img src="{{ @$img->path }}" onclick="loadlightBox({{ $key + 2 }})"
                                                class="img-fluid me-2" onerror="src='/assets/img/noimg.jpg'">
                                            @php $product_images++; @endphp
                                        @else
                                        @break
                                    @endif
                                @endforeach
                            </div>
                            <div id="lightgallery" style="display: none">
                                <a href="{{ !empty($images['mainimage']) ? @$images['mainimage']->first()->path : '' }}"
                                    data-sub-html="<h4>{{ @$product['name'] }}</h4><p>Product Image</p>">
                                    <img
                                        src="{{ !empty($images['mainimage']) ? @$images['mainimage']->first()->path : '' }}" />
                                </a>
                                @foreach ($all_images as $key => $lb_img)
                                    <a href="{{ @$lb_img->path }}"
                                        data-sub-html="<h4>{{ @$product['name'] }} {{ @$lb_img['section'] == 'packageimage' ? ' - Package Image':''}}</h4><p>Image {{ $key + 2 }}</p>">
                                        <img src="{{ @$lb_img->path }}" />
                                    </a>
                                @endforeach
                            </div>
                        </div>
                    @endif
                </div>
                <div class="col-xl-6">
                    <div class="product-detail">
                        <div class="product-header">
                            <h1 class="product-title">
                                {{ @$product['name'] }}
                            </h1>
                            <div class="d-flex align-items-center">
                                @auth
                                    <a class="btn-chatnow chat-button" chat_id="{{ @$hasChat['id'] ?: '0' }}"
                                        data-chatname="{{ $product['name'] }} - {{ $product['getBusiness']['company'] }}">
                                        <i class="bi bi-chat-square-text pe-1"></i>
                                        Ask Questions
                                    </a>
                                @endauth
                                @guest
                                    <a class="btn-chatnow chat-button" data-bs-target="#login" data-bs-toggle="modal">
                                        <i class="bi bi-chat-square-text pe-1"></i>
                                        Ask Questions
                                    </a>
                                @endguest
                                <a href="" class="btn-circle d-none">
                                    <i class="bi bi-heart"></i>
                                </a>
                            </div>
                        </div>
                        <div class="product-details">
                            <p class="product-subheading">Product Code: {{ @$product['product_sku'] }} |
                                @if (count($product['assignedCategory']) > 0)
                                    Category:
                                    @foreach ($product['assignedCategory'] as $productCategory)
                                        <span class="badge bg-secondary">
                                            {{ $productCategory['getCategory']['name'] }}</span>
                                    @endforeach
                                @endif
                            <div class="pricing d-flex align-items-center">
                                @php
                                    $productPrice = 0;

                                    if (
                                        !empty($product) &&
                                        !empty($product->getpackage) &&
                                        $product->getpackage->count()
                                    ) {
                                        foreach ($product->getpackage as $package) {
                                            $productPrice = number_format(@$package->price, 2);
                                            break;
                                        }
                                    }
                                @endphp
                                <p class="price">$<span id="product_package_price">{{ $productPrice }}</span>
                                </p>
                                <p class="price-info ps-2">
                                <div class="cw-custom-select-wrapper">
                                    <div class="cw-custom-select-box">
                                        <span class="cw-selected-option">
                                            @if (!empty($product) && @$product->getpackage->count())
                                                @foreach ($product->getpackage as $package)
                                                    @if ($loop->first)
                                                        {{ ucfirst(string: @$package->packaging_type) == 'Other' ? ucfirst(@$package->other_packaging_type) : ucfirst(@$package->packaging_type) }}
                                                    @endif
                                                @endforeach
                                            @endif
                                        </span>
                                        <ul class="cw-custom-select-options">
                                            @if (!empty($product) && @$product->getpackage->count())
                                                @foreach ($product->getpackage as $package)
                                                    <li data-value="{{ ucfirst(string: @$package->packaging_type) == 'Other' ? ucfirst(@$package->other_packaging_type) : ucfirst(@$package->packaging_type) }}"
                                                        data-price="{{ number_format(@$package->price, 2) }}"
                                                        data-id="{{ @$package->id }}" data-minqty="{{ @$package->min_quantity }}">
                                                        <div class="cw-custom-select-item">
                                                            <div class="cw-cs-info">
                                                                <span class="fw-bold">
                                                                    {{ @$package['net_weight'] ?: 'N.A' }}
                                                                    @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['net_weight']))
                                                                        {{ @$package['measurement_units'] == 'metric' ? 'kg' : 'lb' }}
                                                                    @endif
                                                                </span>
                                                                <span>
                                                                    <span class="type-badge"
                                                                        style="white-space: nowrap">{{ ucfirst(@$package->packaging_type) == 'Other' ? ucfirst(@$package->other_packaging_type) : ucfirst(@$package->packaging_type) }}
                                                                    </span>
                                                                </span>
                                                            </div>
                                                            <div class="cw-cs-pricing">
                                                                <span>${{ number_format(@$package->price, 2) }}</span>
                                                            </div>
                                                        </div>
                                                    </li>
                                                @endforeach
                                            @endif
                                        </ul>
                                    </div>
                                </div>
                                </p>
                            </div>
                            <div class="product-description">
                                {{ @$product['sort_description'] }}
                                <a href="#knowmore-anchor" class="btn-link">Know More</a>
                            </div>
                            {{--
                            <div class="product-info">
                                <div class="product-info-card">
                                    Packaging:
                                    <span id="product-info-card-type">
                                        @if (!empty($product) && @$product->getpackage->count())
                                            @foreach ($product->getpackage as $package)
                                                @if ($loop->first)
                                                    {{ ucfirst(@$package->packaging_type) }}
                                                @endif
                                            @endforeach
                                        @endif
                                    </span>
                                </div>
                                <div class="product-info-card">
                                    MOQ:
                                    1
                                </div>
                            </div> --}}

                            <div class="card mt-2 mb-3">
                                <div class="table-responsive">
                                    <table class="table cwtable product-details">
                                        <thead class="bg-light">
                                            <tr>
                                                <th scope="col" class="text-secondary">Sale Option</th>
                                                <th scope="col" class="text-secondary">Weight</th>
                                                <th scope="col" class="text-secondary">Price</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if (!empty($product) && @$product->getpackage->count())
                                                @foreach ($product->getpackage as $package)
                                                    <tr>
                                                        <th scope="row">
                                                            {{ ucfirst(@$package->packaging_type) == 'Other' ? ucfirst(@$package->other_packaging_type) : ucfirst(@$package->packaging_type) }}
                                                        </th>
                                                        <td>
                                                            {{ @$package['net_weight'] ?: 'N.A' }}
                                                            @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['net_weight']))
                                                                {{ @$package['measurement_units'] == 'metric' ? 'kg' : 'lb' }}
                                                            @endif
                                                        </td>
                                                        <td>${{ number_format(@$package->price, 2) }}
                                                        </td>
                                                    </tr>
                                                @endforeach
                                            @endif
                                        </tbody>
                                    </table>
                                </div>

                            </div>

                            <div id="knowmore-anchor">
                                <form action="{{ route('public.checkout_session') }}" id="checkoutForm" method="post">
                                    @csrf
                                    <div class="product-form">
                                        <div class="row">
                                            <div class="col-6">
                                                <input type="text" value="{{ @$product->uuid }}" name="product_id[]"
                                                    hidden>
                                                @if (!empty($product) && @$product->getpackage->count())
                                                    @foreach ($product->getpackage as $package)
                                                        @if ($loop->first)
                                                            <input type="text" id="cw-packageSelect"
                                                                name="package_id[]" value="{{ @$package['id'] }}"
                                                                hidden>
                                                        @endif
                                                    @endforeach
                                                @endif
                                                <div class="input-group">
                                                    <span class="input-group-btn">
                                                        <button class="btn btn-minus fw-bold" type="button">-</button>
                                                    </span>
                                                    <input type="number" class="text-center product-qty" maxlength="3"
                                                        min="1" step="1" value="1" readonly id="minproductQty" aria-label="quantity"
                                                        name="product_qty[]">
                                                    <span class="input-group-btn">
                                                        <button class="btn btn-plus fw-bold" type="button">+</button>
                                                    </span>
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <a onclick="addcart()" class="btn-cart d-block">
                                                    <i class="bi bi-cart-dash me-2"></i>
                                                    Add to Cart
                                                </a>
                                            </div>
                                        </div>
                                        @auth
                                            <button type="submit" class="btn-buynow d-block mt-3 w-100">
                                                <i class="bi bi-basket3 me-2"></i>
                                                Buy Now
                                            </button>
                                        @endauth
                                        @guest
                                            <a data-bs-toggle="modal" data-bs-target="#login"
                                                class="btn-buynow d-block mt-3 w-100">
                                                <i class="bi bi-basket3 me-2"></i>
                                                Buy Now
                                            </a>
                                        @endguest
                                    </div>
                                </form>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="product-detail-desc-card">
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="nav-link active" id="description-tab" data-bs-toggle="tab"
                            data-bs-target="#description-tab-pane" type="button" role="tab"
                            aria-selected="true">Description</button>
                    </li>
                    @if (!empty($product) && @$product->getoptions->count())
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="options-tab" data-bs-toggle="tab" data-bs-target="#options"
                                type="button" role="tab" aria-selected="false">Options</button>
                        </li>
                    @endif
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="packaging-tab" data-bs-toggle="tab" data-bs-target="#packaging"
                            type="button" role="tab" aria-selected="false">Packaging</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="shipping-tab" data-bs-toggle="tab" data-bs-target="#shipping"
                            type="button" role="tab" aria-selected="false">Shipping</button>
                    </li>
                </ul>
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="description-tab-pane" role="tabpanel" tabindex="0">
                        <p class="">
                            {{ @$product['description'] }}
                        </p>
                    </div>
                    <div class="tab-pane fade" id="options" role="tabpanel" tabindex="0">
                        <table class="table table-bordered mt-3 table-type2">
                            <tbody>
                                <thead>
                                    <tr>
                                        <td>Attribute name</td>
                                        <td>Value</td>
                                        <td>Description</td>
                                    </tr>
                                </thead>
                                @if (!empty($product) && @$product->getoptions->count())
                                    @foreach ($product->getoptions as $options)
                                        <tr>
                                            <td>{{ @$options['attribute_name'] }}</td>
                                            <td>{{ @$options['attribute_value'] }}</td>
                                            <td>{{ @$options['attribute_description'] }}</td>
                                        </tr>
                                    @endforeach
                                @endif
                            </tbody>
                        </table>
                    </div>
                    <div class="tab-pane fade" id="packaging" role="tabpanel" tabindex="0">
                        <div class="row">
                            <div class="col-lg-12">
                                @if (!empty($product) && @$product->getpackage->count())
                                    @foreach ($product->getpackage as $package)
                                        <table
                                            class="table table-bordered mt-3 table-type1 package-table {{ $loop->first ? 'active' : '' }}"
                                            id="packagetable{{ $package['id'] }}">
                                            <tbody>
                                                <tr>
                                                    <td>Packaging Type</td>
                                                    <td>{{ ucfirst(string: @$package->packaging_type) == 'Other' ? ucfirst(@$package->other_packaging_type) : ucfirst(@$package->packaging_type) }}
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Packaging Description</td>
                                                    <td>{{ ucfirst(@$package->description) }}</td>
                                                </tr>
                                                <tr>
                                                    <td>Net Weight</td>
                                                    <td>{{ @$package['net_weight'] ?: 'N.A' }}
                                                        @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['net_weight']))
                                                            {{ @$package['measurement_units'] == 'metric' ? 'kg' : 'lb' }}
                                                        @endif
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Shipping Weight</td>
                                                    <td>{{ @$package['shipping_weight'] ?: 'N.A' }}
                                                        @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['shipping_weight']))
                                                            {{ @$package['measurement_units'] == 'metric' ? 'kg' : 'lb' }}
                                                        @endif
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Shipping Length x Width x Height</td>
                                                    <td>{{ @$package['shipping_length'] ?: 'N.A' }}
                                                        @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['shipping_length']))
                                                            {{ @$package['measurement_units'] == 'metric' ? 'cm' : 'in' }}
                                                        @endif
                                                        x
                                                        {{ @$package['shipping_width'] ?: 'N.A' }}
                                                        @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['shipping_width']))
                                                            {{ @$package['measurement_units'] == 'metric' ? 'cm' : 'in' }}
                                                        @endif
                                                        x
                                                        {{ @$package['shipping_height'] ?: 'N.A' }}
                                                        @if (isset($package['measurement_units']) && $package['measurement_units'] && is_numeric(@$package['shipping_height']))
                                                            {{ @$package['measurement_units'] == 'metric' ? 'cm' : 'in' }}
                                                        @endif
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    @endforeach
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="options" role="tabpanel" tabindex="0">
                        <table class="table table-bordered mt-3 table-type1">
                            <tbody>
                                <tr>
                                    <td>Measurement Units</td>
                                    <td>ucfirst(@$product['getPackage']['measurement_units'])</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="tab-pane fade" id="shipping" role="tabpanel" tabindex="0">
                        @foreach (@$product->getPackage as $package)
                            <table
                                class="table table-bordered mt-3 table-type1 shipping-table {{ $loop->first ? 'active' : '' }}"
                                id="shippingtable{{ $package['id'] }}">

                                <tbody>
                                    <tr>
                                        <td>Regulated for transportation?</td>
                                        <td>{{ @$package->getpackageshipping->regulated_transportation == '1' ? 'Yes' : 'No' }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Ship the product individually?</td>
                                        <td>{{ @$package->getpackageshipping->ship_product == '1' ? 'Yes' : 'No' }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Required hazard label</td>
                                        <td>{{ ucfirst(@$package->getpackageshipping->hazard_label) ?: 'N.A' }}</td>
                                    </tr>
                                    <tr>
                                        <td>Free Shipping</td>
                                        <td>{{ @$package->getpackageshipping->free_shipping == '1' ? 'Yes' : 'No' }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Fixed shipping price</td>
                                        <td>${{ number_format(@$package->getpackageshipping->shipping_price, 2) ?: 'N.A' }}
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        @endforeach
                    </div>
                </div>
            </div>

            <div class="detail-supplier-info">
                <div class="detail-page-card">
                    <div class="detail-page-card-header">
                        Supplier Information
                    </div>
                    <div class="detail-page-card-body">
                        <div class="row">
                            <div class="col-lg-8">
                                <div class="supplier-info-detail">
                                    <img src="{{ @$product['getBusiness']['getLogo']['path'] }}" alt="suppliers"
                                        onerror="src='/assets/img/noimg.jpg'" class="supplier-info-detailimg">
                                    <div class="supplier-info-detailtext">
                                        <div class="supplier-info-detailtitle">
                                            <a
                                                href="{{ route('public.supplier.profile', @$product['getBusiness']['slug']) }}">
                                                <h3 class="supplier-info-detailname mb-0">
                                                    {{ @$product['getBusiness']['company'] ?: 'Chemical Store' }}
                                                </h3>
                                            </a>
                                            @if (@$product->getbusiness->verified == '1')
                                                <img src="/assets/img/icons/verified.png" alt="verified"
                                                    class="ms-2">
                                            @endif
                                        </div>

                                        @php
                                            $supplierRatingCount = @$product->getbusiness->getSupplierRating->count();
                                            $saverageRating = @$product->getbusiness->getSupplierRating->avg('rating');
                                            $sfilledStars = (int) $saverageRating;
                                            $shalfStar = $saverageRating - $sfilledStars >= 0.5;
                                        @endphp
                                        @php
                                            $product_location =
                                                @$product->getavailability->getwarehouse->getcountry->name_en ?:
                                                @$product->getavailability->getcountry->name_en;
                                        @endphp
                                        <p class="py-lg-2 py-1 supplier-info-detailp">
                                            Location: {{ $product_location ?: '' }}
                                            |
                                            <span class="d-block d-md-inline">Rating:
                                                <span class="star-rating ms-2">
                                                    @for ($i = 1; $i <= 5; $i++)
                                                        @if ($i <= $sfilledStars)
                                                            <i class="bi bi-star-fill"></i>
                                                        @elseif ($i == $sfilledStars + 1 && $shalfStar)
                                                            <i class="bi bi-star-half"></i>
                                                        @else
                                                            <i class="bi bi-star"></i>
                                                        @endif
                                                    @endfor
                                                </span>
                                                ({{ @$supplierRatingCount ?: '0' }})
                                            </span>
                                        </p>
                                        <div class="pt-1 pt-lg-3 product-detail-supplierbtns">
                                            <a href="{{ route('public.supplier.products', @$product['getBusiness']['slug']) }}"
                                                class="btn-blue">View All Products</a>
                                            <a href="{{ route('public.supplier.profile', @$product['getBusiness']['slug']) }}"
                                                class="btn-blue-outline">View Profile</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 d-flex flex-column justify-content-center border-lg-left">
                                <div class="row justify-content-end">
                                    <div class="col-lg-8 mb-2">
                                        <div class="card2 h-100">
                                            <div class="card2-header">
                                                Supplier Information
                                            </div>
                                            <div class="card2-body d-flex justify-content-center">
                                                <div class="circlePercent" id="circleprogress" data-id="60">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {{--
                                    <div class="col-lg-4 mb-2">
                                        <div class="card2 h-100">
                                            <div class="card2-header">
                                                Response Time
                                            </div>
                                            <div class="card2-body d-flex justify-content-center">
                                                <div class="mt-4">
                                                    <p>Less Than</p>
                                                    <h5 style="color: #63ce00;font-size: 36px;font-weight:600">1 Hr
                                                    </h5>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mb-2">
                                        <div class="card2 h-100">
                                            <div class="card2-header">
                                                Report Seller
                                            </div>
                                            <div class="card2-body d-flex justify-content-center">
                                                <div class="mt-lg-4 text-center">
                                                    <p class="mb-1">Have an Issue?</p>
                                                    <a href="" class="btn btn-outline-danger fw-bold"
                                                        style="font-size: 12px;border-width:2px">Report Now</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div> --}}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="detail-page-card">
                <div class="detail-page-card-header">
                    <div class="d-flex align-items-center justify-content-between">
                        <div>Rating and Reviews</div>
                        <a href="{{ route('public.product_review', $product['uuid']) }}" class="btn btn-light">Rate
                            Product</a>
                    </div>
                </div>

                <div class="detail-page-card-body">
                    <div class="detail-page-review-row row py-lg-4 pb-4">
                        @php
                            $averageRating = @$reviews->avg('rating');
                            $filledStars = (int) $averageRating;
                            $halfStar = $averageRating - $filledStars >= 0.5;
                        @endphp
                        <div class="col-lg-4 col-6">
                            <div class="px-lg-3" style="border-right: 2px solid #ddd">
                                <div class="review-heading">Total Reviews</div>
                                <div class="review-rate d-flex align-items-center">
                                    {{ count(@$reviews) }}

                                    @if ($averageRating >= 4)
                                        <span class="badge bg-success rounded-pill ms-2">Excellent</span>
                                    @elseif ($averageRating >= 2)
                                        <span class="badge bg-success rounded-pill ms-2">Good</span>
                                    @else
                                        <span class="badge bg-success rounded-pill ms-2">Satisfied</span>
                                    @endif
                                </div>
                                <div class="review-subheading">Total review(s)</div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-6">
                            <div class="px-lg-3 border-rating-right">
                                <div class="review-heading">Average Rating</div>
                                <div class="review-rate d-flex align-items-center">
                                    {{ number_format(@$reviews->avg('rating'), 1) }}
                                    <span class="star-rating ms-2">
                                        @for ($i = 1; $i <= 5; $i++)
                                            @if ($i <= $filledStars)
                                                <i class="bi bi-star-fill"></i>
                                            @elseif ($i == $filledStars + 1 && $halfStar)
                                                <i class="bi bi-star-half"></i>
                                            @else
                                                <i class="bi bi-star"></i>
                                            @endif
                                        @endfor
                                    </span>
                                </div>
                                <div class="review-subheading">Total rating(s)</div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-12">
                            @php
                                $totalReviews = $reviews->count();
                                $ratingsCount = [
                                    5 => $reviews->where('rating', 5)->count(),
                                    4 => $reviews->where('rating', 4)->count(),
                                    3 => $reviews->where('rating', 3)->count(),
                                    2 => $reviews->where('rating', 2)->count(),
                                    1 => $reviews->where('rating', 1)->count(),
                                ];
                                $ratingPercentages = [];
                                foreach ($ratingsCount as $rating => $count) {
                                    $ratingPercentages[$rating] =
                                        $totalReviews > 0 ? ($count / $totalReviews) * 100 : 0;
                                }
                            @endphp
                            <div class="px-lg-3 py-2">

                                <div class="star-progress rating">
                                    @foreach ([5, 4, 3, 2, 1] as $rating)
                                        <div class="single-progress">
                                            <div class="d-flex align-items-center">
                                                <h6 class="single-progress-rate">
                                                    <i class="bi bi-star-fill"></i> {{ $rating }}
                                                </h6>
                                            </div>
                                            <div class="progress" role="progressbar" aria-valuemin="0"
                                                aria-valuemax="100">
                                                <div class="progress-bar"
                                                    style="width: {{ $ratingPercentages[$rating] }}%">
                                                </div>
                                            </div>
                                            <div class="progress-percent">
                                                <h6>{{ number_format($ratingPercentages[$rating], 0) }}%</h6>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>

                            </div>
                        </div>
                    </div>
                    <div style="border-top: 1px solid #ddd" id="reviews-container">

                    </div>


                </div>
            </div>


            @if (count($related_products) > 0)
                <div class="detail-page-card">
                    <div class="detail-page-card-header">
                        Related Products
                    </div>

                    <div class="detail-page-card-body pb-2">

                        <div class="product-card-container">
                            <div class="row">
                                @foreach ($related_products as $rp)
                                    @php
                                        $images = @$rp->getimages ? @$rp->getimages->groupby('section') : '';
                                        $averageRating = @$rp->getreviews->avg('rating');
                                        $filledStars = (int) $averageRating;
                                        $halfStar = $averageRating - $filledStars >= 0.5;
                                    @endphp
                                    <div class="col-xl-3 col-lg-4 col-md-6">
                                        <div class="product-card mb-0">
                                            <div class="img-container">
                                                {{--
                                    <div class="review badge bg-primary">
                                        4.0 <i class="bi bi-star-fill small ms-1"></i>
                                    </div> --}}
                                                <img src="{{ !empty($images['mainimage']) ? @$images['mainimage']->first()->path : '' }}"
                                                    alt="product image" class="img-fluid"
                                                    onerror="src='/assets/img/noimg.jpg'">
                                            </div>
                                            <div class="product-details">
                                                <div class="title-container">
                                                    <p class="subtitle">
                                                        @if (count($rp['assignedCategory']) > 0)
                                                            Category:
                                                            @foreach ($rp['assignedCategory'] as $rpproductCategory)
                                                                <span class="badge bg-secondary">
                                                                    {{ $rpproductCategory['getCategory']['name'] }}</span>
                                                            @endforeach |
                                                        @endif
                                                        Rating:
                                                        <span class="star-rating ms-2">
                                                            @for ($i = 1; $i <= 5; $i++)
                                                                @if ($i <= $filledStars)
                                                                    <i class="bi bi-star-fill"></i>
                                                                @elseif ($i == $filledStars + 1 && $halfStar)
                                                                    <i class="bi bi-star-half"></i>
                                                                @else
                                                                    <i class="bi bi-star"></i>
                                                                @endif
                                                            @endfor
                                                        </span>
                                                        ({{ count(@$rp->getreviews) }})
                                                    </p>
                                                    <div class="title">
                                                        {{ @$rp['name'] }}
                                                    </div>
                                                </div>
                                                <div class="product-info">
                                                    <table class="product-info-table" style="width:100%">
                                                        <tr>
                                                            <td>Product SKU:</td>
                                                            <td>{{ @$product['product_sku'] }}</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Packaging:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            {{ ucfirst(@$package->packaging_type) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>MOQ:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            {{ ucfirst(@$package->min_quantity) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>Price:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            ${{ number_format(@$package->price, 2) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </div>
                                                <div class="supplier-info my-3 d-flex justify-content-between">
                                                    <div class="supplier-detail">
                                                        <p class="title">
                                                            {{ @$rp->getbusiness->company ?: 'N.A' }}
                                                            @if (@$rp->getbusiness->verified == '1')
                                                                <img src="/assets/img/icons/verified.png" alt="verified" style="height:20px">
                                                            @endif
                                                        </p>

                                                        @php
                                                            $rpsupplierRatingCount = @$rp->getbusiness->getSupplierRating->count();
                                                            $rpsupplieraverageRating = @$rp->getbusiness->getSupplierRating->avg(
                                                                'rating',
                                                            );
                                                        @endphp
                                                        <p class="supplier-text">
                                                            @php
                                                                $rp_location =
                                                                    @$rp->getavailability->getwarehouse->getcountry
                                                                        ->name_en ?:
                                                                    @$rp->getavailability->getcountry->name_en;
                                                            @endphp
                                                            From
                                                            <strong>{{ $rp_location ? ' ' . $rp_location : 'N.A' }}</strong>
                                                            @if ($rpsupplierRatingCount > 0)
                                                                |
                                                                Rating:
                                                                {{ number_format(@$rpsupplieraverageRating, 1) ?: '0.0' }}/5.0
                                                                ({{ @$rpsupplierRatingCount ?: 0 }} Reviews)
                                                            @endif
                                                        </p>
                                                    </div>
                                                </div>
                                                <a href="{{ route('public.product', ['seller' => trim(preg_replace('/[^a-z0-9]+/', '-', strtolower($rp['getBusiness']['company'] ?: 'product'))), 'id' => @$rp['slug']]) }}"
                                                    class="btn-product-card w-100 mb-2">View Details</a>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            @endif

            @if (count($supplier_products) > 0)
                <div class="detail-page-card">
                    <div class="detail-page-card-header">
                        More From this Supplier
                    </div>

                    <div class="detail-page-card-body pb-2">

                        <div class="product-card-container">
                            <div class="row">

                                @foreach ($supplier_products as $sp)
                                    @php
                                        $images = @$sp->getimages ? @$sp->getimages->groupby('section') : '';
                                        $averageRating = @$sp->getreviews->avg('rating');
                                        $filledStars = (int) $averageRating;
                                        $halfStar = $averageRating - $filledStars >= 0.5;
                                    @endphp
                                    <div class="col-xl-3 col-lg-4 col-md-6">
                                        <div class="product-card mb-0">
                                            <div class="img-container">
                                                {{--
                                    <div class="review badge bg-primary">
                                        4.0 <i class="bi bi-star-fill small ms-1"></i>
                                    </div> --}}
                                                <img src="{{ !empty($images['mainimage']) ? @$images['mainimage']->first()->path : '' }}"
                                                    alt="product image" class="img-fluid"
                                                    onerror="src='/assets/img/noimg.jpg'">
                                            </div>
                                            <div class="product-details">
                                                <div class="title-container">
                                                    <p class="subtitle">
                                                        @if (count($sp['assignedCategory']) > 0)
                                                            Category:
                                                            @foreach ($sp['assignedCategory'] as $spproductCategory)
                                                                <span class="badge bg-secondary">
                                                                    {{ $spproductCategory['getCategory']['name'] }}</span>
                                                            @endforeach |
                                                        @endif
                                                        Rating:
                                                        <span class="star-rating ms-2">
                                                            @for ($i = 1; $i <= 5; $i++)
                                                                @if ($i <= $filledStars)
                                                                    <i class="bi bi-star-fill"></i>
                                                                @elseif ($i == $filledStars + 1 && $halfStar)
                                                                    <i class="bi bi-star-half"></i>
                                                                @else
                                                                    <i class="bi bi-star"></i>
                                                                @endif
                                                            @endfor
                                                        </span>
                                                        ({{ count(@$sp->getreviews) }})
                                                    </p>
                                                    <div class="title">
                                                        {{ @$sp['name'] }}
                                                    </div>
                                                </div>
                                                <div class="product-info">
                                                    <table class="product-info-table" style="width:100%">
                                                        <tr>
                                                            <td>Product SKU:</td>
                                                            <td>{{ @$product['product_sku'] }}</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Packaging:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            {{ ucfirst(@$package->packaging_type) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>MOQ:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            {{ ucfirst(@$package->min_quantity) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>Price:</td>
                                                            <td>
                                                                @if (!empty($product) && @$product->getpackage->count())
                                                                    @foreach ($product->getpackage as $package)
                                                                        @if ($loop->first)
                                                                            ${{ number_format(@$package->price, 2) }}
                                                                        @endif
                                                                    @endforeach
                                                                @endif
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </div>
                                                <div class="supplier-info my-3 d-flex justify-content-between">
                                                    <div class="supplier-detail">
                                                        <p class="title">
                                                            {{ @$sp->getbusiness->company ?: 'N.A' }}
                                                            @if (@$sp->getbusiness->verified == '1')
                                                                <img src="/assets/img/icons/verified.png" alt="verified" style="height:20px">
                                                            @endif
                                                        </p>
                                                        @php
                                                            $spsupplierRatingCount = @$sp->getbusiness->getSupplierRating->count();
                                                            $spsupplieraverageRating = @$sp->getbusiness->getSupplierRating->avg(
                                                                'rating',
                                                            );
                                                        @endphp
                                                        <p class="supplier-text">
                                                            @php
                                                                $sp_location =
                                                                    @$sp->getavailability->getwarehouse->getcountry
                                                                        ->name_en ?:
                                                                    @$sp->getavailability->getcountry->name_en;
                                                            @endphp
                                                            From
                                                            <strong>{{ $sp_location ? ' ' . $sp_location : 'N.A' }}</strong>
                                                            @if ($spsupplierRatingCount > 0)
                                                                |
                                                                Rating:
                                                                {{ number_format(@$spsupplieraverageRating, 1) ?: '0.0' }}/5.0
                                                                ({{ @$spsupplierRatingCount ?: 0 }} Reviews)
                                                            @endif
                                                        </p>
                                                    </div>
                                                </div>
                                                <a href="{{ route('public.product', ['seller' => trim(preg_replace('/[^a-z0-9]+/', '-', strtolower($sp['getBusiness']['company'] ?: 'product'))), 'id' => @$sp['slug']]) }}"
                                                    class="btn-product-card w-100 mb-2">View Details</a>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            @endif

        </div>
    </div>
</div>
@endsection
@push('css')
<link rel="stylesheet" href="/assets/css/lightgallery.css" />
@endpush
@push('js')
<script src="/assets/js/custom.js"></script>
<script src="/assets/js/lightgallery.js"></script>

<script>
    lightGallery(document.getElementById("lightgallery"), {
        thumbnail: true,
        plugins: [lgThumbnail, lgVideo],
    });
</script>
<script>
    lightGallery(document.getElementById("reviewgallery-2"), {
        thumbnail: true,
        plugins: [lgThumbnail, lgVideo],
    });
</script>
<script>
    function loadlightBox(img_id) {
        $("#lightgallery a:nth-child(" + img_id + ") > img").trigger("click");
    }
</script>
<script>
    function loadreviewgallery(galleryid, img_id) {
        $("#" + galleryid + " a:nth-child(" + img_id + ") > img").trigger("click");
    }
</script>
<script>
    var productId = '{{ $product['uuid'] }}';

    function addcart() {

        $.ajax({
            headers: {
                "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
            },
            url: '{{ route('public.cart.add') }}',
            type: 'POST',
            dataType: 'json',
            data: {
                product_id: productId,
                product_qty: $(".product-qty").val(),
                package_id: $("#cw-packageSelect").val(),
            },
            success: function(response) {
                console.log(response);
                if (response.status == 'success') {
                    alertify.success(response.message);
                    getcartcount();
                } else {
                    alertify.error(response.message);
                }
            },
            error: function(xhr, status, error) {
                console.error(error);
                alertify.error('Failed to add product to cart');
            }
        });
    }
</script>
<script>
    $('.btn-minus').on('click', function() {
        if ($(this).parent().siblings('input').val() > 1) {
            $(this).parent().siblings('input').val(parseInt($(this).parent().siblings('input').val()) - 1);
            getQuantity();
        }
    })

    $('.btn-plus').on('click', function() {
        $(this).parent().siblings('input').val(parseInt($(this).parent().siblings('input').val()) + 1);
        getQuantity();
    })
</script>
@auth
    <script>
        $(".chat-button").on("click", function() {
            chat_id = $(".chat-button").attr("chat_id");
            $('#chat_id').val($(this).attr("chat_id"));
            $('#chatname').html($(this).attr("data-chatname"));
        });
    </script>
    @include('public.chat')
@endauth

<script>
    let page = 1;
    var productId = '{{ $product['uuid'] }}';

    function getreviews() {
        $.ajax({
            headers: {
                "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
            },
            url: '{{ route('public.productreviews') }}',
            type: 'POST',
            dataType: 'html',
            data: {
                id: productId,
                page: page,
            },
            success: function(response) {
                //console.log("Response received:", response);
                $('#reviews-container').html(response);
                page++;
            },
            error: function(xhr, status, error) {
                console.error("AJAX Error:", status, error);
                $('#reviews-container').text("An error occurred: " + error);
            }
        });
    }

    $(document).ready(function() {
        getreviews();
    });
</script>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const customSelectBox = document.querySelector('.cw-custom-select-box');
        const selectedOption = customSelectBox.querySelector('.cw-selected-option');
        const optionsList = customSelectBox.querySelector('.cw-custom-select-options');
        const selectElement = document.getElementById('cw-packageSelect');

        customSelectBox.addEventListener('click', function(event) {
            event.stopPropagation();
            customSelectBox.classList.toggle('open');
        });

        optionsList.addEventListener('click', function(event) {
            if (event.target.closest('li')) {
                const selectedLi = event.target.closest('li');
                const value = selectedLi.getAttribute('data-value');
                const price = selectedLi.getAttribute('data-price');
                const text = selectedLi.querySelector('.cw-cs-info span').textContent;

                selectedOption.textContent = value;
                selectElement.value = selectedLi.getAttribute('data-id');
                $('#product-info-card-type').html(value);
                $('#product_package_price').html(price);
                $('.package-table').removeClass('active');
                $('#packagetable' + selectedLi.getAttribute('data-id')).addClass('active');
                $('.shipping-table').removeClass('active');
                $('#shippingtable' + selectedLi.getAttribute('data-id')).addClass('active');
                $('#minproductQty').val(selectedLi.getAttribute('data-minqty'));
                
                customSelectBox.classList.remove('open');
                //alert(selectedLi.getAttribute('data-id'));
            }
            customSelectBox.classList.toggle('open');
        });

        document.addEventListener('click', function() {
            if (customSelectBox.classList.contains('open')) {
                customSelectBox.classList.remove('open');
            }
        });

    });
</script>
<script>
    function getQuantity() {
        $.ajax({
            headers: {
                "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
            },
            url: '{{ route('public.product_quantity') }}',
            type: 'POST',
            data: {
                id: productId,
                package_id: $("#cw-packageSelect").val(),
                qty: $(".product-qty").val(),
            },
            beforeSend: function() {
                $('body').append(
                    '<div class="blockUI" style="z-index: 10000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: fixed;"></div>'
                    );
            },
            success: function(response) {
                console.log(response);
                if(response.message == 'success') {
                    $(".product-qty").val(response.updatedQty);
                } else {
                    alertify.error(response.message);
                    $(".product-qty").val(response.updatedQty);
                }
            },
            error: function(xhr, status, error) {
                console.error("AJAX Error:", status, error);
                alert("An error occurred: " + error);
            },
            complete: function () {
                $('.blockUI').remove();
            }
        });
    }
</script>
@endpush