@extends('layouts.acorn.acorn_frontend_app')
@section('header_styles')
    <style>
        .sm-link {
            margin-left: 10px !important;
            font-size: 13px
        }
    </style>
@endsection
@section('content')
    <div class="row">
        <div class="col-auto d-none d-lg-flex">
            <div class="nav flex-column sw-25 mt-n2" id="settingsColumn">
            </div>
        </div>

        <div class="col">

            <div class="page-title-container">
                <div class="row">
                    <div class="col">
                        <h1 class="mb-0 pb-0 display-4" id="title">Client</h1>
                    </div>

                    @include('frontend.profile.component.menu')

                </div>
            </div>

            <h2 class="small-title">Client Details</h2>

            <div class="card mb-2">
                <div class="card-body row g-0">
                    <div class="col-auto">
                        <div class="d-inline-block d-flex">
                            <div class="bg-gradient-light sw-6 sh-6 rounded-xl">
                                <div class="text-white d-flex justify-content-center align-items-center h-100">
                                    <i data-acorn-icon="radish"></i>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col">
                        <div class="card-body d-flex flex-column pe-0 pt-0 pb-0 h-100 justify-content-start">
                            <div class="d-flex flex-column">
                                <div class="d-flex flex-column justify-content-center sh-6">
                                    <p class="heading small-title">{{ $client_details[0]->client->name }}</p>
                                </div>
                            </div>
                            <div class="mb-n2">
                                <div class="row g-0 mb-2">
                                    <div class="col-auto">
                                        <p>BR Number -: </p>
                                    </div>
                                    <div class="col ml-2">
                                        <p href="#" class="alternate-link align-top">
                                            {{ $client_details[0]->client->br_number }}</p>
                                    </div>
                                </div>
                                <div class="row g-0 mb-2">
                                    <div class="col-auto">
                                        <p>Email -: </p>
                                    </div>
                                    <div class="col ml-2">
                                        <p href="#" class="alternate-link align-top">
                                            {{ $client_details[0]->client->email }}</p>
                                    </div>
                                </div>
                                <div class="row g-0 mb-2">
                                    <div class="col-auto">
                                        <p>Mobile -: </p>
                                    </div>
                                    <div class="col ml-2">
                                        <p href="#" class="alternate-link align-top">
                                            {{ $client_details[0]->client->mobile }}</p>
                                    </div>
                                </div>
                                <div class="row g-0 mb-2">
                                    <div class="col-auto">
                                        <p>Client Type -: </p>
                                    </div>
                                    <div class="col ">
                                        <p href="#" class="alternate-link align-top">{{ $client_details[0]->client->type_of_client }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        $(document).ready(function() {});
    </script>
@endsection
@section('footer_scripts')
    <script src="{{ asset('acorn/js/pages/profile.settings.js') }}"></script>
    <script src="{{ asset('acorn/js/vendor/movecontent.js') }}"></script>
@endsection