@extends('layouts.app')
@section('header')
@endsection
@section('content')
<div class="row">
    <div  class="col col-6">
        <div  class="card theme--dark card--density-default card--variant-elevated">
            <!---->
            <div class="card__loader">
                <div class="progress-linear progress-linear--rounded progress-linear--rounded-bar progress-linear--rounded theme--dark locale--is-ltr" role="progressbar" aria-hidden="true" aria-valuemin="0" aria-valuemax="100" style="top: 0px; height: 0px; --progress-linear-height: 2px;">
                    <!---->
                    <div class="progress-linear__background bg-primary"></div>
                    <div class="progress-linear__buffer bg-primary" style="width: 0%;"></div>
                    <div class="progress-linear__indeterminate">
                        <div class="progress-linear__indeterminate long bg-primary"></div>
                        <div class="progress-linear__indeterminate short bg-primary"></div>
                    </div>
                    <!---->
                </div>
            </div>
            <!---->
            <!---->
            <div  class="card-text text-center pt-12 pb-6">
                <div  class="avatar theme--dark avatar--density-default rounded-lg avatar--variant-flat" style="width: 120px; height: 120px;">
                    <div  class="responsive img">
                        <div class="responsive__sizer" style="padding-bottom: 100%;"></div><img class="img__img img__img--cover" src="{{asset('assets/img/avatars/3.png')}}" style="">
                        <!---->
                        <!---->
                        <!---->
                        <!---->
                        <!---->
                    </div>
                    <!----><span class="avatar__underlay"></span>
                </div>
                <h5  class="text-h5 mt-4">Selina Kyle</h5><span  class="chip theme--dark text-error chip--density-default chip--size-small chip--variant-tonal text-capitalize mt-4" draggable="false">
                    <!----><span class="chip__underlay"></span>
                    <!---->
                    <!---->
                    <div class="chip__content" data-no-activator="">admin</div>
                    <!---->
                    <!---->
                </span>
            </div>
            <div  class="card-text d-flex justify-center flex-wrap gap-6 pb-6">
                <div  class="d-flex align-center me-8">
                    <div  class="avatar theme--dark text-primary avatar--density-default avatar--rounded avatar--variant-tonal me-4" style="width: 40px; height: 40px;"><i  class="ri-check-line icon notranslate theme--dark" aria-hidden="true" style="font-size: 24px; height: 24px; width: 24px;"></i>
                        <!----><span class="avatar__underlay"></span></div>
                    <div >
                        <h5  class="text-h5">1,230</h5><span >Task Done</span>
                    </div>
                </div>
                <div  class="d-flex align-center me-4">
                    <div  class="avatar theme--dark text-primary avatar--density-default avatar--rounded avatar--variant-tonal me-4" style="width: 44px; height: 44px;"><i  class="ri-briefcase-line icon notranslate theme--dark" aria-hidden="true" style="font-size: 24px; height: 24px; width: 24px;"></i>
                        <!----><span class="avatar__underlay"></span></div>
                    <div >
                        <h5  class="text-h5">568</h5><span >Project Done</span>
                    </div>
                </div>
            </div>
            <div  class="card-text pb-6">
                <h5  class="text-h5"> Details </h5>
                <hr  class="divider theme--dark my-4" aria-orientation="horizontal" role="separator">
                <div  class="list theme--dark list--density-default list--one-line card-list" tabindex="0" role="listbox">
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium">Username:</span><span  class="text-body-1"> @catwomen1940</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Billing Email: </span><span  class="text-body-1">irena.dubrovna@wayne.com</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Status: </span><span  class="text-body-1 text-capitalize">Active</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium">Role: </span><span  class="text-capitalize text-body-1">admin</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Tax ID: </span><span  class="text-body-1">Tax-8894</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Contact: </span><span  class="text-body-1">(829) 537-0057</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Language: </span><span  class="text-body-1">English</span></div>
                        </div>
                        <!---->
                    </div>
                    <div  class="list-item theme--dark list-item--density-default list-item--one-line rounded-0 list-item--variant-text">
                        <!----><span class="list-item__underlay"></span>
                        <!---->
                        <div class="list-item__content" data-no-activator="">
                            <!---->
                            <!---->
                            <div  class="list-item-title text-sm"><span  class="font-weight-medium"> Country: </span><span  class="text-body-1">United States</span></div>
                        </div>
                        <!---->
                    </div>
                </div>
            </div>
            <div  class="card-text d-flex justify-center"><button  type="button" class="btn btn--elevated theme--dark bg-primary btn--density-default btn--size-default btn--variant-elevated me-4"><span class="btn__overlay"></span><span class="btn__underlay"></span>
                    <!----><span class="btn__content" data-no-activator=""> Edit </span>
                    <!---->
                    <!----></button><button  type="button" class="btn theme--dark text-error btn--density-default btn--size-default btn--variant-outlined"><span class="btn__overlay"></span><span class="btn__underlay"></span>
                    <!----><span class="btn__content" data-no-activator=""> Suspend </span>
                    <!---->
                    <!----></button></div>
            <!---->
            <!----><span class="card__underlay"></span>
        </div>
    </div>
</div>
@endsection
@section('scripts')
@endsection