@php
    $translations = parse_translation($course);
    $categoryTranslations = parse_translation($course->category);
    $reviews = review($course);

    $imagePath = 'lms/courses/thumbnails';
    $defaultThumbnail = 'lms/frontend/assets/images/420x252.svg';
    $thumbnail =
        !empty($course?->thumbnail) && fileExists($imagePath, $course->thumbnail)
            ? asset('storage/' . $imagePath . '/' . $course->thumbnail)
            : asset($defaultThumbnail);

    $randomKey = random_string(2);
    $currency = $course?->coursePrice->currency ?? 'USD-$';
    $currencySymbol = get_currency_symbol($currency);
@endphp


<div
    class="flex flex-col bg-white rounded-2xl h-full p-5 group-data-[card-layout=list]:flex-row [&.card-border]:border [&.card-border]:border-border [&.card-border]:hover:shadow-md custom-transition group/course {{ isset($borderClass) ? 'card-border' : '' }}">
    <!-- COURSE THUMBNAIL -->
    <div class="relative aspect-video rounded-xl overflow-hidden">
        <img data-src="{{ $thumbnail }}"
            class="course-grid-thumb-img w-full group-hover/topCourse:scale-110 duration-300" alt="Course thumbnail" />
        <!-- badge -->
        @foreach ($course->levels as $level)
            @php $levelTranslations = parse_translation($level); @endphp
            <span
                class="badge b-solid badge-secondary-solid rounded-full !text-heading dark:text-white absolute top-4 left-4 rtl:left-auto rtl:right-4 z-10">{{ $levelTranslations['name'] ?? ($level->name ?? '') }}
            </span>
        @endforeach
        @auth
            @php
                $class = user_wishlist_check($course->id) ? 'active' : '';
            @endphp
            <label for="course_{{ $course->id . '' . $randomKey }}"
                class="flex-center absolute top-3 end-3 size-9 rounded-50 bg-white cursor-pointer select-none z-[1] add-wishlist group/wishlist {{ $class }}"
                data-id="{{ $course->id }}">
                <input type="checkbox" id="course_{{ $course->id . '' . $randomKey }}"
                    class="appearance-none flex-center before:font-remix before:content-['\ee0f'] before:leading-none before:text-heading group-[.active]/wishlist:before:text-primary before:text-xl group-[.active]/wishlist:before:content-['\ee0e'] cursor-pointer">
            </label>
        @else
            <label for="course_{{ $course->id . '' . $randomKey }}"
                class="flex-center absolute top-3 end-3 size-9 rounded-50 bg-white cursor-pointer select-none z-[1]"
                data-id="{{ $course->id }}">
                <a href="{{ route('auth.login') }}" id="course_{{ $course->id . '' . $randomKey }}"
                    class="appearance-none flex-center before:font-remix before:content-['\ee0f'] before:leading-none before:text-heading before:text-xl checked:before:content-['\ee0e'] cursor-pointer">
                </a>
            </label>
        @endauth

        <!-- ADD TO WISHLIST -->

    </div>
    <!-- COURSE CONTENT -->
    <div class="mt-6 group-data-[card-layout=list]:mt-0 group-data-[card-layout=list]:ml-6">
        <div class="flex-center-between">
            <div class="badge badge-heading-outline b-outline rounded-full shrink-0">
                {{ $categoryTranslations['title'] ?? ($course?->category?->title ?? '') }}</div>
            @if ($course?->courseSetting?->is_free)
                <div class="text-primary text-xl !leading-none font-bold text-right shrink-0 flex items-center gap-1.5">
                    <span>{{ translate('Free') }}</span>
                </div>
            @else
                <div class="text-primary text-xl !leading-none font-bold text-right shrink-0 flex items-center gap-1.5">
                    @if (isset($course?->coursePrice) &&
                            $course?->coursePrice?->discount_flag == 1 &&
                            $course?->coursePrice?->discount_period != '' &&
                            dateCompare($course?->coursePrice?->discount_period) == true)
                        <span> {{ $course?->coursePrice->currency }}
                            {{ dotZeroRemove($course?->coursePrice?->discounted_price ?? 0) }}</span>
                        <span>
                            <del
                                class="text-heading/50 text-[16px] font-semibold">{{ $currencySymbol }}{{ dotZeroRemove($course?->coursePrice?->price ?? 0) }}</del>
                        </span>
                    @else
                        <span>{{ $currencySymbol }}{{ dotZeroRemove($course?->coursePrice?->price ?? 0) }}</span>
                    @endif
                </div>
            @endif
        </div>
        <h6 class="area-title font-bold !text-xl mt-3 group-hover/course:text-primary custom-transition">
            <a href="{{ route('course.detail', $course->slug) }}" class="line-clamp-2"
                aria-label="Course title">{{ $translations['title'] ?? ($course->title ?? '') }}</a>
        </h6>

        @if (!isset($isComing))
            <div class="flex items-center gap-2 mt-3">
                <div class="flex items-center gap-0.5 text-secondary">
                    {!! show_rating($reviews['average_rating']) !!}
                </div>
                <p class="area-description text-sm !leading-none">
                    ({{ dotZeroRemove($reviews['average_rating']) ?? 0 }} {{ translate('Rating') }})
                </p>
            </div>
        @endif

        <div class="flex-center-between gap-2 pt-4 mt-6 border-t border-heading/10">
            <div class="flex items-center gap-1 area-description text-sm !leading-none shrink-0">
                <i class="ri-time-line"></i>
                <span>{{ $course->duration }}</span>
            </div>
            <div class="flex items-center gap-4 shrink-0">
                <div class="flex items-center gap-1 area-description text-sm !leading-none shrink-0">
                    <i class="ri-book-line"></i>
                    <span>{{ $course?->chapters?->count() ?? 0 }} {{ translate('Lessons') }} </span>
                </div>
                @if (!isset($isComing))
                    <div class="flex items-center gap-1 area-description text-sm !leading-none shrink-0">
                        <i class="ri-group-line"></i>
                        <span> {{ $course?->totalPurchases?->count() ?? 0 }} {{ translate('Student') }}
                        </span>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>
