@extends('frontend.layouts.master', ['page' => $page])
@section('content')
    @if($layout_cat)
        <div class="app">
            @php
                $path = 'views/livewire/frontend/layouts/detail';
                $file_name = get_details_page_design($content->id);
            @endphp
            <h1>{{$file_name}}</h1>
            @if(has_view_file($file_name.'.blade.php',$path))
                @livewire('frontend.layouts.detail.'.$file_name,['record_id'=>$content->id])
            @else
                <div class="bg-image mb-5" style="background-image: url('{{ asset('/img/bg-img.jpg') }}');background-size: cover;background-repeat: no-repeat;">
                    <div class="bg-primary-default">
                        <div class="container p-lg-0">
                            <div class="row">
                                <div class="col-lg-9">
                                    <div class="page-title d-flex align-items-center me-3 flex-wrap py-20 ">

                                        <!--begin::Breadcrumb-->
                                        <ul class="breadcrumb breadcrumb-separatorless fw-bold fs-30 my-1">
                                            <!--begin::Item-->
                                            <li class="breadcrumb-item text-warning">
                                                <a href="/" class="text-warning text-hover-primary">Home</a>
                                            </li>
                                            <!--end::Item-->
                                            <!--begin::Item-->
                                            <li class="breadcrumb-item">
                                                <span class="bullet bg-gray-200 w-5px h-2px"></span>
                                            </li>
                                            <!--end::Item-->
                                            <!--begin::Item-->
                                            <li class="breadcrumb-item text-white">{{ $heading }}</li>
                                            <!--end::Item-->
                                        </ul>
                                        <!--end::Breadcrumb-->
                                    </div>
                                </div>

                            </div>
                        </div>

                    </div>
                </div>

                <div class="bg-image">
                    <div class="p-5 mb-20">
                        <div class="container lg-p-0">
                            <div class="pb-10 text-center" id="heading_ti_adn">
                                <h1 class="font-w700 mb-2" id="f_ad_ne_main_title">
                                    {{ $content->heading }}
                                </h1>
                                <p>
                                    {{ $content->sub_heading }}
                                </p>
                            </div>
                        </div>
                        <div class="container">
                            <div class="card mb-5">
                                <div class="card-body">
                                    <div class="row justify-content-center">
                                        <div class="col-2">
                                            <img src="/{{ get_image($content->image) }}" alt="">
                                        </div>
                                        <div class="col-lg-10">
                                            <h2 class="text-dark fw-bolder text-hover-primary fs-3">
                                                {{ $content->heading }}
                                            </h2>
                                            <div class="text-dark">
                                                {!! $content->details !!}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endif

        </div>

    @else
    <div class="bg-image mb-5" style="background-image: url('{{ asset('/img/bg-img.jpg') }}');background-size: cover;background-repeat: no-repeat;">
        <div class="bg-primary-default">
            <div class="container p-lg-0">
                <div class="row">
                    <div class="col-lg-9">
                        <div class="page-title d-flex align-items-center me-3 flex-wrap py-20 ">

                            <!--begin::Breadcrumb-->
                            <ul class="breadcrumb breadcrumb-separatorless fw-bold fs-30 my-1">
                                <!--begin::Item-->
                                <li class="breadcrumb-item text-warning">
                                    <a href="/" class="text-warning text-hover-primary">Home</a>
                                </li>
                                <!--end::Item-->
                                <!--begin::Item-->
                                <li class="breadcrumb-item">
                                    <span class="bullet bg-gray-200 w-5px h-2px"></span>
                                </li>
                                <!--end::Item-->
                                <!--begin::Item-->
                                <li class="breadcrumb-item text-white">{{ $heading }}</li>
                                <!--end::Item-->
                            </ul>
                            <!--end::Breadcrumb-->
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </div>

    <div class="bg-image">
        <div class="p-5 mb-20">
            <div class="container lg-p-0">
                <div class="pb-10 text-center" id="heading_ti_adn">
                    <h1 class="font-w700 mb-2" id="f_ad_ne_main_title">
                        {{ $content->heading }}
                    </h1>
                    <p>
                        {{ $content->sub_heading }}
                    </p>
                </div>
            </div>
            <div class="container">
                <div class="card mb-5">
                    <div class="card-body">
                        <div class="row justify-content-center">
                            <div class="col-2">
                                <img src="/{{ get_image($content->image) }}" alt="">
                            </div>
                            <div class="col-lg-10">
                                <h2 class="text-dark fw-bolder text-hover-primary fs-3">
                                    {{ $content->heading }}
                                </h2>
                                <div class="text-dark">
                                    {!! $content->details !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

@endsection