@extends('layouts.client')

@section('content')
    @can('isViewer')
        <section class="section bg-light">
            <div class="container">
                <div class="profile-card">
                    <div class="profile-card-body">
                        <div class="d-flex gap-4">
                            <div class="profile-avatar">
                                {{ auth()->user()->initials }}
                            </div>
                            <div>
                                <div class="profile-name">{{ auth()->user()->name }}</div>
                                <div class="profile-username text-lowercase">{{ '@'.auth()->user()->username }}</div>
                                <div class="profile-joined"><i class='bx bxs-calendar-event'></i> Joined in {{ auth()->user()->date_joined }}</div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row g-4 mt-2">
                    <div class="col-xl-4 col-lg-4 col-md-4">
                        @include('client.viewers.account.profile-nav')
                    </div>

                    <div class="col-xl-8 col-lg-8 col-md-8">
                        <div class="row g-4">
                            <div class="col-xl-12">
                                @yield('account-content')
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </section>
    @endcan
@endsection