@extends('backend.layout.masterlayout')
@section('content')
    @include('backend.partial.user-guide-sidebar')
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f8f9fa;
            color: #343a40;
        }
        h6{
            background: #6c6868;
            color: #fff;
            padding: 5px;
        }
        ol, ul {
            margin-bottom: 20px;
        }
        li {
            margin-bottom: 10px;
        }
        .note {
            font-style: italic;
            color: #6c757d;
        }
        h5{
            color: #1b3961;
            font-weight: 600;
        }
        h2 {
            font-size: 1.8rem;
            font-weight: 600;
        }

    </style>
    <div class="page-wrapper">
        <!--page-content-wrapper-->
        <div class="page-content-wrapper">
            <div class="page-content" style="padding:unset;">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-body">
                                {{-- <div class="card-title">
                                    <h5 class="mb-0"><b><i class="bx bx-layout"></i> {{$userGuideInfo_jsonData['heading']}} </b>
                                    </h5>
                                </div>
                                <hr /> --}}
                                {!!$userGuideInfo_jsonData['guide_content']!!}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--end page-content-wrapper-->
    </div>
    <!--end page-wrapper-->
    <!--start overlay-->
    <div class="overlay toggle-btn-mobile"></div>
    <!--end overlay-->
    <!--Start Back To Top Button-->
    <a href="javaScript:;" class="back-to-top"><i class='bx bxs-up-arrow-alt'></i></a> @include('backend.partial.dashboard_footer')
@endsection