@extends('layout')


@section('content')
    <div class="container py-4">
        <!-- ✅ Summary Cards -->
        <div class="row">
            <!-- ✅ User Summary Card -->
            <div class="col-md-6 mb-4">
                <div class="card p-4 shadow-sm border h-100">
                    <h2 class="h4">Terms & Conditions For User</h2>
                    <p>
                        {!! \Illuminate\Support\Str::limit(strip_tags($userTerms->terms_and_conditions ?? 'No content available.'), 150) !!}
                    </p>
                    <div class="mt-3">
                        <button type="button" class="RedirectButton" data-bs-toggle="modal"
                            data-bs-target="#editModal">Edit</button>
                    </div>
                </div>
            </div>

            <!-- ✅ Partner Summary Card -->
            <div class="col-md-6 mb-4">
                <div class="card p-4 shadow-sm border h-100">
                    <h2 class="h4">Terms & Conditions For Partner</h2>
                    <p>
                        {!! \Illuminate\Support\Str::limit(
                            strip_tags($partnerTerms->terms_and_conditions ?? 'No content available.'),
                            150,
                        ) !!}
                    </p>
                    <div class="mt-3">
                        <button type="button" class="RedirectButton" data-bs-toggle="modal"
                            data-bs-target="#partnerEditModal">Edit</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- ✅ Full View Cards -->
        <div class="row">
            <!-- ✅ User Full View -->
            <div class="col-md-6 mb-4">
                <div class="card p-4 shadow-sm border h-100">
                    <h2 class="h5">Full Terms & Conditions (User)</h2>
                    <div style="max-height: 340px; overflow-y: auto;">
                        {!! $userTerms->terms_and_conditions ?? '<p>No terms & conditions available for user.</p>' !!}
                    </div>
                </div>
            </div>

            <!-- ✅ Partner Full View -->
            <div class="col-md-6 mb-4">
                <div class="card p-4 shadow-sm border h-100">
                    <h2 class="h5">Full Terms & Conditions (Partner)</h2>
                    <div style="max-height: 340px; overflow-y: auto;">
                        {!! $partnerTerms->terms_and_conditions ?? '<p>No terms & conditions available for partner.</p>' !!}
                    </div>
                </div>
            </div>
        </div>

        <!-- ✅ User Edit Modal -->
        <div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-centered">
                <div class="modal-content">
                    <form method="POST" action="{{ route('terms.update') }}">
                        @csrf
                        <div class="modal-header">
                            <h5 class="modal-title">Edit Terms & Conditions For User</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>

                        <div class="modal-body">
                            <input type="hidden" name="type" value="user">
                            <textarea id="termsEditor" name="terms_and_conditions" style="min-height: 300px;">{!! old('terms_and_conditions', $userTerms->terms_and_conditions ?? '') !!}</textarea>
                        </div>

                        <div class="modal-footer">
                            <button type="submit" class="btn btn-success">Save</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- ✅ Partner Edit Modal -->
        <div class="modal fade" id="partnerEditModal" tabindex="-1" aria-labelledby="partnerEditModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-centered">
                <div class="modal-content">
                    <form method="POST" action="{{ route('terms.update') }}">
                        @csrf
                        <div class="modal-header">
                            <h5 class="modal-title">Edit Terms & Conditions For Partner</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>

                        <div class="modal-body">
                            <input type="hidden" name="type" value="partner">
                            <textarea id="partnerTermsEditor" name="terms_and_conditions" style="min-height: 300px;">{!! old('terms_and_conditions', $partnerTerms->terms_and_conditions ?? '') !!}</textarea>
                        </div>

                        <div class="modal-footer">
                            <button type="submit" class="btn btn-success">Save</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- ✅ Bootstrap CDN -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>

    <!-- ✅ TinyMCE CDN -->
    <script src="https://cdn.tiny.cloud/1/nn13fnj9bbbeowqf4ch8jrv17ntoxal5n0wpgo1oc2j29h0v/tinymce/7/tinymce.min.js"
        referrerpolicy="origin"></script>

    <!-- ✅ TinyMCE Init -->
    <script>
        tinymce.init({
            selector: '#termsEditor',
            plugins: [
                'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount',
                'checklist mediaembed pageembed tableofcontents footnotes mergetags autocorrect markdown'
            ],
            toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link image media table mergetags | align lineheight | checklist numlist bullist indent outdent | emoticons charmap | removeformat',
            height: 300,
            branding: false,
        });

        tinymce.init({
            selector: '#partnerTermsEditor',
            plugins: [
                'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount',
                'checklist mediaembed pageembed tableofcontents footnotes mergetags autocorrect markdown'
            ],
            toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link image media table mergetags | align lineheight | checklist numlist bullist indent outdent | emoticons charmap | removeformat',
            height: 300,
            branding: false,
        });
    </script>
@endsection