@extends('vendor.site-bases.website.layouts.master')

@section('title', $product->title)

@section('page_title', trans('title.products'))

@section('desc', strip_tags($product->description))

@section('img', asset($product->image))

@section('breadcrumbs')
    {!! Breadcrumbs::render('products_in', $product) !!}
@endsection

@section('meta')
    <meta property="product:availability" content="{{ $product->in_stock ? 'in stock' : 'out of stock' }}">
    <meta property="product:price:amount" content="{{ $product->onl_price ?: $product->discount_price ?: $product->item_price }}">
    <meta property="product:price:currency" content="GEL">
    <meta property="product:retailer_item_id" content="{{ $product->id }}">
@endsection

@section('content')
    @if ($banner)
        <div class="banners inner-banner full_width container">
            <div class="banner">
                <a href="{{ $banner->link }}">
                    <img src="{{ asset($banner->image) }}" alt="{{ $banner->title }}">
                </a>
            </div>
        </div>
    @endif
    <section class="product_page container">
        <div class="main_info">
            <div class="product_images">
                <div class="main_image">
                    <a href="{{ asset($product->image) }}" data-lightbox="image-1" data-title="{{ $product->title }}">
                        <div class="jqzoom">
                            <img src="{{ asset($product->image) }}" alt="fsafasfa" jqimg="{{ asset($product->image) }}">
                        </div>
                    </a>
                </div>
                <div class="product_images_slider">
                    <div class="swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <div class="image">
                                    <img src="{{ asset($product->thumb) }}"  data-image="{{ asset($product->image) }}" alt="{{ $product->title }}">
                                </div>
                            </div>
                            @foreach ($product->images as $image)
                                <div class="swiper-slide">
                                    <div class="image">
                                        <img src="{{ asset($image->thumb) }}"  data-image="{{ asset($image->image) }}" alt="{{ $product->title }}">
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
                @foreach ($product->images as $image)
                    <a href="{{ asset($image->image) }}" data-lightbox="image-1" data-title="{{ $product->title }}"></a>
                @endforeach
                <div class="id">
                    # {{ $product->fina_unique_code }}
                </div>
                <div class="promotions">
                    @if ($product->promo_image)
                        <div class="promo_image">
                            <img src="{{ asset($product->promo_image) }}" alt="{{ $product->title }}">
                        </div>
                    @endif
                    @foreach ($promos as $item)
                        <div class="promo_image">
                            <img src="{{ asset($item->image) }}" alt="{{ $item->title }}" title="{{ $item->title }}">
                        </div>
                    @endforeach
                </div>
                {{-- <div class="rank">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 14">
                        <path id="Path_4749" data-name="Path 4749" d="M3.667,2H14.333A.67.67,0,0,1,15,2.674V15.663a.338.338,0,0,1-.152.283.33.33,0,0,1-.317.025L9,13.475,3.469,15.97a.33.33,0,0,1-.317-.025A.338.338,0,0,1,3,15.663V2.674A.67.67,0,0,1,3.667,2Zm10,12.105V3.348H4.333V14.105L9,12ZM9,9.749,7.041,10.79l.374-2.2L5.83,7.023,8.021,6.7,9,4.7,9.98,6.7l2.19.322L10.585,8.585l.373,2.2Z" transform="translate(-3 -2)"/>
                    </svg>
                </div> --}}
            </div>
            <div class="product_info">
                <h1>
                    {{ $product->title }}
                    @if (auth()->check() && auth()->user()->is_admin)
                        <a href="{{ route('edit.product', $product->id) }}" target="_blank" title="რედაქტირება">
                            <img src="https://www.pdfzorro.com/Images/IconsFunktionen/pdf-edit.webp" style="height: 30px;margin-left:10px">
                        </a>
                    @endif
                </h1>
                <ul>
                    <li>
                        <span>@lang('site.category'):</span>
                        @foreach ($product->categories as $key => $category)
                            <a href="{{ $category->url }}">{{ $category->title }}</a>
                            @if ($key !== $product->categories->count() - 1)
                                <span>/</span>
                            @endif
                        @endforeach
                    </li>
                    @if ($product->brands->count() > 0)
                        <li>
                            <span>@lang('site.brands'):</span>
                            @foreach ($product->brands as $key => $brand)
                                <a href="{{ $brand->url }}">{{ $brand->title }}</a>
                                @if ($key !== $product->brands->count() - 1)
                                    <span>/</span>
                                @endif
                            @endforeach
                        </li>
                    @endif
                    @if ($product->detail->first()->warranty)
                        <li>
                            <span>@lang('site.warranty'):</span>
                            <span>{{ $product->detail->first()->warranty }}</span>
                        </li>
                    @endif
                </ul>
                <div class="quantity_size">
                    @if (!is_null($product->unique_code) || $product->children->count() != 0 || $product->sale_with_complect)
                        <div class="pr_quantity">
                            <span class="minus" data-count="{{ $product->size_count ?: 1 }}">
                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
                                    <path id="Path_4755" data-name="Path 4755" d="M10,18a8,8,0,1,1,8-8A8,8,0,0,1,10,18ZM6,9.2v1.6h8V9.2Z" transform="translate(-2 -2)"/>
                                </svg>
                            </span>
                            <input type="text" value="{{ $product->size_count ?: 1 }}" {{ $product->size_count ? 'readonly' : '' }} min="1" name="" id="quantity">
                            <span class="plus" data-count="{{ $product->size_count ?: 1 }}">
                                <svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 16 16">
                                    <path id="Path_4757" data-name="Path 4757" d="M10,18a8,8,0,1,1,8-8A8,8,0,0,1,10,18ZM9.2,9.2H6v1.6H9.2V14h1.6V10.8H14V9.2H10.8V6H9.2Z" transform="translate(-2 -2)"/>
                                </svg>
                            </span>
                        </div>
                    @endif
                    @if ($product->children->count() > 0)
                        <div class="error_sizes">
                            <div class="size-error"></div>
                            <div class="choose_size">
                                <select id="sizes">
                                    <option value="">@lang('site.choose_size')</option>
                                    @foreach ($product->children as $child)
                                        <option value="{{ $child->id }}">{{ $child->size }} {{ $child->unit->title }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    @endif
                </div>
                <div class="pr_desc">
                    <div class="small_desc">
                        <p>
                            {!! Str::limit(strip_tags($product->description), 150) !!}
                            @if (mb_strlen(strip_tags($product->description)) > 150)
                                <span class="more_desc">@lang('site.see_more')</span>
                            @endif
                        </p>
                    </div>
                    <div class="full_desc">
                        {!! $product->description !!}
                        <p>
                            <span class="less_desc">@lang('site.see_less')</span>
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="editional_info">
            @if (!is_null($product->unique_code) || $product->children->count() != 0 || $product->sale_with_complect)
                @if (!$product->only_with_order)
                    <div class="stocks">
                        @if ($product->in_stock)
                            <div class="instock">
                                <svg id="Group_6856" data-name="Group 6856" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
                                    <path id="Path_4746" data-name="Path 4746" d="M0,0H20V20H0Z" fill="none"/>
                                    <path id="Path_4747" data-name="Path 4747" d="M10,18a8,8,0,1,1,8-8A8,8,0,0,1,10,18Zm-.8-4.8,5.656-5.657L13.727,6.412,9.2,10.938,6.939,8.674,5.808,9.806Z" transform="translate(0 0)" fill="#00b407"/>
                                </svg>
                                @lang('site.instock')
                            </div>
                        @else
                            <div class="out_of_stock">
                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
                                    <g id="Group_7133" data-name="Group 7133" transform="translate(-1015 -459)">
                                    <path id="Path_4636" data-name="Path 4636" d="M0,0H20V20H0Z" transform="translate(1015 459)" fill="none"/>
                                    <circle id="Ellipse_81" data-name="Ellipse 81" cx="8" cy="8" r="8" transform="translate(1017 461)" fill="#e8000d"/>
                                    <path id="Path_4637" data-name="Path 4637" d="M9.636,8.747l3.111-3.111.889.889L10.525,9.636l3.111,3.111-.889.889L9.636,10.525,6.525,13.636l-.889-.889L8.747,9.636,5.636,6.525l.889-.889Z" transform="translate(1015.364 459.364)" fill="#fff"/>
                                    </g>
                                </svg>
                                @lang('site.outofstock')
                            </div>
                        @endif
                    </div>
                @endif
            @endif
            @if (!is_null($product->unique_code) || $product->children->count() != 0 || $product->sale_with_complect)
                @if ($product->in_stock)
                    <div class="pr_price">
                        @lang('site.product_price')
                        @if ($product->onl_price)
                            <span class="price">
                                {{ $product->onl_price }}<span class="lari">o</span>
                            </span>
                            <span class="old_price">
                                {{ $product->item_price }}<span class="lari">o</span>
                            </span>
                        @elseif ($product->discount_price)
                            <span class="old_price">
                                {{ $product->item_price }}<span class="lari">o</span>
                            </span>
                            <span class="price">
                                {{ $product->discount_price }}<span class="lari">o</span>
                            </span>
                        @else
                            <span class="price">
                                {{ $product->item_price }}<span class="lari">o</span>
                            </span>
                        @endif
                        @if ($product->mainUnit)
                            &nbsp;<span class="unit_title">/{{ $product->mainUnit->title }}</span>
                        @endif
                    </div>
                @endif
            @endif
            <div class="buy_pr">
                @if ($product->only_with_order)
                    <div class="instalment buy-order">
                        <a class="add_to_cart inst_btn" href="{{ url('/contact') }}" target="_blank">
                            @lang('site.buy_order')
                        </a>
                    </div>
                @elseif (is_null($product->unique_code) && $product->children->count() == 0 && $product->sale_with_complect)
                    <button class="add_to_cart add-to-cart inst_btn" data-id="{{ $product->id }}">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M11,2a5.548,5.548,0,0,1,5.4,5.684v.947H20v1.895H18.95l-.681,8.6a.92.92,0,0,1-.9.869H4.628a.92.92,0,0,1-.9-.869l-.682-8.6H2V8.632H5.6V7.684A5.548,5.548,0,0,1,11,2Zm6.143,8.526H4.856l.6,7.579H16.543ZM11.9,12.421v3.789H10.1V12.421Zm-3.6,0v3.789H6.5V12.421Zm7.2,0v3.789H13.7V12.421ZM11,3.895a3.687,3.687,0,0,0-3.6,3.6l0,.189v.947h7.2V7.684A3.71,3.71,0,0,0,11.18,3.9Z" transform="translate(-2 -2)"></path></svg>
                        @lang('site.add_to_cart')
                    </button>
                    <div class="instalment">
                        <button {{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} class="{{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} inst_btn">
                            @lang('site.buy_with_install')
                        </button>
                        <ul>
                            {{-- <li>
                                <button>
                                    <span>
                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 18">
                                            <g id="Group_7011" data-name="Group 7011" transform="translate(48 8766.439)">
                                            <path id="Path_4798" data-name="Path 4798" d="M50.987,14.935a1.925,1.925,0,0,1-.64,1.6,22.962,22.962,0,0,1-6.956,4.325,4.283,4.283,0,0,1-.723.19A.552.552,0,0,1,42,20.485a.791.791,0,0,1,.083-.326,70.128,70.128,0,0,1,3.979-7.725c1.224-2.122,4.479-7.236,4.952-7.807a.22.22,0,0,1,.223-.054c.083.054.139.109.056.381a23.866,23.866,0,0,0-.417,9.33c.056.245.083.462.111.653" transform="translate(-90 -8771)" fill="#00aeef"/>
                                            <path id="Path_4799" data-name="Path 4799" d="M52.795,49.764a1.939,1.939,0,0,1,1.688-.278A21.958,21.958,0,0,1,61.645,53.3a2.266,2.266,0,0,1,.517.529.54.54,0,0,1-.163.862,1.449,1.449,0,0,1-.327.111,69.689,69.689,0,0,1-8.632.5c-2.451.028-8.469-.167-9.2-.306a.155.155,0,0,1-.136-.167c0-.083,0-.167.3-.25A23.924,23.924,0,0,0,52.3,50.154a3.382,3.382,0,0,1,.49-.39" transform="translate(-91.227 -8803.743)" fill="#00aeef"/>
                                            <path id="Path_4800" data-name="Path 4800" d="M78.2,16.253a1.982,1.982,0,0,1-1.113-1.332,21.7,21.7,0,0,1-.362-8.045,4.668,4.668,0,0,1,.195-.707.567.567,0,0,1,.835-.3,1.29,1.29,0,0,1,.278.245,68.614,68.614,0,0,1,4.841,7.23c1.28,2.12,4.173,7.42,4.424,8.1a.208.208,0,0,1-.056.217c-.083.054-.139.082-.362-.136a24.615,24.615,0,0,0-8.069-5c-.223-.109-.445-.19-.612-.272" transform="translate(-115.309 -8771.883)" fill="#00aeef"/>
                                            </g>
                                        </svg>
                                    </span>
                                    თიბისი ბანკი
                                </button>
                            </li> --}}
                            <li>
                                <button {{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} class="{{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} add-to-cart" data-id="{{ $product->id }}" data-install="1">
                                    <span>
                                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 40 32">
                                            <defs>
                                            <clipPath id="clip-path">
                                                <rect width="183.152" height="32" fill="none"/>
                                            </clipPath>
                                            </defs>
                                            <g id="Component_48_4" data-name="Component 48 – 4" clip-path="url(#clip-path)">
                                            <path id="Path_575" data-name="Path 575" d="M37.3,6.3C37.033,5.881,33.06,0,26.172,0H11.444A8.637,8.637,0,0,0,2.808,8.636V24.795c0,.477-.742.212-.742.212A2.277,2.277,0,0,0,1.43,24.9,1.425,1.425,0,0,0,0,26.331c0,1.7,2.649,2.384,3.709,2.384a4.848,4.848,0,0,0,.9-.053A8.743,8.743,0,0,0,11.444,32H26.119a8.637,8.637,0,0,0,8.636-8.636V14.517s1.8-2.278,2.013-2.49h0s1.43-1.96,1.8-2.7.053-1.06-1.272-3.02" fill="#fff"/>
                                            <path id="Path_576" data-name="Path 576" d="M29.6,25.838a3.186,3.186,0,0,0,1.06.159c1.589,0,2.278-.636,2.278-1.377,0-.848-1.166-.848-1.272-1.642-.159-.954-.053-5.192,1.589-7.523l1.113.477a1.725,1.725,0,0,0,.689.159,1,1,0,0,0,.742-.371A21.431,21.431,0,0,0,38.662,11.8c.159-.265-2.172-3.179-3.444-4.185A5.3,5.3,0,0,0,31.987,6.5a5.114,5.114,0,0,0-4.874,3.444,24.75,24.75,0,0,1-7.311,3.5c-3.55.954-7.205.053-9.642.212a5.022,5.022,0,0,0-5.033,5.192c.053,2.755,1.96,5.245,1.96,7.841A2.836,2.836,0,0,1,4.278,29.6c-1.377,0-1.43-.53-1.854-.53A.339.339,0,0,0,2,29.387c0,.689,1.7,1.325,2.649,1.325a4.2,4.2,0,0,0,3.6-1.8,3.166,3.166,0,0,0,3.179,1.854c2.013,0,2.861-.954,2.861-1.748,0-.636-.371-.9-.689-1.325a1.918,1.918,0,0,1-.371-1.219,9.446,9.446,0,0,0,1.06.053c1.43,0,1.907-.583,1.907-1.166,0-.742-.848-.689-.848-1.907,0-.954.53-1.219.954-1.219.477,0,2.331.159,4.609.424.742.053,2.6.795,2.6,3.709v1.06c0,1.748.689,3.974,3.868,3.974,2.119,0,3.338-1.166,3.338-2.066,0-.583-.477-.795-.742-1.166a2.737,2.737,0,0,1-.371-2.331" transform="translate(-0.94 -3.056)" fill="#f26724"/>
                                            <path id="Path_577" data-name="Path 577" d="M63.471,19.1a.371.371,0,1,0,.371.371.362.362,0,0,0-.371-.371" transform="translate(-29.67 -8.981)" fill="#fff"/>
                                            <path id="Path_578" data-name="Path 578" d="M65.918,17a.318.318,0,1,0,.318.318A.305.305,0,0,0,65.918,17" transform="translate(-30.845 -7.993)" fill="#fff"/>
                                            <path id="Path_579" data-name="Path 579" d="M67.165,14.7a.265.265,0,1,0,.265.265.284.284,0,0,0-.265-.265" transform="translate(-31.456 -6.912)" fill="#fff"/>
                                            <path id="Path_580" data-name="Path 580" d="M47.024,17.248a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-21.911 -7.711)" fill="#fff"/>
                                            <path id="Path_581" data-name="Path 581" d="M49.971,36.2a.378.378,0,0,0-.371.424.409.409,0,0,0,.371.424.418.418,0,0,0,.424-.424c-.053-.212-.212-.424-.424-.424" transform="translate(-23.322 -17.021)" fill="#fff"/>
                                            <path id="Path_582" data-name="Path 582" d="M54.424,37a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-25.391 -17.397)" fill="#fff"/>
                                            <path id="Path_583" data-name="Path 583" d="M50.524,29.4a.424.424,0,1,0,0,.848.39.39,0,0,0,.424-.424.418.418,0,0,0-.424-.424" transform="translate(-23.557 -13.824)" fill="#fff"/>
                                            <path id="Path_584" data-name="Path 584" d="M53.164,23.548a.424.424,0,0,0,0-.848.428.428,0,0,0,0,.848" transform="translate(-24.819 -10.673)" fill="#fff"/>
                                            <path id="Path_585" data-name="Path 585" d="M41.324,20.448a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-19.231 -9.216)" fill="#fff"/>
                                            <path id="Path_586" data-name="Path 586" d="M45.624,34.7a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-21.253 -16.316)" fill="#fff"/>
                                            <path id="Path_587" data-name="Path 587" d="M43.524,24.148a.378.378,0,0,0,.371-.424.409.409,0,0,0-.371-.424.424.424,0,0,0,0,.848" transform="translate(-20.266 -10.956)" fill="#fff"/>
                                            <path id="Path_588" data-name="Path 588" d="M38.724,29.2a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-18.009 -13.73)" fill="#fff"/>
                                            <path id="Path_589" data-name="Path 589" d="M46.524,27.648a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-21.676 -12.601)" fill="#fff"/>
                                            <path id="Path_590" data-name="Path 590" d="M34.624,21.7a.424.424,0,1,0,.424.424.418.418,0,0,0-.424-.424" transform="translate(-16.081 -10.203)" fill="#fff"/>
                                            <path id="Path_591" data-name="Path 591" d="M36.324,25.6a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-16.88 -12.037)" fill="#fff"/>
                                            <path id="Path_592" data-name="Path 592" d="M41.824,32.1a.424.424,0,1,0,.424.424c-.053-.212-.212-.424-.424-.424" transform="translate(-19.466 -15.093)" fill="#fff"/>
                                            <path id="Path_593" data-name="Path 593" d="M49.524,20.748a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-23.087 -9.357)" fill="#fff"/>
                                            <path id="Path_594" data-name="Path 594" d="M55.024,30.8a.424.424,0,1,0,.424.424.418.418,0,0,0-.424-.424" transform="translate(-25.673 -14.482)" fill="#fff"/>
                                            <path id="Path_595" data-name="Path 595" d="M56.924,24.7a.424.424,0,0,0,0,.848.39.39,0,0,0,.424-.424.418.418,0,0,0-.424-.424" transform="translate(-26.566 -11.614)" fill="#fff"/>
                                            <path id="Path_596" data-name="Path 596" d="M56.424,18.5a.424.424,0,1,0,.424.424.39.39,0,0,0-.424-.424" transform="translate(-26.331 -8.699)" fill="#fff"/>
                                            <path id="Path_597" data-name="Path 597" d="M60.024,19.6a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-28.024 -9.216)" fill="#fff"/>
                                            <path id="Path_598" data-name="Path 598" d="M53.824,16.2a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-25.109 -7.617)" fill="#fff"/>
                                            <path id="Path_599" data-name="Path 599" d="M52.324,13.3a.424.424,0,1,0,.424.424c-.053-.212-.212-.424-.424-.424" transform="translate(-24.403 -6.254)" fill="#fff"/>
                                            <path id="Path_600" data-name="Path 600" d="M55.424,13.3a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-25.861 -6.254)" fill="#fff"/>
                                            <path id="Path_601" data-name="Path 601" d="M52.2,11.018a.342.342,0,0,1,.318-.318.305.305,0,0,1,.318.318.318.318,0,0,1-.636,0" transform="translate(-24.544 -5.031)" fill="#fff"/>
                                            <path id="Path_602" data-name="Path 602" d="M54.1,8.765a.265.265,0,1,1,.265.265.284.284,0,0,1-.265-.265" transform="translate(-25.438 -3.997)" fill="#fff"/>
                                            <path id="Path_603" data-name="Path 603" d="M56.5,7.712a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-26.566 -3.526)" fill="#fff"/>
                                            <path id="Path_604" data-name="Path 604" d="M66.9,12.912a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-31.456 -5.972)" fill="#fff"/>
                                            <path id="Path_605" data-name="Path 605" d="M66.3,20.412a.212.212,0,1,1,.212.212c-.053,0-.159-.106-.212-.212" transform="translate(-31.174 -9.498)" fill="#fff"/>
                                            <path id="Path_606" data-name="Path 606" d="M67.4,19.012a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-31.691 -8.84)" fill="#fff"/>
                                            <path id="Path_607" data-name="Path 607" d="M65.2,21.912a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-30.657 -10.203)" fill="#fff"/>
                                            <path id="Path_608" data-name="Path 608" d="M63.9,23.212a.212.212,0,1,1,.212.212c-.106,0-.159-.106-.212-.212" transform="translate(-30.046 -10.815)" fill="#fff"/>
                                            <path id="Path_609" data-name="Path 609" d="M68.4,17.512a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-32.162 -8.134)" fill="#fff"/>
                                            <path id="Path_610" data-name="Path 610" d="M69.1,16.212a.212.212,0,1,1,.212.212c-.106,0-.159-.053-.212-.212" transform="translate(-32.491 -7.523)" fill="#fff"/>
                                            <path id="Path_611" data-name="Path 611" d="M20.591,41.285a6.416,6.416,0,0,1-.477-5.086c1.113-2.861,4.344-2.49,4.344-2.49a3.722,3.722,0,0,0-1.7-.318A4.237,4.237,0,0,0,18.9,37.947a4.877,4.877,0,0,0,1.7,3.338" transform="translate(-8.883 -15.696)" fill="#fff"/>
                                            <path id="Path_612" data-name="Path 612" d="M11.107,27.869A3.4,3.4,0,0,1,10.1,25.432a3.506,3.506,0,0,1,3.444-3.444c1.96-.106,5.563.477,7.894.159.795,3.55,3.444,6.04,5.4,7.629-2.384-1.06-4.768-3.868-7.523-5.4-2.861-1.589-5.775-1.854-7.311-.424a3.958,3.958,0,0,0-.9,3.921" transform="translate(-4.749 -10.333)" fill="#fff"/>
                                            <path id="Path_613" data-name="Path 613" d="M25.9,39.9c.159,1.007-1.7,1.377-1.7,1.377,1.7.318,2.225-.583,2.225-.583a4.045,4.045,0,0,0-.53-.795" transform="translate(-11.379 -18.761)" fill="#fff"/>
                                            <path id="Path_614" data-name="Path 614" d="M50.678,40.9h0s-1.113,1.536-.318,4.4A5.721,5.721,0,0,1,48.4,46.3s2.543.318,3.338-1.007c-1.589-1.219-1.113-4.185-1.06-4.4" transform="translate(-22.758 -19.231)" fill="#fff"/>
                                            <path id="Path_615" data-name="Path 615" d="M60.346,10.273a1.687,1.687,0,0,0-2.066,1.166,1.646,1.646,0,0,0,1.536,1.8,1.687,1.687,0,0,0,2.066-1.166,1.646,1.646,0,0,0-1.536-1.8m1.272,1.748a1.23,1.23,0,0,1-1.483.848,1.166,1.166,0,0,1-1.06-1.272,1.23,1.23,0,0,1,1.483-.848,1.166,1.166,0,0,1,1.06,1.272" transform="translate(-27.392 -4.816)" fill="#fff"/>
                                            <path id="Path_616" data-name="Path 616" d="M62.094,12.67a.683.683,0,0,1,.795-.477.64.64,0,0,1,.583.689.683.683,0,0,1-.795.477.64.64,0,0,1-.583-.689" transform="translate(-29.193 -5.729)" fill="#fff"/>
                                            <path id="Path_617" data-name="Path 617" d="M57.024,38.3h0c.583,1.113-1.325,1.536-1.325,1.536,1.377.212,2.119-.583,2.119-.954a3.43,3.43,0,0,1-.795-.583" transform="translate(-26.19 -18.009)" fill="#fff"/>
                                            <path id="Path_618" data-name="Path 618" d="M35.43,31.306s.265.318.689.742a17,17,0,0,0,1.7,1.43,12.958,12.958,0,0,0,1.854,1.166,3.484,3.484,0,0,0,.636.318,2.227,2.227,0,0,1,.265.106,2.227,2.227,0,0,0-.265-.106,3.641,3.641,0,0,1-.689-.318,15.915,15.915,0,0,1-1.96-1.113,13.435,13.435,0,0,1-1.748-1.377,7.77,7.77,0,0,1-.742-.742.161.161,0,0,1,0-.212.4.4,0,0,1,.265.106h0" transform="translate(-16.516 -14.67)" fill="#fff"/>
                                            <path id="Path_619" data-name="Path 619" d="M60.909,10.305a2.862,2.862,0,0,0-4.821-.212A.451.451,0,1,1,55.4,9.51,3.241,3.241,0,0,1,57.89,8.4a3.2,3.2,0,0,1,3.02,1.907" transform="translate(-25.995 -3.947)" fill="#fff"/>
                                            <path id="Path_620" data-name="Path 620" d="M54.847,19.2a6.97,6.97,0,0,1-3.55-1.43,7.419,7.419,0,0,1-2.225-2.49c-.053-.159-.053-.371.106-.424a.286.286,0,0,1,.424.106,8.055,8.055,0,0,0,2.119,2.7A7.807,7.807,0,0,0,54.847,19.2" transform="translate(-23.059 -6.957)" fill="#fff"/>
                                            <path id="Path_621" data-name="Path 621" d="M50.862,23.267A8.6,8.6,0,0,1,45.3,20.512a11.633,11.633,0,0,1-1.748-2.437.309.309,0,0,1,.53-.318,10.442,10.442,0,0,0,2.066,3.073,8.006,8.006,0,0,0,4.715,2.437" transform="translate(-20.452 -8.274)" fill="#fff"/>
                                            <path id="Path_622" data-name="Path 622" d="M37.721,20.488a.3.3,0,0,1,.371.212,11.321,11.321,0,0,0,2.7,4.344,10.04,10.04,0,0,0,6.623,2.967,10.146,10.146,0,0,1-7.152-2.967,11.719,11.719,0,0,1-2.7-4.132.281.281,0,0,1,.159-.424" transform="translate(-17.642 -9.627)" fill="#fff"/>
                                            <path id="Path_623" data-name="Path 623" d="M57.859,14.919a3.11,3.11,0,0,0,1.748.53A2.151,2.151,0,0,0,61.886,13.7a2.5,2.5,0,0,1-2.49,2.225,3.692,3.692,0,0,1-1.854-.424.334.334,0,0,1-.159-.424c.159-.159.371-.265.477-.159" transform="translate(-26.972 -6.442)" fill="#fff"/>
                                            </g>
                                        </svg>
                                    </span>
                                    @lang('site.bog_install')
                                </button>
                            </li>
                        </ul>
                    </div>
                @else
                    <button {{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} class="{{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} add_to_cart add-to-cart inst_btn" data-id="{{ $product->id }}">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M11,2a5.548,5.548,0,0,1,5.4,5.684v.947H20v1.895H18.95l-.681,8.6a.92.92,0,0,1-.9.869H4.628a.92.92,0,0,1-.9-.869l-.682-8.6H2V8.632H5.6V7.684A5.548,5.548,0,0,1,11,2Zm6.143,8.526H4.856l.6,7.579H16.543ZM11.9,12.421v3.789H10.1V12.421Zm-3.6,0v3.789H6.5V12.421Zm7.2,0v3.789H13.7V12.421ZM11,3.895a3.687,3.687,0,0,0-3.6,3.6l0,.189v.947h7.2V7.684A3.71,3.71,0,0,0,11.18,3.9Z" transform="translate(-2 -2)"></path></svg>
                        @lang('site.add_to_cart')
                    </button>
                    <div class="instalment">
                        <button {{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} class="{{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} inst_btn">
                            @lang('site.buy_with_install')
                        </button>
                        <ul>
                            {{-- <li>
                                <button>
                                    <span>
                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 18">
                                            <g id="Group_7011" data-name="Group 7011" transform="translate(48 8766.439)">
                                            <path id="Path_4798" data-name="Path 4798" d="M50.987,14.935a1.925,1.925,0,0,1-.64,1.6,22.962,22.962,0,0,1-6.956,4.325,4.283,4.283,0,0,1-.723.19A.552.552,0,0,1,42,20.485a.791.791,0,0,1,.083-.326,70.128,70.128,0,0,1,3.979-7.725c1.224-2.122,4.479-7.236,4.952-7.807a.22.22,0,0,1,.223-.054c.083.054.139.109.056.381a23.866,23.866,0,0,0-.417,9.33c.056.245.083.462.111.653" transform="translate(-90 -8771)" fill="#00aeef"/>
                                            <path id="Path_4799" data-name="Path 4799" d="M52.795,49.764a1.939,1.939,0,0,1,1.688-.278A21.958,21.958,0,0,1,61.645,53.3a2.266,2.266,0,0,1,.517.529.54.54,0,0,1-.163.862,1.449,1.449,0,0,1-.327.111,69.689,69.689,0,0,1-8.632.5c-2.451.028-8.469-.167-9.2-.306a.155.155,0,0,1-.136-.167c0-.083,0-.167.3-.25A23.924,23.924,0,0,0,52.3,50.154a3.382,3.382,0,0,1,.49-.39" transform="translate(-91.227 -8803.743)" fill="#00aeef"/>
                                            <path id="Path_4800" data-name="Path 4800" d="M78.2,16.253a1.982,1.982,0,0,1-1.113-1.332,21.7,21.7,0,0,1-.362-8.045,4.668,4.668,0,0,1,.195-.707.567.567,0,0,1,.835-.3,1.29,1.29,0,0,1,.278.245,68.614,68.614,0,0,1,4.841,7.23c1.28,2.12,4.173,7.42,4.424,8.1a.208.208,0,0,1-.056.217c-.083.054-.139.082-.362-.136a24.615,24.615,0,0,0-8.069-5c-.223-.109-.445-.19-.612-.272" transform="translate(-115.309 -8771.883)" fill="#00aeef"/>
                                            </g>
                                        </svg>
                                    </span>
                                    თიბისი ბანკი
                                </button>
                            </li> --}}
                            <li>
                                <button {{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} class="{{ is_null($product->unique_code) && $product->children->count() == 0 ? 'disabled' : '' }} add-to-cart" data-id="{{ $product->id }}" data-install="1">
                                    <span>
                                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 40 32">
                                            <defs>
                                            <clipPath id="clip-path">
                                                <rect width="183.152" height="32" fill="none"/>
                                            </clipPath>
                                            </defs>
                                            <g id="Component_48_4" data-name="Component 48 – 4" clip-path="url(#clip-path)">
                                            <path id="Path_575" data-name="Path 575" d="M37.3,6.3C37.033,5.881,33.06,0,26.172,0H11.444A8.637,8.637,0,0,0,2.808,8.636V24.795c0,.477-.742.212-.742.212A2.277,2.277,0,0,0,1.43,24.9,1.425,1.425,0,0,0,0,26.331c0,1.7,2.649,2.384,3.709,2.384a4.848,4.848,0,0,0,.9-.053A8.743,8.743,0,0,0,11.444,32H26.119a8.637,8.637,0,0,0,8.636-8.636V14.517s1.8-2.278,2.013-2.49h0s1.43-1.96,1.8-2.7.053-1.06-1.272-3.02" fill="#fff"/>
                                            <path id="Path_576" data-name="Path 576" d="M29.6,25.838a3.186,3.186,0,0,0,1.06.159c1.589,0,2.278-.636,2.278-1.377,0-.848-1.166-.848-1.272-1.642-.159-.954-.053-5.192,1.589-7.523l1.113.477a1.725,1.725,0,0,0,.689.159,1,1,0,0,0,.742-.371A21.431,21.431,0,0,0,38.662,11.8c.159-.265-2.172-3.179-3.444-4.185A5.3,5.3,0,0,0,31.987,6.5a5.114,5.114,0,0,0-4.874,3.444,24.75,24.75,0,0,1-7.311,3.5c-3.55.954-7.205.053-9.642.212a5.022,5.022,0,0,0-5.033,5.192c.053,2.755,1.96,5.245,1.96,7.841A2.836,2.836,0,0,1,4.278,29.6c-1.377,0-1.43-.53-1.854-.53A.339.339,0,0,0,2,29.387c0,.689,1.7,1.325,2.649,1.325a4.2,4.2,0,0,0,3.6-1.8,3.166,3.166,0,0,0,3.179,1.854c2.013,0,2.861-.954,2.861-1.748,0-.636-.371-.9-.689-1.325a1.918,1.918,0,0,1-.371-1.219,9.446,9.446,0,0,0,1.06.053c1.43,0,1.907-.583,1.907-1.166,0-.742-.848-.689-.848-1.907,0-.954.53-1.219.954-1.219.477,0,2.331.159,4.609.424.742.053,2.6.795,2.6,3.709v1.06c0,1.748.689,3.974,3.868,3.974,2.119,0,3.338-1.166,3.338-2.066,0-.583-.477-.795-.742-1.166a2.737,2.737,0,0,1-.371-2.331" transform="translate(-0.94 -3.056)" fill="#f26724"/>
                                            <path id="Path_577" data-name="Path 577" d="M63.471,19.1a.371.371,0,1,0,.371.371.362.362,0,0,0-.371-.371" transform="translate(-29.67 -8.981)" fill="#fff"/>
                                            <path id="Path_578" data-name="Path 578" d="M65.918,17a.318.318,0,1,0,.318.318A.305.305,0,0,0,65.918,17" transform="translate(-30.845 -7.993)" fill="#fff"/>
                                            <path id="Path_579" data-name="Path 579" d="M67.165,14.7a.265.265,0,1,0,.265.265.284.284,0,0,0-.265-.265" transform="translate(-31.456 -6.912)" fill="#fff"/>
                                            <path id="Path_580" data-name="Path 580" d="M47.024,17.248a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-21.911 -7.711)" fill="#fff"/>
                                            <path id="Path_581" data-name="Path 581" d="M49.971,36.2a.378.378,0,0,0-.371.424.409.409,0,0,0,.371.424.418.418,0,0,0,.424-.424c-.053-.212-.212-.424-.424-.424" transform="translate(-23.322 -17.021)" fill="#fff"/>
                                            <path id="Path_582" data-name="Path 582" d="M54.424,37a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-25.391 -17.397)" fill="#fff"/>
                                            <path id="Path_583" data-name="Path 583" d="M50.524,29.4a.424.424,0,1,0,0,.848.39.39,0,0,0,.424-.424.418.418,0,0,0-.424-.424" transform="translate(-23.557 -13.824)" fill="#fff"/>
                                            <path id="Path_584" data-name="Path 584" d="M53.164,23.548a.424.424,0,0,0,0-.848.428.428,0,0,0,0,.848" transform="translate(-24.819 -10.673)" fill="#fff"/>
                                            <path id="Path_585" data-name="Path 585" d="M41.324,20.448a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-19.231 -9.216)" fill="#fff"/>
                                            <path id="Path_586" data-name="Path 586" d="M45.624,34.7a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-21.253 -16.316)" fill="#fff"/>
                                            <path id="Path_587" data-name="Path 587" d="M43.524,24.148a.378.378,0,0,0,.371-.424.409.409,0,0,0-.371-.424.424.424,0,0,0,0,.848" transform="translate(-20.266 -10.956)" fill="#fff"/>
                                            <path id="Path_588" data-name="Path 588" d="M38.724,29.2a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-18.009 -13.73)" fill="#fff"/>
                                            <path id="Path_589" data-name="Path 589" d="M46.524,27.648a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-21.676 -12.601)" fill="#fff"/>
                                            <path id="Path_590" data-name="Path 590" d="M34.624,21.7a.424.424,0,1,0,.424.424.418.418,0,0,0-.424-.424" transform="translate(-16.081 -10.203)" fill="#fff"/>
                                            <path id="Path_591" data-name="Path 591" d="M36.324,25.6a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-16.88 -12.037)" fill="#fff"/>
                                            <path id="Path_592" data-name="Path 592" d="M41.824,32.1a.424.424,0,1,0,.424.424c-.053-.212-.212-.424-.424-.424" transform="translate(-19.466 -15.093)" fill="#fff"/>
                                            <path id="Path_593" data-name="Path 593" d="M49.524,20.748a.424.424,0,1,0-.424-.424c.053.265.212.424.424.424" transform="translate(-23.087 -9.357)" fill="#fff"/>
                                            <path id="Path_594" data-name="Path 594" d="M55.024,30.8a.424.424,0,1,0,.424.424.418.418,0,0,0-.424-.424" transform="translate(-25.673 -14.482)" fill="#fff"/>
                                            <path id="Path_595" data-name="Path 595" d="M56.924,24.7a.424.424,0,0,0,0,.848.39.39,0,0,0,.424-.424.418.418,0,0,0-.424-.424" transform="translate(-26.566 -11.614)" fill="#fff"/>
                                            <path id="Path_596" data-name="Path 596" d="M56.424,18.5a.424.424,0,1,0,.424.424.39.39,0,0,0-.424-.424" transform="translate(-26.331 -8.699)" fill="#fff"/>
                                            <path id="Path_597" data-name="Path 597" d="M60.024,19.6a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-28.024 -9.216)" fill="#fff"/>
                                            <path id="Path_598" data-name="Path 598" d="M53.824,16.2a.424.424,0,1,0,.424.424c-.053-.265-.212-.424-.424-.424" transform="translate(-25.109 -7.617)" fill="#fff"/>
                                            <path id="Path_599" data-name="Path 599" d="M52.324,13.3a.424.424,0,1,0,.424.424c-.053-.212-.212-.424-.424-.424" transform="translate(-24.403 -6.254)" fill="#fff"/>
                                            <path id="Path_600" data-name="Path 600" d="M55.424,13.3a.424.424,0,1,0,.424.424.456.456,0,0,0-.424-.424" transform="translate(-25.861 -6.254)" fill="#fff"/>
                                            <path id="Path_601" data-name="Path 601" d="M52.2,11.018a.342.342,0,0,1,.318-.318.305.305,0,0,1,.318.318.318.318,0,0,1-.636,0" transform="translate(-24.544 -5.031)" fill="#fff"/>
                                            <path id="Path_602" data-name="Path 602" d="M54.1,8.765a.265.265,0,1,1,.265.265.284.284,0,0,1-.265-.265" transform="translate(-25.438 -3.997)" fill="#fff"/>
                                            <path id="Path_603" data-name="Path 603" d="M56.5,7.712a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-26.566 -3.526)" fill="#fff"/>
                                            <path id="Path_604" data-name="Path 604" d="M66.9,12.912a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-31.456 -5.972)" fill="#fff"/>
                                            <path id="Path_605" data-name="Path 605" d="M66.3,20.412a.212.212,0,1,1,.212.212c-.053,0-.159-.106-.212-.212" transform="translate(-31.174 -9.498)" fill="#fff"/>
                                            <path id="Path_606" data-name="Path 606" d="M67.4,19.012a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-31.691 -8.84)" fill="#fff"/>
                                            <path id="Path_607" data-name="Path 607" d="M65.2,21.912a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-30.657 -10.203)" fill="#fff"/>
                                            <path id="Path_608" data-name="Path 608" d="M63.9,23.212a.212.212,0,1,1,.212.212c-.106,0-.159-.106-.212-.212" transform="translate(-30.046 -10.815)" fill="#fff"/>
                                            <path id="Path_609" data-name="Path 609" d="M68.4,17.512a.212.212,0,1,1,.212.212.228.228,0,0,1-.212-.212" transform="translate(-32.162 -8.134)" fill="#fff"/>
                                            <path id="Path_610" data-name="Path 610" d="M69.1,16.212a.212.212,0,1,1,.212.212c-.106,0-.159-.053-.212-.212" transform="translate(-32.491 -7.523)" fill="#fff"/>
                                            <path id="Path_611" data-name="Path 611" d="M20.591,41.285a6.416,6.416,0,0,1-.477-5.086c1.113-2.861,4.344-2.49,4.344-2.49a3.722,3.722,0,0,0-1.7-.318A4.237,4.237,0,0,0,18.9,37.947a4.877,4.877,0,0,0,1.7,3.338" transform="translate(-8.883 -15.696)" fill="#fff"/>
                                            <path id="Path_612" data-name="Path 612" d="M11.107,27.869A3.4,3.4,0,0,1,10.1,25.432a3.506,3.506,0,0,1,3.444-3.444c1.96-.106,5.563.477,7.894.159.795,3.55,3.444,6.04,5.4,7.629-2.384-1.06-4.768-3.868-7.523-5.4-2.861-1.589-5.775-1.854-7.311-.424a3.958,3.958,0,0,0-.9,3.921" transform="translate(-4.749 -10.333)" fill="#fff"/>
                                            <path id="Path_613" data-name="Path 613" d="M25.9,39.9c.159,1.007-1.7,1.377-1.7,1.377,1.7.318,2.225-.583,2.225-.583a4.045,4.045,0,0,0-.53-.795" transform="translate(-11.379 -18.761)" fill="#fff"/>
                                            <path id="Path_614" data-name="Path 614" d="M50.678,40.9h0s-1.113,1.536-.318,4.4A5.721,5.721,0,0,1,48.4,46.3s2.543.318,3.338-1.007c-1.589-1.219-1.113-4.185-1.06-4.4" transform="translate(-22.758 -19.231)" fill="#fff"/>
                                            <path id="Path_615" data-name="Path 615" d="M60.346,10.273a1.687,1.687,0,0,0-2.066,1.166,1.646,1.646,0,0,0,1.536,1.8,1.687,1.687,0,0,0,2.066-1.166,1.646,1.646,0,0,0-1.536-1.8m1.272,1.748a1.23,1.23,0,0,1-1.483.848,1.166,1.166,0,0,1-1.06-1.272,1.23,1.23,0,0,1,1.483-.848,1.166,1.166,0,0,1,1.06,1.272" transform="translate(-27.392 -4.816)" fill="#fff"/>
                                            <path id="Path_616" data-name="Path 616" d="M62.094,12.67a.683.683,0,0,1,.795-.477.64.64,0,0,1,.583.689.683.683,0,0,1-.795.477.64.64,0,0,1-.583-.689" transform="translate(-29.193 -5.729)" fill="#fff"/>
                                            <path id="Path_617" data-name="Path 617" d="M57.024,38.3h0c.583,1.113-1.325,1.536-1.325,1.536,1.377.212,2.119-.583,2.119-.954a3.43,3.43,0,0,1-.795-.583" transform="translate(-26.19 -18.009)" fill="#fff"/>
                                            <path id="Path_618" data-name="Path 618" d="M35.43,31.306s.265.318.689.742a17,17,0,0,0,1.7,1.43,12.958,12.958,0,0,0,1.854,1.166,3.484,3.484,0,0,0,.636.318,2.227,2.227,0,0,1,.265.106,2.227,2.227,0,0,0-.265-.106,3.641,3.641,0,0,1-.689-.318,15.915,15.915,0,0,1-1.96-1.113,13.435,13.435,0,0,1-1.748-1.377,7.77,7.77,0,0,1-.742-.742.161.161,0,0,1,0-.212.4.4,0,0,1,.265.106h0" transform="translate(-16.516 -14.67)" fill="#fff"/>
                                            <path id="Path_619" data-name="Path 619" d="M60.909,10.305a2.862,2.862,0,0,0-4.821-.212A.451.451,0,1,1,55.4,9.51,3.241,3.241,0,0,1,57.89,8.4a3.2,3.2,0,0,1,3.02,1.907" transform="translate(-25.995 -3.947)" fill="#fff"/>
                                            <path id="Path_620" data-name="Path 620" d="M54.847,19.2a6.97,6.97,0,0,1-3.55-1.43,7.419,7.419,0,0,1-2.225-2.49c-.053-.159-.053-.371.106-.424a.286.286,0,0,1,.424.106,8.055,8.055,0,0,0,2.119,2.7A7.807,7.807,0,0,0,54.847,19.2" transform="translate(-23.059 -6.957)" fill="#fff"/>
                                            <path id="Path_621" data-name="Path 621" d="M50.862,23.267A8.6,8.6,0,0,1,45.3,20.512a11.633,11.633,0,0,1-1.748-2.437.309.309,0,0,1,.53-.318,10.442,10.442,0,0,0,2.066,3.073,8.006,8.006,0,0,0,4.715,2.437" transform="translate(-20.452 -8.274)" fill="#fff"/>
                                            <path id="Path_622" data-name="Path 622" d="M37.721,20.488a.3.3,0,0,1,.371.212,11.321,11.321,0,0,0,2.7,4.344,10.04,10.04,0,0,0,6.623,2.967,10.146,10.146,0,0,1-7.152-2.967,11.719,11.719,0,0,1-2.7-4.132.281.281,0,0,1,.159-.424" transform="translate(-17.642 -9.627)" fill="#fff"/>
                                            <path id="Path_623" data-name="Path 623" d="M57.859,14.919a3.11,3.11,0,0,0,1.748.53A2.151,2.151,0,0,0,61.886,13.7a2.5,2.5,0,0,1-2.49,2.225,3.692,3.692,0,0,1-1.854-.424.334.334,0,0,1-.159-.424c.159-.159.371-.265.477-.159" transform="translate(-26.972 -6.442)" fill="#fff"/>
                                            </g>
                                        </svg>
                                    </span>
                                    @lang('site.bog_install')
                                </button>
                            </li>
                        </ul>
                    </div>
                @endif
                @if ($deliver)
                    <div class="info delivery">
                        <button class="delivery_btn modal_btn" data-target="#delivery_modal">
                            <svg id="Group_6991" data-name="Group 6991" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
                                <path id="Path_4796" data-name="Path 4796" d="M20,0H0V20H20Z" fill="none"/>
                                <path id="Path_4797" data-name="Path 4797" d="M12.483,16.371A2.933,2.933,0,0,0,15.318,19a2.933,2.933,0,0,0,2.835-2.629H19V5.875A.848.848,0,0,0,18.182,5H6.727a.848.848,0,0,0-.818.875V7.624H3.455L1,11.172v5.2H2.665A2.933,2.933,0,0,0,5.5,19a2.933,2.933,0,0,0,2.835-2.629ZM7.545,6.749h9.818V13.79a2.751,2.751,0,0,0-2.519-.877,2.9,2.9,0,0,0-2.114,1.708H8.088a3.1,3.1,0,0,0-.542-.831ZM5.909,12H2.636v-.249L4.279,9.373h1.63ZM5.5,17.245a1.315,1.315,0,0,1,0-2.625,1.315,1.315,0,0,1,0,2.625Zm8.591-1.312a1.23,1.23,0,1,1,1.227,1.312A1.272,1.272,0,0,1,14.091,15.933Z" transform="translate(0 -2)" />
                            </svg>
                            @lang('site.deliveries')
                        </button>
                        <div class="more_delivery_info">
                            @lang('site.delivery_info')
                        </div>
                    </div>
                @endif
                <div class="info">
                    <a href="{{ route('colors', $product->id) }}" class="colors_btn">
                        <svg id="Group_7137" data-name="Group 7137" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
                            <path id="Path_4833" data-name="Path 4833" d="M0,0H20V20H0Z" fill="none"/>
                            <path id="Path_4834" data-name="Path 4834" d="M16.471,3a.785.785,0,0,1,.792.778V5.144L15.678,6.7V4.556H4.585v6.3l3.17-3.111,3.429,3.367-1.052,1.032,0,3.3,3.365,0,1.054-1.034L15.6,15.444h.08V13.3l1.585-1.556v4.478a.785.785,0,0,1-.792.778H3.792A.785.785,0,0,1,3,16.222V3.778A.785.785,0,0,1,3.792,3ZM17.88,6.74,19,7.839l-6.163,6.05-1.122,0,0-1.1L17.88,6.74ZM12.9,6.111a1.167,1.167,0,1,1-1.189,1.167A1.178,1.178,0,0,1,12.9,6.111Z" transform="translate(-1)"/>
                        </svg>
                        @lang('site.colors')
                    </a>
                </div>
                @if ($hasSimilar)
                    <div class="info transparent">
                        <button class="compare_button modal_btn" data-target="#compare_modal">
                            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16">
                                <path id="Path_4743" data-name="Path 4743" d="M13.15,10.09,17,14.07l-3.85,3.98-1.1-1.137,1.972-2.04H3.778V13.266H14.023L12.05,11.227l1.1-1.137ZM6.85,2.05l1.1,1.137L5.977,5.226H16.222V6.834H5.977L7.95,8.873,6.85,10.01,3,6.03,6.85,2.05Z" transform="translate(-3 -2.05)"/>
                            </svg>
                            @lang('site.compare')
                        </button>
                    </div>
                @endif
            </div>
        </div>
        @if ($product->detail->first()->technical || $product->detail->first()->advantages || $product->detail->first()->uses)
            <div class="tabs">
                <ul class="nav-tabs">
                    @if ($product->detail->first()->technical)
                        <li class="active" data-target="#tab1">@lang('site.technical')</li>
                    @endif
                    @if ($product->detail->first()->advantages)
                        <li class="{{ !$product->detail->first()->technical ? 'active' : '' }}" data-target="#tab2">@lang('site.advantages')</li>
                    @endif
                    @if ($product->detail->first()->uses)
                        <li class="{{ !$product->detail->first()->technical && !$product->detail->first()->advantages ? 'active' : '' }}" data-target="#tab3">@lang('site.uses')</li>
                    @endif
                </ul>

                <div class="tab-content">
                    <div id="tab1" class="tab-panel active">
                        {!! $product->detail->first()->technical !!}
                    </div>
                    <div id="tab2" class="tab-panel {{ !$product->detail->first()->technical ? 'active' : '' }}">
                        {!! $product->detail->first()->advantages !!}
                    </div>
                    <div id="tab3" class="tab-panel {{ !$product->detail->first()->technical && !$product->detail->first()->advantages ? 'active' : '' }}">
                        {!! $product->detail->first()->uses !!}
                    </div>
                </div>
            </div>
        @endif
        @if ($product->video)
            <div class="video middle" data-url="{{ $product->video }}">
                <img src="{{ asset($product->video_image) }}" alt="{{ $product->title }}">
                <div class="overlay">
                    <div class="play_button">
                        <img src="{{ asset('assets/client/images/play.svg') }}" alt="">
                    </div>
                </div>
            </div>
            <div class="video_modal">
                <div class="bg"></div>
                <div class="video_in">
                    <iframe width="100%" height="100%" frameborder="0" allow="accelerometer; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                </div>
            </div>
        @endif
    </section>
    @if ($hasSimilar)
        <div class="section_title inner container">
            <h3>@lang('site.related')</h3>
        </div>
        <div class="half_slider featured_products inner">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    @foreach ($product->categories as $category)
                        @foreach ($category->products as $item)
                            <div class="swiper-slide">
                                @include('partials.product-item', $item)
                            </div>
                        @endforeach
                    @endforeach
                </div>
            </div>
            <div class="swiper-button-next">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4.684 7.026">
                    <path id="Path_1704" data-name="Path 1704" d="M11.342,11.27l2.342,2.342-1.171,1.172L9,11.27l3.513-3.513,1.171,1.172Z" transform="translate(-9 -7.757)" fill="#fff"/>
                </svg>
            </div>
            <div class="swiper-button-prev">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4.684 7.026">
                    <path id="Path_1704" data-name="Path 1704" d="M11.342,11.27l2.342,2.342-1.171,1.172L9,11.27l3.513-3.513,1.171,1.172Z" transform="translate(-9 -7.757)" fill="#fff"/>
                </svg>
            </div>
        </div>
    @endif
    <div class="copy_link">
        <svg id="Group_7170" data-name="Group 7170" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path id="Path_4835" data-name="Path 4835" d="M0,0H20V20H0Z" fill="none"/>
            <path id="Path_4836" data-name="Path 4836" d="M6.111,5.2V2.8A.789.789,0,0,1,6.889,2h9.333A.789.789,0,0,1,17,2.8V14a.789.789,0,0,1-.778.8H13.889v2.4a.791.791,0,0,1-.783.8H3.783a.768.768,0,0,1-.553-.233A.812.812,0,0,1,3,17.2L3,6a.791.791,0,0,1,.782-.8ZM4.557,6.8l0,9.6h7.778V6.8Zm3.11-1.6h6.222v8h1.556V3.6H7.667Zm-1.556,4h4.667v1.6H6.111Zm0,3.2h4.667V14H6.111Z" transform="translate(0 0)"/>
        </svg>
    </div>
    <div class="share">
        <button>
            <svg id="Group_6846" data-name="Group 6846" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
                <path id="Path_4740" data-name="Path 4740" d="M0,0H20V20H0Z" fill="none"/>
                <path id="Path_4741" data-name="Path 4741" d="M10.8,11.971H9.244a6.985,6.985,0,0,0-6.219,3.961Q3,15.6,3,15.265a8.029,8.029,0,0,1,7.8-8.235V2.5l8.2,7-8.2,7ZM9.244,10.324h3.122v2.724L16.519,9.5,12.366,5.952V8.676H10.8A6.1,6.1,0,0,0,6.077,10.96a8.184,8.184,0,0,1,3.166-.637Z" transform="translate(-1 0.5)" />
            </svg>
        </button>
        <ul>
            <li>
                <a href="#!" class="facebook-share" data-url="{{ URL::current() }}">
                    <svg id="Group_7083" data-name="Group 7083" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                        <path id="Path_4807" data-name="Path 4807" d="M0,0H24V24H0Z" fill="none"/>
                        <path id="Path_4808" data-name="Path 4808" d="M15.4,21V14.034h2.333l.349-2.708H15.4V9.6c0-.784.218-1.319,1.342-1.319h1.434V5.857a19.191,19.191,0,0,0-2.09-.107,3.263,3.263,0,0,0-3.482,3.58v2H10.268v2.708h2.338V21H4a1,1,0,0,1-1-1V4A1,1,0,0,1,4,3H20a1,1,0,0,1,1,1V20a1,1,0,0,1-1,1Z"/>
                    </svg>
                    Facebook
                </a>
            </li>
            <li>
                <a href="#!" class="twitter-share" data-url="{{ URL::current() }}">
                    <svg id="Group_7085" data-name="Group 7085" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                        <path id="Path_4809" data-name="Path 4809" d="M0,0H24V24H0Z" fill="none"/>
                        <path id="Path_4810" data-name="Path 4810" d="M21.778,5.588a8.331,8.331,0,0,1-2.357.635,4.063,4.063,0,0,0,1.805-2.234,8.282,8.282,0,0,1-2.606.98,4.152,4.152,0,0,0-4.934-.8,4.015,4.015,0,0,0-2.058,4.485A11.715,11.715,0,0,1,3.171,4.432a3.974,3.974,0,0,0-.555,2.03A4.02,4.02,0,0,0,4.441,9.823a4.141,4.141,0,0,1-1.858-.5v.05a4.057,4.057,0,0,0,3.291,3.959,4.2,4.2,0,0,1-1.854.07,4.1,4.1,0,0,0,3.833,2.8,8.333,8.333,0,0,1-6.074,1.672,11.746,11.746,0,0,0,6.289,1.815A11.5,11.5,0,0,0,19.744,8.2c0-.174,0-.349-.013-.521a8.263,8.263,0,0,0,2.048-2.09Z" transform="translate(0.221 0.312)"/>
                    </svg>
                    Twitter
                </a>
            </li>
            <li>
                <a href="#!" class="linkedin-share" data-url="{{ URL::current() }}">
                    <svg id="Group_7086" data-name="Group 7086" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                        <path id="Path_4811" data-name="Path 4811" d="M0,0H24V24H0Z" fill="none"/>
                        <path id="Path_4812" data-name="Path 4812" d="M18.335,18.339H15.67V14.162c0-1-.02-2.278-1.39-2.278-1.389,0-1.6,1.084-1.6,2.2v4.25H10.013V9.75h2.56v1.17h.035a2.812,2.812,0,0,1,2.528-1.387c2.7,0,3.2,1.778,3.2,4.091v4.715ZM7,8.575A1.548,1.548,0,1,1,8.551,7.028,1.546,1.546,0,0,1,7,8.575Zm1.336,9.764H5.666V9.75H8.34v8.589ZM19.67,3H4.329A1.312,1.312,0,0,0,3,4.3V19.7A1.312,1.312,0,0,0,4.328,21H19.666A1.317,1.317,0,0,0,21,19.7V4.3A1.317,1.317,0,0,0,19.666,3h0Z"/>
                    </svg>
                    Linkedin
                </a>
            </li>
            {{-- <li>
                <a href="#!" class="pinterest-share" data-url="{{ URL::current() }}">
                    <svg id="Group_7087" data-name="Group 7087" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                        <path id="Path_4813" data-name="Path 4813" d="M0,0H24V24H0Z" fill="none"/>
                        <path id="Path_4814" data-name="Path 4814" d="M13.37,2.094A10,10,0,0,0,8,21.17a7.757,7.757,0,0,1,.163-2.293c.185-.839,1.3-5.463,1.3-5.463a3.739,3.739,0,0,1-.324-1.577c0-1.485.857-2.593,1.923-2.593A1.334,1.334,0,0,1,12.4,10.752a21.828,21.828,0,0,1-.88,3.54A1.544,1.544,0,0,0,13.1,16.215c1.9,0,3.17-2.431,3.17-5.3,0-2.2-1.457-3.848-4.143-3.848a4.746,4.746,0,0,0-4.93,4.794,2.96,2.96,0,0,0,.648,1.97A.48.48,0,0,1,8,14.384c-.046.184-.162.623-.208.784a.354.354,0,0,1-.51.254C5.9,14.868,5.25,13.345,5.25,11.606c0-2.847,2.384-6.255,7.154-6.255a5.992,5.992,0,0,1,6.32,5.747c0,3.909-2.177,6.848-5.394,6.848A2.861,2.861,0,0,1,10.876,16.7s-.578,2.316-.692,2.754a8.026,8.026,0,0,1-1.019,2.131A9.664,9.664,0,0,0,12.011,22,10,10,0,0,0,13.372,2.1Z"/>
                    </svg>
                    Pinterest
                </a>
            </li> --}}
        </ul>
    </div>

    @if ($deliver)
        <div class="modal" id="delivery_modal">
            <div class="modal_bg"></div>
            <div class="modal_container">
                <div class="modal_header">
                    <h3>
                        {{ $deliver->title }}
                    </h3>
                    <span class="close">
                        <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
                            <path id="Path_4637" data-name="Path 4637" d="M11.636,10.3,16.3,5.636l1.333,1.333-4.667,4.667L17.636,16.3,16.3,17.636l-4.667-4.667L6.969,17.636,5.636,16.3,10.3,11.636,5.636,6.969,6.969,5.636Z" transform="translate(-5.636 -5.636)"/>
                        </svg>
                    </span>
                </div>
                <div class="modal_body">
                    {!! $deliver->description !!}
                </div>
            </div>
        </div>
    @endif

    <div class="modal compare_mode" id="compare_modal">
        <div class="modal_container first">
            <div class="modal_header">
                <h3>
                    @lang('site.products_compare')
                </h3>
                <span class="close">
                    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
                        <path id="Path_4637" data-name="Path 4637" d="M11.636,10.3,16.3,5.636l1.333,1.333-4.667,4.667L17.636,16.3,16.3,17.636l-4.667-4.667L6.969,17.636,5.636,16.3,10.3,11.636,5.636,6.969,6.969,5.636Z" transform="translate(-5.636 -5.636)"/>
                    </svg>
                </span>
            </div>
            <div class="modal_body">
               <div class="compare_products">
                    <div class="compare_product">
                        <div class="image">
                            <img src="{{ asset($product->image) }}" alt="{{ $product->title }}">
                        </div>
                        <h2>
                            {{ $product->title }}
                        </h2>
                    </div>
                    <div class="choose_compare_product">
                        <div class="choose_compare_product_in">
                           <span>
                                @lang('site.choose_product')
                           </span>
                           <span>
                                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
                                    <path id="Path_4832" data-name="Path 4832" d="M15.286,15.286V5h3.429V15.286H29v3.429H18.714V29H15.286V18.714H5V15.286Z" transform="translate(-5 -5)"/>
                                </svg>
                           </span>
                       </div>
                       <div class="compare_bg"></div>
                       <div class="compare_pr_search">
                           <h5>@lang('site.choose_product')</h5>
                           {{-- <form action="" method="GET">
                               <button>
                                   <svg xmlns="http://www.w3.org/2000/svg" id="prefix__Component_1_1" data-name="Component 1 – 1" viewBox="0 0 24 24">
                                       <path id="prefix__Path_40" d="M0 0h24v24H0z" data-name="Path 40" style="fill:none"></path>
                                       <path id="prefix__Path_41" d="M10.9 2A8.9 8.9 0 1 1 2 10.9 8.908 8.908 0 0 1 10.9 2zm0 15.831A6.926 6.926 0 1 0 3.979 10.9a6.925 6.925 0 0 0 6.921 6.931zm8.4.07l2.8 2.8-1.4 1.4-2.8-2.8z" data-name="Path 41" transform="translate(.116 .116)"></path>
                                   </svg>
                               </button>
                                <input type="search" id="search-similar" placeholder="@lang('site.search_similar')">
                            </form> --}}
                            <ul>
                                @foreach ($product->categories as $category)
                                    @foreach ($category->products as $item)
                                        <li class="choose-product" data-image="{{ asset($item->image) }}" data-technical="{{ $item->detail->first()->technical }}">{{ $item->title }}</li>
                                    @endforeach
                                @endforeach
                            </ul>
                       </div>
                   </div>
               </div>
            </div>
        </div>
        <div class="modal_bg"></div>
        <div class="modal_container">
            <div class="comp_products">
                <div class="pr">{!! $product->detail->first()->technical !!}</div>
                <div class="pr pr-second"></div>
            </div>
        </div>
    </div>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('assets/client/css/jqzoom.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/client/css/lightbox.min.css') }}">
@endsection


@section('scripts')
    <script src="{{ asset('assets/client/js/jquery.jqzoom.min.js') }}"></script>
    <script src="{{ asset('assets/client/js/lightbox.min.js') }}"></script>
    <script>
        $(function(){
            $(".jqzoom").jqueryzoom();
            if ($('#sizes').length > 0) {
                $('#sizes').change(function () {
                    if (this.value) {
                        $.ajax({
                            url:"{{ route('change.size') }}",
                            type:"POST",
                            data: {
                                _token: '{{ csrf_token() }}',
                                product_id: this.value,
                            }
                        }).done(function(data){
                            generatePriceStock(data);
                        });
                    }
                });

                function generatePriceStock(data) {
                    let priceHtml = "@lang('site.product_price')";
                    if (data.online_price) {
                        priceHtml += '<span class="price">' + data.online_price + '<span class="lari">o</span></span>';
                    } else {
                        if (data.discounted_price) {
                            priceHtml += '<span class="old_price">' + data.price + ' <span class="lari">o</span></span><span class="price">' + data.discounted_price + '<span class="lari">o</span></span>';
                        } else {
                            priceHtml += '<span class="price">' + data.price + '<span class="lari">o</span></span>';
                        }
                    }
                    let stocksHtml = data.quantity > 0 ? '<div class="instock"><svg id="Group_6856" data-name="Group 6856" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path id="Path_4746" data-name="Path 4746" d="M0,0H20V20H0Z" fill="none"/><path id="Path_4747" data-name="Path 4747" d="M10,18a8,8,0,1,1,8-8A8,8,0,0,1,10,18Zm-.8-4.8,5.656-5.657L13.727,6.412,9.2,10.938,6.939,8.674,5.808,9.806Z" transform="translate(0 0)" fill="#00b407"/></svg>@lang("site.instock")</div>' : '<div class="out_of_stock"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><g id="Group_7133" data-name="Group 7133" transform="translate(-1015 -459)"><path id="Path_4636" data-name="Path 4636" d="M0,0H20V20H0Z" transform="translate(1015 459)" fill="none"/><circle id="Ellipse_81" data-name="Ellipse 81" cx="8" cy="8" r="8" transform="translate(1017 461)" fill="#e8000d"/><path id="Path_4637" data-name="Path 4637" d="M9.636,8.747l3.111-3.111.889.889L10.525,9.636l3.111,3.111-.889.889L9.636,10.525,6.525,13.636l-.889-.889L8.747,9.636,5.636,6.525l.889-.889Z" transform="translate(1015.364 459.364)" fill="#fff"/></g></svg>@lang("site.outofstock")</div>';
                    $('div.pr_price').html(priceHtml);
                    $('div.stocks').html(stocksHtml);
                    $('.id').html('# ' + data.unique_code);
                }
            }
            $('.choose-product').click(function () {
                let title = $(this).text();
                let image = $(this).data('image');
                let technical = $(this).data('technical');
                let parent = $(this).parent().parent().parent();
                let html = '<div class="compare_product second"><div class="image"><img src="' + image + '" alt="' + title + '"></div><h2>' + title + '</h2></div>';
                $(html).insertAfter(parent);
                parent.css('display', 'none');
                $('#compare_modal .modal_container').addClass('active');
                $('.pr-second').html(technical);
            });
        })
    </script>
@endsection