@extends('dashboard.layout.layout')
@section('content')
<!-- Inner container -->
{{-- <div class="d-flex align-items-start flex-column flex-md-row"> --}}
<div class="row">
    <div class="col-md-9">
        <!-- Left content -->
        <div class="w-100 overflow-auto order-2 order-md-1">

            <!-- Post -->
            <div class="card border-info bg-transparent">
                <div class="card-body">
                    <div class="mb-4">
                        <h4 class="font-weight-semibold mb-1">
                            {{ $contact->title }}
                        </h4>

                        <ul class="list-inline list-inline-dotted text-muted mb-3">
                            <li class="list-inline-item">
                                {{ trans('dashboard.contact.writtenBy') }} <a href="{{ $contact->user_id ? route('dashboard.'.$contact->user->user_type.'.show',$contact->user_id) : '#' }}" class="text-muted"> {{ $contact->fullname }}</a>
                            </li>
                            <li class="list-inline-item">
                                {{ $contact->created_at->format("Y-m-d h:i A") }}
                                <i class="feather icon-clock ml-1 mr-1"></i>
                            </li>
                            @if ($contact->order_id)
                            <li class="list-inline-item">
                                <a href="{{ route('dashboard.product_order.show',$contact->order_id) }}">{{ $contact->order_id }}</a>
                                <i class="feather icon-shopping-cart ml-1 mr-1"></i>
                            </li>

                            @endif

                        </ul>
                        <div class="divider divider-success">
                            <div class="divider-text">{!! trans('dashboard.chat.message') !!}</div>
                        </div>
                        <div class="m-3">
                            <p>{{ $contact->content }}</p>
                        </div>

                        {{-- <div class="card card-body bg-light rounded-left-0 border-left-3 border-left-warning">

                        </div>
                        <p class="mb-1">{{ $contact->content }}</p> --}}

                    </div>

                </div>
            </div>
            <!-- /post -->



            <!-- Comments -->
            <!--<div class="card border-info bg-transparent">-->
            <!--    <div class="card-header header-elements-inline">-->
            <!--        <h6 class="card-title font-weight-semibold">{!! trans('dashboard.contact.replies') !!}</h6>-->
            <!--        <div class="header-elements">-->
            <!--            {{-- <ul class="list-inline list-inline-dotted text-muted mb-0">-->
            <!--        <li class="list-inline-item">{!! trans('dashboard.contact.reply_count') !!} / <span class="reply_count">{{ $contact->replies->count() }}</span> </li>-->

            <!--            </ul> --}}-->
            <!--            <p class="ml-auto d-flex align-items-center">-->
            <!--                <i class="feather icon-message-square font-medium-2 mr-50"></i>-->
            <!--                <span class="reply_count"></span>-->
            <!--            </p>-->
            <!--        </div>-->
            <!--    </div>-->


             
                <!-- Archive -->


                <!--<div class="card border-info">-->
                <!--    <div class="card-header d-flex justify-content-between align-items-center border-bottom pb-1">-->
                <!--        <div class="card-title">{!! trans('dashboard.contact.archive') !!}</div>-->
                <!--    </div>-->
                <!--    <div class="card-content">-->
                <!--        <div class="list-group analytics-list">-->
                <!--            @forelse ($archives as $archive)-->
                <!--            <div class="list-group-item d-lg-flex justify-content-between align-items-start py-1">-->
                <!--                <div class="float-left">-->
                <!--                    <p class="text-bold-600 font-medium-2 mb-0 mt-25">{{ $archive->month_name ." ".$archive->year }}</p>-->
                <!--                </div>-->
                <!--                <div class="float-right">-->
                <!--                    <a href="{{ route('dashboard.contact.index') }}/?month={{ $archive->month }}&year={{ $archive->year }}" class="btn btn-sm btn-icon rounded-circle btn-outline-primary mr-50 waves-effect waves-light">-->
                <!--                        <i class="feather icon-monitor"></i>-->
                <!--                    </a>-->
                <!--                </div>-->
                <!--            </div>-->
                <!--            @empty-->
                <!--            <li class="media font-weight-semibold border-0 py-2 justify-content-center">{!! trans('dashboard.contact.no_archive') !!}</li>-->
                <!--            @endforelse-->
                <!--        </div>-->
                <!--    </div>-->
                <!--</div>-->
                <!-- /archive -->

            <!--</div>-->
            <!-- /sidebar content -->

        </div>
        <!-- /right sidebar component -->

    </div>
</div>



{{-- </div> --}}
<!-- /inner container -->
@include('dashboard.layout.delete_modal')

@endsection
@section('page_styles')
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/{{ LaravelLocalization::getCurrentLocaleDirection() }}/css/pages/users.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.18/summernote-bs4.min.css" rel="stylesheet">

<style media="screen">
    body.dark-layout .card .note-toolbar,
    body.dark-layout .card .note-toolbar {
        color: #fff;
        background-color: #55565c;
    }

    .note-btn-group .note-btn {
        border-color: rgba(209, 110, 110, 0.2);
        padding: 0.50rem .75rem;
        font-size: 17px;
    }

    .note-btn-group .note-btn {
        color: #000;
    }

    .note-btn-group .note-btn .note-current-fontname {
        font-family: 'Cairo';
        color: #000;
    }

    .note-editor.note-airframe,
    .note-editor.note-frame {
        border: 1px solid;
        border-color: #000;
    }

    .note-resize button span {
        color: #000;
    }
</style>
@endsection
@section('page_scripts')
<script src="{{ asset('dashboardAssets') }}/js/scripts/pages/user-profile.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.18/summernote-bs4.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/lang/summernote-ar-AR.min.js"></script>
<script>
    $(function() {
        $('#summernote').summernote({
            tabsize: 10,
            height: 250,
            lang: "{{ app()->getLocale() == 'ar' ? 'ar-AR' : '' }}"
        });
    });
</script>

@endsection