<div class="d-flex align-items-center border-bottom px-3 py-2 mb-0 m-neg-3 bg-light">
    <div class="d-flex align-items-start justify-content-between w-100">
       <div class="d-flex flex-wrap">
        <div class="me-2">
            <h2 class="font-size-16 text-secondary fw-bold m-0">Name:</h2>
        </div>
        <div>
            <div class="d-flex align-items-center">
                <h2 class="font-size-16 text-secondary fw-bold m-0">{{ $user->displayName() }}</h2>
                <div class="ms-2">
                    @include('app.my-account.admin.users.forms.update-name')
                </div>
            </div>
            <span class="me-2">First Name: <b>{{ $user->name_first ?? '--' }}</b></span>
            <span class="me-2">Last Name: <b>{{ $user->name_last ?? '--' }}</b></span>
            <span class="me-2">Suffix: <b>{{ $user->name_suffix ?? '--' }}</b></span>
            <span class="me-2">Credential: <b>{{ $user->name_credential ?? '--' }}</b></span>
            @if($user->cell_number)<span class="me-2">Cell #: <b><a href="tel:{{$user->cell_number}}" class="phone">{{$user->cell_number}}</a></b></span>@endif
            @if($user->phone_number)<span class="me-2">Phone #: <b><a href="tel:{{$user->phone_number}}" class="phone">{{$user->phone_number}}</a></b></span>@endif
            @if($user->mailing_address_phone_number)<span class="me-2">Mailing Cell #: <b><a href="tel:{{$user->mailing_address_phone_number}}" class="phone">{{$user->mailing_address_phone_number}}</a></b></span>@endif
            @if($user->is_agreed_as_rep || $user->is_agreed_as_manager)
                <span class="me-2">PayPal Email: <b>{{ $user->paypal_email_address ?? '--' }}</b></span>
            @endif
        </div>
    </div>
    <div>
        <div>
            @include('app.my-account.admin.users.forms.sticky-note')
        </div>
        <div class="sticky-note">
            <small class="text-muted">{{ $user->sticky_note ?? '---' }}</small>
        </div>
    </div> 
    </div>
    

    <div class="d-block d-md-none ms-auto">
        <div class="on-hover-show d-inline-block position-relative">
            <span class="border rounded px-2 py-1 bg-white">…</span>
            <div class="on-hover-content pt-3">
                @include('app.my-account.admin.users.partials.sidebar-mobile')
            </div>
        </div>
    </div>
</div>
