@php   
        $productName =$product->article;
        //$productName = !empty($product->articleInfo->product_name) ? $product->articleInfo->product_name : 'N/A';
        // if (empty($productName[ucwords(strtolower($product->color))])) {
        //     $productName = empty($productName[0]) ?  'N/A' : $productName[0];
        // } elseif (!empty($productName[ucwords(strtolower($product->color))])) {
        //     $productName = $productName[ucwords(strtolower($product->color))];
        // } else {
        //     $productName = 'N/A';
        // } 
        // if($productName == 'N/A'){
        //     $productName=$product->color ."-" .$product->size ."-" .$product->article;
        // }       
    
    $pn = $productName;
    $slug = $product->url;
    $purl = route('details-product', ['id' => $product->id]);
    $purl = str_replace('#', '__hash__', $purl);
    $images = [];
    $mainImage = '';  // str_replace(' ', '_', $product->color)   //->where('color_name', 'LIKE', '%' . $product->color. '%')->
    $imgCollections =App\ArticleImg::where('code', preg_replace('#[^\w()/.%\-&]#',"",$product->article))->where('color_name','LIKE', '%' . str_replace(' ', '_', $product->color). '%')->groupBy('imgname')->orderBy('sort_order')->get();
    if(empty($imgCollections)){
        $imgCollections =App\ArticleImg::where('code', preg_replace('#[^\w()/.%\-&]#',"",$product->article))->where('color_name',str_replace(' ', '_', $product->color))->groupBy('imgname')->orderBy('sort_order')->get();
    }
    
    foreach ($imgCollections as $imgCollection) {
        if (file_exists(public_path('/uploads/articles/photos/full/' . $imgCollection->imgname))) {
            if (empty($images[$imgCollection->color_name])) {
                $images[$imgCollection->color_name] = [];
            }
            $images[$imgCollection->color_name][] = asset('uploads/articles/photos/full/' . $imgCollection->imgname);
            if (empty($mainImage)) {
                $mainImage = asset('uploads/articles/photos/full/' . $imgCollection->imgname);
            }
        }
    }
        $mainImage = empty($mainImage) ? asset('placeholder.png') : $mainImage;
@endphp
    <div class="prel-gutter">
        <a target="_blank" href="{{  $purl }}">
            <div class="{{ !empty($mini) ? 'dynamic-img-container-mini' : 'dynamic-img-container' }}"
                style="height:290px;background-image: url('{{ $mainImage }}');background-repeat:no-repeat; background-size:contain; background-position:center center;"
                @if(!empty($mainImage))
                onmouseover="this.style.backgroundImage = 'url({{ $mainImage }})';"
                onmouseout="this.style.backgroundImage = 'url({{ $mainImage }})';"
                @endif
            >                    
            </div>           
            <div class="group-title-panel">                
                <div class="title-ellipsis"> {{ $product->article }} </div>             
            </div>
        </a>
    </div>