@extends('layouts.site')

@section('meta_title', $page ? $page->getMetaTitle() : '')
@section('meta_description', $page ? $page->getMetaDescription() : '')
@section('meta_keywords', $page ? $page->getMetaKeywords() : '')

@section('content_header')
@include('partials._callouts._slider')
@endsection

@section('content')
<section class="site-main-section">
    <div class="site-container space-y-6">
        @if ($page && $page->hasContent())
        <div class="card bg-base-100 shadow-xl">
            <div class="card-body">
                {!! $page->getContent() !!}
            </div>
        </div>
        @endif
        @auth
        <div class="dashboard">
            <div class="dashboard-stats">
                <div class="stat stat-dashboard">
                    <div class="stat-title">Points Earned</div>
                    <div class="stat-value">66,354</div>
                    <div class="stat-figure">
                        <span class="fa-regular fa-star text-2xl" aria-hidden="true"></span>
                    </div>
                </div>
                <div class="stat stat-dashboard">
                    <div class="stat-title">Points Redeemed</div>
                    <div class="stat-value">41,275</div>
                    <div class="stat-figure">
                        <span class="fa-solid fa-gift text-2xl" aria-hidden="true"></span>
                    </div>
                </div>
                <div class="stat stat-dashboard">
                    <div class="stat-title">Approved Sales</div>
                    <div class="stat-value">16</div>
                    <div class="stat-figure">
                        <span class="fa-solid fa-dollar-sign text-2xl" aria-hidden="true"></span>
                    </div>
                </div>
                <div class="stat stat-dashboard">
                    <div class="stat-title">Courses Passed</div>
                    <div class="stat-value">4</div>
                    <div class="stat-figure">
                        <span class="fa-solid fa-arrow-right-to-bracket text-2xl" aria-hidden="true"></span>
                    </div>
                </div>
            </div>
            <div class="dashboard-cards">
                <div class="card card-dashboard">
                    <div class="card-body">
                        <div class="flex items-center gap-3">
                            <div class="stat-figure">
                                <span class="fa-solid fa-star text-2xl" aria-hidden="true"></span>
                            </div>
                            <h2 class="card-title">Ignite User</h2>
                        </div>
                        <p class="card-content">Points Balance: <span class="font-semibold">25,079</span></p>
                        <p class="card-content">Member Since: <span class="font-semibold">2024</span></p>
                        <a href="{{ url('/claim') }}" class="btn btn-block">MY STATEMENT</a>
                    </div>
                </div>

                <div class="card card-dashboard">
                    <div class="card-body">
                        <div class="flex items-center gap-3">
                            <div class="stat-figure">
                                <span class="fa-solid fa-file-circle-check text-2xl" aria-hidden="true"></span>
                            </div>
                            <h2 class="card-title">CLAIM YOUR SALES</h2>
                        </div>
                        <p class="card-content">GREAT PRODUCTS</p>
                        <p class="card-content">The more you claim, the more you can earn!</p>
                        <a href="{{ url('/activity') }}" class="btn btn-block">CLAIM NOW</a>
                    </div>
                </div>

                <div class="card card-dashboard">
                    <div class="card-body">
                        <div class="flex items-center gap-3">
                            <div class="stat-figure">
                                <span class="fa-solid fa-graduation-cap text-2xl" aria-hidden="true"></span>
                            </div>
                            <h2 class="card-title">LEARN & EARN</h2>
                        </div>
                        <div class="space-y-2">
                            <a href="#" class="text-sm hover:underline block">Why MAAX ›</a>
                            <a href="#" class="text-sm hover:underline block">Why Maidstone ›</a>
                            <a href="#" class="text-sm hover:underline block">Why Swan ›</a>
                        </div>
                        <a href="{{ url('/courses') }}" class="btn btn-block">COURSES</a>
                    </div>
                </div>

                <div class="card card-dashboard">
                    <div class="card-body">
                        <h2 class="card-title">MY FAVORITES</h2>
                        <p class="card-content">You do not have a favorite yet!</p>
                        <a href="#" class="btn btn-block">SHOP</a>
                    </div>
                </div>

                <div class="card card-dashboard">
                    <div class="card-body">
                        <h2 class="card-title">ELIGIBLE PRODUCTS</h2>
                        <p class="card-content">Find out what you can earn for each product sold.</p>
                        <a href="#" class="btn btn-block">LEARN MORE</a>
                    </div>
                </div>

                <div class="card card-dashboard">
                    <div class="card-body">
                        <h2 class="card-title">SPIN & WIN</h2>
                        <p class="card-content">Complete a training module and earn a spin</p>
                        <p class="card-content">Spins available: 0</p>
                        <a href="#" class="btn btn-block">SPIN</a>
                    </div>
                </div>
            </div>
        </div>
        @endauth
    </div>
</section>
@endsection
