@extends('web.layouts.app')

@section('title', transWord('المفضلة'))

@section('sub_header')
    <div class="sub-header">
        <div class="main-container">
            <div class="title-pages">
                <h2>{{ transWord('المفضلة') }}</h2>
                <div class="breadcrumb-header">
                    <a href="{{ route('web.supply.home') }}"> {{ transWord('الرئيسية') }} </a>
                    <i class="bi bi-chevron-double-left"></i>
                    <span> {{ transWord('المفضلة') }}</span>
                </div>
            </div>


        </div>
    </div>
@endsection

@section('content')
    <section class="profile-page mr-section">
        <div class="main-container">
            <div class="row">
                @include('web.includes.profile-sidebar')

                <div class="col-lg-8">
                    <div class="main-profile-page">
                        <h2 class="title-profile">{{ transWord('المفضلة') }} </h2>
                        <div class="row row-gap">

                            @foreach (auth()->user()->favorites as $favorite)
                                <div class="col-lg-6">

                                    <div class="sub-product">
                                        <div class="img-product">
                                            <img src="{{ asset('storage/' . $favorite->product->images[0]->image) }}"
                                                alt="{{ $favorite->product->name }}">

                                            <div
                                                class="heart-product {{ auth()->user()->favorites->contains('product_id', $favorite->product->id)? 'active': '' }}">
                                                <button data-product_id="{{ $favorite->product->id }}">
                                                    <i
                                                        class="bi {{ auth()->user()->favorites->contains('product_id', $favorite->product->id)? 'bi-heart-fill': 'bi-heart' }} "></i>
                                                </button>
                                            </div>

                                            <div class="new-product"
                                                style="background: {{ $favorite->product->label_color }}">
                                                {{ $favorite->product->label }} </div>
                                                <a href="{{ route('web.supply.product-details', $favorite->product->slug) }}"
                                                    class="add-to-cart-product">
                                                    {{ transWord('اضف للسلة') }}
                                                </a>

                                        </div>

                                        <div class="text-product">
                                            <a href="{{ route('web.supply.product-details', $favorite->product->slug) }}">

                                                <h2>{{ $favorite->product->name }}</h2>
                                                <div class="rate">
                                                    <span class="fa fa-star checked"></span>
                                                    <span class="fa fa-star checked"></span>
                                                    <span class="fa fa-star checked"></span>
                                                    <span class="fa fa-star"></span>
                                                    <span class="fa fa-star"></span>
                                                    <i>(4.6)</i>
                                                </div>
                                            </a>
                                        </div>
                                    </div>


                                </div>
                            @endforeach

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection