<x-master-layout>
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12">
                <div class="card card-block card-stretch">
                    <div class="card-body p-0">
                        <div class="d-flex justify-content-between align-items-center p-3">
                            <h5 class="font-weight-bold">{{ $pageTitle }}</h5>
                            <a href="{{ route('product.index') }}" class="float-right btn btn-sm btn-primary"><i class="fa fa-angle-double-left"></i> {{ __('message.back') }}</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">
                        <div class="row p-1 py-0">
                            <div class="justify-content-between align-items-center p-1 mt-1">
                                <img src="{{ getSingleMedia($data, 'product_image') }}" alt="product_image" class="img-rounded" alt="Cinque Terre" width="304" height="150">
                            </div>
                            <div class="form-group col-xs-10 mt-1 mr-3 ml-3">
                                <h5 class ="font-weight-bold mt-2"> {{ ucwords($data->title ?? '-')}}</h5>
                                <h6 class ="mt-1" style="font-size: 15px;"><span class="text-muted">{{ __('message.price')}} : </span> {{ getPriceFormat($data->price) ?? '-' }}</h5>
                                <h6 class ="mt-1" style="font-size: 15px;"><span class="text-muted">{{ __('message.category')}} : </span>{{ ucwords($data->category->name) ?? '-'}}</h5>
                                <h6 class ="mt-1" style="font-size: 15px;"><span class="text-muted">{{ __('message.subcategory')}} : </span> {{ ucwords($data->subcategory->name) ?? '-'}}</h5>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @section('bottom_script')
    @endsection
    </x-master-layout>
