@extends('includes.layout')
@section('content')

<link rel="stylesheet" href="https://cdn.datatables.net/1.13.7/css/jquery.dataTables.min.css">

    <style>
        /* slide nav bar css */
        #menu5 span {
            width: max-content !important;
        }

        .ok_btn {
            background-color: #0069d9;
            color: #fff;
            padding: 5px 20px;
            border: none;
            border-radius: 5px;
        }
        .ql-code-block{
            display:none !important;
           }
        .sou-yt-pupop, .sou-yt-pupopp {
            width: 100%;

            height: 20rem;
            /* width: 39rem; */
            background-color: white;
            position: relative;
            top: auto;
            right: auto;
            box-shadow: 4px 6px 11px -1px #ddd;
            border-radius: 8px;
            padding: 1rem;
            display: none;
        }

        .sou-pay-pupop {
            height: 20rem;
            width: 100%;
            background-color: white;
            top: auto;
            right: auto;
            box-shadow: 4px 6px 11px -1px #ddd;
            border-radius: 8px;
            padding: 1rem;
            display: none;
        }


        html,
        body,
        .main_container {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
            margin: 0;
            padding: 0;
            height: 100%;
        }

        .main {
            font-size: 18px;
            margin: 2rem 0 0;
        }

        .main_body_container {
            display: flex;
            width: 100%;
            height: 100%;
        }

        .compose_btn {
            border-radius: 25px !important;
            font-size: 14px !important;
            height: 30px;
            width: 45%;
            background-color: #4573d2;
            color: #fff;
            border: 2px solid #4573d2;
            font-weight: 500;
        }

        .compose_btn:hover {
            background-color: #fff;
            color: #4573d2;
        }

        .dropdown-content a {
            position: relative !important;
            left: -21px !important;
            padding: 8px 0px 13px 0px !important;
        }

        #yourDataTableId_wrapper {
            top: -27px;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button {
            background-color: #fff !important;
            color: #186ed5 !important;
            border: 1px solid #0d71e9 !important;
            font-weight: 500 !important;
            padding: 2px 10px !important;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current {
            background-color: #186ed5 !important;
            color: #fff !important;
            border: 1px solid #0d71e9 !important;
            font-weight: bold !important;
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            background: #82afe5 !important;
            color: #fff !important;
            border: 1px solid #0d71e9 !important;
        }

        #yourDataTableId {
            border-collapse: collapse;
            width: 100%;
            border-radius: 10px;
            border: 0;
            overflow: hidden;
        }

        #yourDataTableId th {
            background: #111827;
            padding: 10px 0;
            text-align: center;
        }

        #yourDataTableId td {
            padding: 8px;
            border: 1px solid #ccc !important;
            text-align: center;
        }

        .dataTables_info,
        .dataTables_paginate,
        .dataTables_length {
            padding-top: 20px !important;
            padding-bottom: 20px !important;
        }

        .dataTables_wrapper .dataTables_filter {
            padding: 20px 0 !important;
            position: relative !important;
        }

        #yourDataTableId_filter label {
            color: #000 !important;
            display: flex !important;
            margin: auto;
            justify-content: center;
            place-items: center;
        }

        #yourDataTableId_filter input {
            height: 30px !important;
            width: 150px !important;
            border: 1px solid #b1b1b1 !important;
            border-radius: 10px !important;
            box-shadow: inset 0px 0px 7px -2px #716d6d !important;
            padding: 10px !important;
        }

        .dataTables_length select {
            border: 1px solid #efefef !important;
        }

        .test[data-title] {
            position: relative;
        }

        /* Tooltip text */
        .test[data-title]::after {
            content: attr(data-title);
            position: absolute;
            transform: translateX(-50%);
            background-color: black;
            color: white;
            padding: 5px;
            border-radius: 3px;
            white-space: nowrap;
            opacity: 0;
            transition: opacity 0.3s;
            z-index: 1;
        }

        /* Tooltip display on hover */
        .test[data-title]:hover::after {
            opacity: 1;
        }

        textarea {
            text-decoration: none;
        }

        .login {
            border-color: #1345ac !important;
            box-shadow: none;
            background-color: #1345AB !important;
            position: relative;
        }

        .modal-header {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: start;
            align-items: flex-start;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: 1rem 1rem;
            border-bottom: 1px solid #dee2e6;
            border-top-left-radius: calc(.3rem - 1px);
            border-top-right-radius: calc(.3rem - 1px);
            background-color: #4573d1;
        }

        .modalabel {
            font-size: 14px;
            line-height: 28px;
            font-weight: bold;
            color: #1345ac;
        }


        .green {
            padding: 10px;
            background: green;
            color: #fff;
            border-radius: 7px;
        }

        .red {
            padding: 10px;
            background: red;
            color: #fff;
            border-radius: 7px;

        }

        .full {
            width: auto;
            height: auto;
            border-radius: 6px;
            overflow: auto;
        }

        summary {
            height: 50px;
        }

        .number {
            background-color: #ccc;
            position: relative;
            z-index: 1;
            color: #0069d9;
            border: 2px solid;
            border-radius: 20px;
            padding: 7px 13px;
        }

        .open_div {
            padding: 20px 10px;
            display: none;
            color: #000000;
            font-size: 16px;
            background-color: #f8f8f8;
            margin-top: 20px;
            border-radius: 6px;
            box-shadow: 3px 3px 4px -4px;
        }

        #sentence_1 {
            font-weight: 600;
            cursor: pointer;
        }

        .open_div span {
            font-size: 14px;
            font-weight: 500;
        }

        .mail {
            background: lightgreen;
            padding: 10px 15px;
            border: none;
            border-radius: 6px;
            color: #000;
        }

        .remove {
            background: lightgrey;
            padding: 10px 15px;
            border: none;
            border-radius: 6px;
            color: #000;
        }

        .actiondone11 {
            background: #0069d9;
            padding: 10px 15px;
            border: none;
            border-radius: 6px;
            color: #fff;
        }

        .modal-dialog {
            max-width: 500px;
            position: relative;
            left: 0;
        }

        .modal-body {
            z-index: 11;
        }

        .modal-content {
            /* box-shadow: 0px 0px 10px -2px #000 !important; */
            border-radius: 10px 10px 0 0 !important;
            border: none !important;
        }

        #payment_div,
        #send_mail,
        #request_div {
            padding: 20px;
            background-color: #ffffff00;
            position: relative;
            height: 100%;
            top: 0;
            width: 0%;
            position: absolute;
            left: 50%;
            display: none;
        }

        .email_send_divv {
            padding: 20px;
            background-color: #ffffff00;
            position: relative;
            height: 100%;
            top: 0;
            width: 0%;
            position: absolute;
            left: 50%;
            display: none;
        }

        .fsa-option {
    display: flex;
    align-items: flex-start;
    max-width: 800px;
    margin-bottom: 1rem;
    gap: 10px;
}

.fsa-icon {
    flex-shrink: 0;
    margin-top: 4px;
    display: flex;
    align-items: center;
}

.fsa-checkbox {
    margin: 0;
}

.tick-icon {
    width: 20px;
    height: 20px;
    fill: green; /* or white if you're using colored backgrounds */
}

.fsa-label-text {
    line-height: 1.5;
    word-break: break-word;
    white-space: normal;
}
/* 
        .fsa-option {
    display: flex;
    align-items: flex-start;
    max-width: 800px;
    margin-bottom: 1rem;
}

.fsa-checkbox {
    margin-top: 4px; /* aligns checkbox to the top of the text
    flex-shrink: 0;
}

.fsa-label-text {
    display: inline-block;
    line-height: 1.4;
}
.fsa-label-text {
    word-break: break-word; 
    white-space: normal;
}
*/

            u {
                text-decoration: underline !important;
            }
            s {
                text-decoration: line-through !important;
            }
            .ql-size-medium-large {
                font-size: 16px; 
            }
            .ql-size-large{
                font-size: 20px; 
            }
            .ql-size-normal {
                font-size: 14px;
            }
            .ql-size-huge {
                font-size: 32px;
            }
            .ql-font-monospace {
                font-family: "Courier New", Courier, monospace !important;
            }
            .ql-font-serif {
                font-family: Georgia, "Times New Roman", serif !important;
            }
            .ql-tooltip{
                left: 10px !important;
            }
            .btn-outline-secondary.focus, .btn-outline-secondary:focus{
                box-shadow: none !important;
            }
            .btn-outline-secondary:hover{
                background: none !important;
                border-color: none !important;
            }
    </style>



        <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> -->
        <!-- <script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script> -->
        <!-- <script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script> -->

        <!-- Include Bootstrap CSS and JS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
        <!-- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> -->
        <!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.min.js"></script> -->
        <!-- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> -->
        <!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> -->
        <!-- jQuery library -->
        <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> -->

        <!-- jQuery UI library -->
        <!-- <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/themes/smoothness/jquery-ui.css"> -->
        <!-- <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script> -->
        <!-- <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.7/css/jquery.dataTables.min.css"> -->
        <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js">
        </script>
    <script>
        $.noConflict();
        jQuery(document).ready(function($) {
            // $('#yourDataTableId').DataTable({
            //     "pageLength": 10,
            //     "stripeClasses": []
            // });
            $('#yourDataTableId').DataTable({
        "columnDefs": [
            { "orderable": false, "targets": 0 }
        ],
        "order": [[3, 'desc']] 
    });
        });
    </script>

        <!-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> -->

        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
        <!-- <script src="https://cdn.ckeditor.com/4.22.1/full/ckeditor.js"></script> -->

        <!-- <script src="{{ asset('ckeditor4/ckeditor.js') }}"></script>
        {{-- <script src="{{ asset('ckeditor4/samples/js/sample.js') }}"></script> --}} -->



        <link href="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.snow.css" rel="stylesheet" />

        <script src="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.js"></script>

    <script>
        var analysisData = null;
        var analysisData1 = null;
        var analysisData2 = null;

        function toggleDiv() {
            close_mail();
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.request_conf').hide();
            $('.approve_sale').hide();
            $('#div1').toggle();
            // $('#div2').hide();
            // $('#div3').hide();
            // $('#div5').hide();
            // $('#div4').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv2() {
            close_mail();
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            $('#div2').toggle();
            // $('#div1').hide();
            // $('#div5').hide();
            // $('#div3').hide();
            // $('#div4').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv222() {
            close_mail();
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            $('#div22').toggle();
            // $('#div1').hide();
            // $('#div5').hide();
            // $('#div3').hide();
            // $('#div4').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv6() {
            close_mail();
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            //  $('#div6').css('display', 'grid');
            $('#div6').toggle();


            // $('#div1').hide();
            // $('#div2').hide();
            // $('#div3').hide();
            // $('#div5').hide();
            // $('#div4').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv3() {
            close_mail();
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            $('#div3').toggle();
            // $('#div1').hide();
            // $('#div2').hide();
            // $('#div5').hide();
            // $('#div4').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv4() {

            close_mail();
            $('#div4').toggle();
            // $('#div1').hide();
            // $('#div2').hide();
            // $('#div3').hide();
            // $('#div5').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('.request_conf').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }

        function toggleDiv5() {
            close_mail();
            $('#div5').toggle();
            $('#div5').css('width', '100%');

            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            $('#unlink_mail').css('display', 'none');
            // $('#div5').css('display', 'grid');
            // $('#div5').toggle(); 
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-pay-pupop').hide();
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();
        }


        function toggleDiv44() {
            close_mail();
            $('.modal-dialog').css('left', '0%');
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            //  $('#div4text').text('Admin Action Needed');
            $('#yes_txt').css('display', 'none');
            $('#click_yes').css('display', 'block');

            $('.half').css('background', '#ccc');

            $('#half').css('color', '#000');
            $('#div4').show();
            // $('#div1').hide();
            // $('#div2').hide();
            // $('#div3').hide();
            // $('#div5').hide();
            // $('#div6').hide();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            // $('.ass-crt-suf-popup').hide();

        }

        function toggleDiv444() {
            close_mail();
            $('.modal-dialog').css('left', '0%');
            $('.all_releases').hide();
            $('.primium_release').hide();
            $('.approve_sale').hide();
            $('.request_conf').hide();
            // $('#div4text').text('Admin Action Needed');
            // $('#remove_txt').css('display', 'none');
            // $('#remove_txt').css('display', 'none');
            // $('#click_remove').css('display', 'block');

            $('.half').css('background', '#ccc');

            $('#half').css('color', '#000');
            $('#div4').show();
            // $('#div1').show();
            // $('#div2').show();
            // $('#div3').show();
            // $('#div5').show();
            // $('#div6').show();
            $('#request_div').hide();
            $('#send_mail').hide();
            $('#payment_div').hide();
            $('.svg').hide();
            $('.svg2').hide();
            $('.svg3').hide();
            $('.modal-dialog').css('max-width', '500px');
            $('.sou-yt-pupop').hide();
            $('.sou-yt-pupoop').hide();
            $('.sou-yt-pupopp').hide();
            $('.sou-pay-pupop').hide();
            $('#unlink_mail').css('display', 'none');
            $('.ass-crt-suf-popup').hide();

        }


        function fsasubtaskcreate() {
            const selectedValue = $('input[name="fsa-status"]:checked').val();
        $.ajax({
            type: 'POST',
            url: 'https://smarthub.rn-test.com/fsasubtaskcreate',
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            data: {
                formid: $('#formid').val(),
                name: 'payment',
                radiobutton: selectedValue,
            },
            success: function(result) {

                console.log('result', result);
               if(selectedValue != 2){
                $('.verfiyfsaa').css({
                        'cursor': 'pointer',
                        'pointer-events': 'auto'
                    });

                }
                $('.div22pending').css('display', 'none');
                $('.div22done').css('display', 'block');
                $('#div22text').text('Completed');
                $('#number2div').css('background', '#0069d9');
                $('#div2number').css('color', '#fff');
                $('#alerttext').css('display', 'none');                    
            //    $('#updatedone').css('display', 'none');

                $('#showbuttonnn').css('display', 'block');
                $('#hidebuttonnn').css('display', 'none');
                $('#slackbuttonnn').css('display', 'block');

                // const fsaValue = matchingEntry.fsaverfify.toString();

                $('label.fsa-option').each(function () {
                const $label = $(this);
                const $iconSpan = $label.find('.fsa-icon');
                const $checkbox = $iconSpan.find('input[name="fsa-status"]');
                
                const inputValue = $checkbox.val();

                // Remove any existing tick icon inside label
                $label.find('.tick-icon').remove();

            

                if (inputValue === selectedValue) {
                    // Remove checkbox for selected option
                    $checkbox.remove();

                    // Add tick icon after the icon span content
                    const tickIcon = `
                        <svg class="tick-icon" style="margin-left: 5px; height: 18px; width: 18px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                            <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                        </svg>`;
                    $iconSpan.append(tickIcon);
                } else {
                    console.log('serbvkervhser', $checkbox.length)
                    // if ($checkbox.length != 0) {
                    const restoredCheckbox = $(`<input type="checkbox" name="fsa-status" value="${inputValue}" class="fsa-checkbox" onclick="onlyOne(this)">`);
                    
                    restoredCheckbox.prop('disabled', false);
                    restoredCheckbox[0].style.setProperty('display', 'inline-block', 'important');
                    restoredCheckbox.css('visibility', 'visible');

                    $iconSpan.empty().append(restoredCheckbox);

                    // Debug logs:
                    console.log('Restored checkbox:', restoredCheckbox[0]);
                    console.log('Is visible?', restoredCheckbox.is(':visible'));
                    console.log('Parent styles:', $iconSpan.parent().attr('style'));
                // }


                }
            });

            // Hide all success messages
            $('.success-message1, .success-message2, .success-message22').hide();

            // Show relevant success messages based on selected value
            if (selectedValue === '1') {
                $('.success-message1').css('display', 'inline-flex');
            } else if (selectedValue === '2') {
                $('.success-message2').css('display', 'inline-flex');
                $('.success-message22').css('display', 'block');
            }
            const updateButton = document.getElementById('updatedone');

updateButton.innerHTML = `
<span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
    Update
</span>
`;


                $('.div22done').show();
                $('.div22pending').hide();

                // $('#div6sub').css('width', '50%');
                // $('.modal-dialog').css('left', '-10%');
                // $('.modal-dialog').css('max-width', '70%');
                // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                // $('.ass-crt-suf-popup1').show();

                // setTimeout(function() {
                //     $('#div6sub').css('width', '100%');
                //     $('.modal-dialog').css('max-width', '500px');
                //     $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                //     $('.ass-crt-suf-popup1').hide();
                // }, 2000);

            }
        })
}

        function subtask_create() {

            $.ajax({
                type: 'POST',
                url: 'https://smarthub.rn-test.com/subtaskcreate1',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    formid: $('#formid').val(),
                },
                success: function(result) {
                    $('#gid1').text(result.gid);
                    console.log('result', result);
                    var analysisData = null;
                    var id = $('#formid').val();
                    var matchingEntry = analysisData.find(function(item) {


                        return item.form_id === parseInt(id);
                    });

                    if (matchingEntry.verify_soundlink == 1) {
                        $('#div5text').text('Admin Action Completed');
                        $('.div5pending').css('display', 'none');
                        $('.div5done').css('display', 'block');
                    } else {
                        $('#div5text').text('Admin Action needed');
                        $('.div5pending').css('display', 'block');
                        $('.div5done').css('display', 'none');
                    }

                    $('#btnsief').css('display', 'none');
                    $('#chanel_link1').css('display', 'none');
                    $('#chanel_link2').css('display', 'block');
                    $('#show').css('display', 'block');
                    $('#show1').css('display', 'block');
                    $('#show2').css('display', 'block');
                    $('#show4').css('display', 'block');
                    $('.sub-tk-msg').css('display', 'block');
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('.ass-crt-suf-popup').show();

                    setTimeout(function() {
                        $('.modal-dialog').css('max-width', '500px');
                        $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        $('.ass-crt-suf-popup').hide();
                    }, 2000);

                }
            })




        }

        function subtask_create1() {

            $.ajax({
                type: 'POST',
                url: 'https://smarthub.rn-test.com/subtaskcreate2',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    formid: $('#formid').val(),
                    name: 'payment',
                },
                success: function(result) {

                    console.log('result', result);

                    $('#gid2').text(result.gid);
                    $('#div6text').text('Completed');
                    $('.div6pending').css('display', 'none');
                    $('.div6done').css('display', 'block');
                    $('#taskdone').css('display', 'block');
                    $('#taskhide').css('display', 'none');
                    $('#btnsief1').css('display', 'none');
                    $('#showbutton').css('display', 'block');
                    $('#hidebutton').css('display', 'none');
                    $('#linkbutton').css('display', 'block');
                    $('#show5').css('display', 'block');

                    $('#div6sub').css('width', '50%');
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('.ass-crt-suf-popup1').show();

                    setTimeout(function() {
                        $('#div6sub').css('width', '100%');
                        $('.modal-dialog').css('max-width', '500px');
                        $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        $('.ass-crt-suf-popup1').hide();
                    }, 2000);

                }
            })




        }

        function capitalize(str) {
            return str
                .toLowerCase()
                .split(' ')
                .map(word => word.charAt(0).toUpperCase() + word.slice(1))
                .join(' ');
        }

        function comment_post1() {

            var cmts = document.getElementById('texst_value1').value;
            var gid = $('#gid2').text();

            $.ajax({
                type: 'POST',
                url: 'https://smarthub.rn-test.com/postcomments1',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    cmts: cmts,
                    subtaskid: gid
                },
                success: function(result) {

                    $('#texst_value1').val('');

                    $('#data-container1').empty();
                    let html = '';
                    $('#data-container1').html(html);
                    let comments = result.comments.data; // Access the comments array

                    $.each(comments, function(index, value) {
                        // Get the first two letters of the name
                        let firstTwoLetters = value.created_by.name.substring(0, 2);

                        // Calculate time difference
                        let timestamp = new Date(value.created_at);
                        let currentDate = new Date();
                        let diff = Math.floor((currentDate - timestamp) /
                            1000); // Difference in seconds

                        let days = Math.floor(diff / (60 * 60 * 24));
                        diff -= days * (60 * 60 * 24);

                        let hours = Math.floor(diff / (60 * 60));
                        diff -= hours * (60 * 60);

                        let minutes = Math.floor(diff / 60);
                        let htmlTime = '';

                        if (days > 0) {
                            htmlTime = `${days} Days`;
                        } else if (hours > 0) {
                            htmlTime = `${hours} Hours`;
                        } else if (minutes > 0) {
                            htmlTime = `${minutes} Minutes`;
                        } else {
                            htmlTime = 'Less than a minute ago';
                        }

                        html += `
                        <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                            <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                            <div class="col-span-9 text-start">
                                <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                            </div>
                        </div>
                        `;

                        // Build HTML string
                        //                         html += `
                    // <div style="width:100%; display: flex; align-items: center; gap: 1rem; margin: 12px 0;">
                    // <div style="height:3.5rem; width:3.5rem; background-color:#ffab40; border-radius:50%; display: flex; justify-content: center; align-items: center;">
                    //     ${firstTwoLetters}
                    // </div>
                    // <div style="width: 86%;">
                    //     <div style="display: flex; gap: 1rem;">
                    //         <span>${value.created_by.name}</span>
                    //         <span style="color:#b4b4b4;">${htmlTime}</span>
                    //     </div>
                    //     <div style="margin-top: 5px;">${value.text}</div>
                    // </div>
                    // </div>
                    // `;
                    });

                    // Insert the HTML into the container
                    $('#data-container1').html(html);
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#last').css('display', 'block');


                }
            })

        }

        function comment_post() {

            var cmts = document.getElementById('texst_value').value;
            var gid = $('#gid1').text();

            $.ajax({
                type: 'POST',
                url: 'https://smarthub.rn-test.com/postcomments1',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    cmts: cmts,
                    subtaskid: gid
                },
                success: function(result) {

                    $('#texst_value').val('');

                    $('#data-container').empty();
                    let html = '';
                    $('#data-container').html(html);
                    let comments = result.comments.data; // Access the comments array

                    $.each(comments, function(index, value) {
                        // Get the first two letters of the name
                        let firstTwoLetters = value.created_by.name.substring(0, 2);

                        // Calculate time difference
                        let timestamp = new Date(value.created_at);
                        let currentDate = new Date();
                        let diff = Math.floor((currentDate - timestamp) /
                            1000); // Difference in seconds

                        let days = Math.floor(diff / (60 * 60 * 24));
                        diff -= days * (60 * 60 * 24);

                        let hours = Math.floor(diff / (60 * 60));
                        diff -= hours * (60 * 60);

                        let minutes = Math.floor(diff / 60);
                        let htmlTime = '';

                        if (days > 0) {
                            htmlTime = `${days} Days`;
                        } else if (hours > 0) {
                            htmlTime = `${hours} Hours`;
                        } else if (minutes > 0) {
                            htmlTime = `${minutes} Minutes`;
                        } else {
                            htmlTime = 'Less than a minute ago';
                        }

                        // Build HTML string
                        //                     html += `
                    //     <div style="width:100%; display: flex; align-items: center; gap: 1rem; margin: 12px 0;">
                    //         <div style="height:3.5rem; width:3.5rem; background-color:#ffab40; border-radius:50%; display: flex; justify-content: center; align-items: center;">
                    //             ${firstTwoLetters}
                    //         </div>
                    //         <div style="width: 86%;">
                    //             <div style="display: flex; gap: 1rem;">
                    //                 <span>${value.created_by.name}</span>
                    //                 <span style="color:#b4b4b4;">${htmlTime}</span>
                    //             </div>
                    //             <div style="margin-top: 5px;">${value.text}</div>
                    //         </div>
                    //     </div>
                    // `;
                        html += `
                        <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                            <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                            <div class="col-span-9 text-start">
                                <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                            </div>
                        </div>
                        `;
                    });

                    // Insert the HTML into the container
                    $('#data-container').html(html);
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#first').css('display', 'block');
                    $('#show2').css('display', 'none');
                    $('#show3').css('display', 'block');
                    $('#show4').css('display', 'block');
                }
            })

        }


        function request15() {
            $('.modal-dialog').css('left', '0%');
            $('#div5').css('grid-template-columns', '1fr auto');
            $('#div6').css('grid-template-columns', '1fr auto');

            $('#div22_div').css('width', '100%');

            $('#div6').css('width', '100%');
            $('#div6_div').css('width', '100%');

            $('#first').css('display', 'none');
            $('#show3').css('display', 'none');
            $('#show2').css('display', 'block');
            $('#show4').css('display', 'block');
            $('#last').css('display', 'none');
            // $('#hidebutton').css('display', 'none');
            // $('#showbutton').css('display', 'none');
            // $('#linkbutton').css('display', 'none');
            // if ($('#first').css('display') === 'block') {
            //         $('.modal-dialog').css('max-width', '70%');
            //     } else {
            //         $('.modal-dialog').css('max-width', '500px');
            //     } 

            // if ($('#last').css('display') === 'block') {
            //         $('.modal-dialog').css('max-width', '70%');
            //     } else {
            //         $('.modal-dialog').css('max-width', '500px');
            //     } 
            if ($('#first').css('display') === 'block' || $('#last').css('display') === 'block') {
                $('.modal-dialog').css('max-width', '70%');
            } else {
                $('.modal-dialog').css('max-width', '500px');
            }
            // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
        }

        function request155() {
            $('.modal-dialog').css('left', '0%');
            $('#div5').css('grid-template-columns', '1fr auto');
            $('#div6').css('grid-template-columns', '1fr auto');

            $('#div22_div').css('width', '100%');
            
            $('#div6').css('width', '100%');
            $('#div6_div').css('width', '100%');

            $('#first').css('display', 'none');
            $('#showbuttonn').css('display', 'block');
            $('#hidebuttonn').css('display', 'none');
            // $('#show4').css('display', 'block');
            $('#last').css('display', 'none');

            if ($('#first').css('display') === 'block' || $('#last').css('display') === 'block') {
                $('.modal-dialog').css('max-width', '70%');
            } else {
                $('.modal-dialog').css('max-width', '500px');
            }
        }

        function request16() {
            $('.modal-dialog').css('left', '0%');
            $('#div6').css('grid-template-columns', '1fr auto');
            $('#div6').css('width', '100%');
            $('#div6_div').css('width', '100%');

            $('#div22_div').css('width', '100%');


            $('#last').css('display', 'none');
            $('#hidebutton').css('display', 'none');
            $('#showbutton').css('display', 'block');
            $('#linkbutton').css('display', 'block');
            //   $('.modal-dialog').css('max-width', '500px');

            if ($('#first').css('display') === 'block' || $('#last').css('display') === 'block') {
                $('.modal-dialog').css('max-width', '70%');
            } else {
                $('.modal-dialog').css('max-width', '500px');
            }


            // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
        }

        let buttonnn = 1;

        function request55() {
            buttonnn = 0;
            request5()
        }
        function request555() {
            buttonnn = 1;
            request5()
        }

        function request5() {

            var buttton = buttonnn;

            let statuss;
            if (buttton == '0') {
                statuss = 'soundcloud';
            } else {
                statuss = 'subtaskid';
            }

            $.ajax({
                type: 'GET',
                url: 'https://smarthub.rn-test.com/getcomments1',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    gid: $('#gid1').text(),
                    // form_ids: $('#formid').val(),
                    sgid: $('#gid3').text(),
                    status: statuss,
                },
                success: function(result) {
                    console.log(result);
                    $('#data-container').empty();
                    let html = '';
                    $('#data-container').html(html);
                    $('#status').html('<b>Status:</b><span>' + result.status + '</span>');
                    let comments = result.comments.data; // Access the comments array

                    $.each(comments, function(index, value) {
                        // Get the first two letters of the name
                        let firstTwoLetters = value.created_by.name.substring(0, 2);

                        // Calculate time difference
                        let timestamp = new Date(value.created_at);
                        let currentDate = new Date();
                        let diff = Math.floor((currentDate - timestamp) /
                            1000); // Difference in seconds

                        let days = Math.floor(diff / (60 * 60 * 24));
                        diff -= days * (60 * 60 * 24);

                        let hours = Math.floor(diff / (60 * 60));
                        diff -= hours * (60 * 60);

                        let minutes = Math.floor(diff / 60);
                        let htmlTime = '';

                        if (days > 0) {
                            htmlTime = `${days} Days`;
                        } else if (hours > 0) {
                            htmlTime = `${hours} Hours`;
                        } else if (minutes > 0) {
                            htmlTime = `${minutes} Minutes`;
                        } else {
                            htmlTime = 'Less than a minute ago';
                        }

                        // Build HTML string
                        // html += `
                    //     <div style="width:100%; display: flex; align-items: center; gap: 1rem; margin: 12px 0;">
                    //         <div style="height:3.5rem; width:3.5rem; background-color:#ffab40; border-radius:50%; display: flex; justify-content: center; align-items: center;">
                    //             ${firstTwoLetters}
                    //         </div>
                    //         <div style="width: 86%;">
                    //             <div style="display: flex; gap: 1rem;">
                    //                 <span>${value.created_by.name}</span>
                    //                 <span style="color:#b4b4b4;">${htmlTime}</span>
                    //             </div>
                    //             <div style="margin-top: 5px;">${value.text}</div>
                    //         </div>
                    //     </div>
                    // `;
                        html += `
                        <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                            <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                            <div class="col-span-9 text-start">
                                <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                            </div>
                        </div>
                        `;
                    });


                    $('#div22_div').css('width', '50%');

                    $('#div6').css('grid-template-columns', '1fr auto');
                    $('#last').css('display', 'none');
                    // $('#hidebutton').css('display', 'none');
                    // $('#showbutton').css('display', 'block');
                    // $('#linkbutton').css('display', 'block');
                    $('#div6_div').css('width', '50%');

                    if ($('#div6').css('width') === '50%') {
                        $('#div6').css('width', '50%');
                    } else {
                        $('#div6').css('width', '100%');
                    }

                    // Insert the HTML into the container
                    $('#data-container').html(html);
                    $('#div5').css('grid-template-columns', '1fr 1fr');
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#first').css('display', 'block');
                    if(statuss == 'subtaskid'){
                        $('#show2').css('display', 'none');
                        $('#show3').css('display', 'block');
                        $('#show4').css('display', 'block');
                    }else{
                        $('#showbuttonn').css('display', 'none');
                        $('#hidebuttonn').css('display', 'block');
                        // $('#show4').css('display', 'block');
                    }
                }
            })

        }

        function request6() {
            $.ajax({
                type: 'GET',
                url: 'https://smarthub.rn-test.com/getcomments2',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    gid: $('#gid2').text(),
                },
                success: function(result) {
                    console.log(result);
                    $('#data-container1').empty();
                    let html = '';
                    $('#data-container1').html(html);
                    let comments = result.comments.data; // Access the comments array
                    $('#status1').html('<b>Status:</b><span>' + result.status + '</span>');
                    document.getElementById('status1').innerHTML = '<b>Status:</b><span>' + result.status +
                        '</span>';

                    if (result.status1 == 'Completed') {
                        $('.half7').css('background', '#0069d9');
                        $('#half7').css('color', '#fff');
                    }
                    $.each(comments, function(index, value) {
                        // Get the first two letters of the name
                        let firstTwoLetters = value.created_by.name.substring(0, 2);

                        // Calculate time difference
                        let timestamp = new Date(value.created_at);
                        let currentDate = new Date();
                        let diff = Math.floor((currentDate - timestamp) /
                            1000); // Difference in seconds

                        let days = Math.floor(diff / (60 * 60 * 24));
                        diff -= days * (60 * 60 * 24);

                        let hours = Math.floor(diff / (60 * 60));
                        diff -= hours * (60 * 60);

                        let minutes = Math.floor(diff / 60);
                        let htmlTime = '';

                        if (days > 0) {
                            htmlTime = `${days} Days`;
                        } else if (hours > 0) {
                            htmlTime = `${hours} Hours`;
                        } else if (minutes > 0) {
                            htmlTime = `${minutes} Minutes`;
                        } else {
                            htmlTime = 'Less than a minute ago';
                        }

                        // Build HTML string
                        //                     html += `
                    //     <div style="width:100%; display: flex; align-items: center; gap: 1rem; margin: 12px 0;">
                    //         <div style="height:3.5rem; width:3.5rem; background-color:#ffab40; border-radius:50%; display: flex; justify-content: center; align-items: center;">
                    //             ${firstTwoLetters}
                    //         </div>
                    //         <div style="width: 86%;">
                    //             <div style="display: flex; gap: 1rem;">
                    //                 <span>${value.created_by.name}</span>
                    //                 <span style="color:#b4b4b4;">${htmlTime}</span>
                    //             </div>
                    //             <div style="margin-top: 5px;">${value.text}</div>
                    //         </div>
                    //     </div>
                    // `;
                        html += `
                        <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                            <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                            <div class="col-span-9 text-start">
                                <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                            </div>
                        </div>
                        `;
                    });

                    $('#div6').css('grid-template-columns', '1fr 1fr');
                    $('#div6').css('width', '100%');
                    $('#div6_div').css('width', '100%');

                    $('#div22_div').css('width', '50%');

                    // Insert the HTML into the container
                    $('#data-container1').html(html);
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#last').css('display', 'block');
                    $('#hidebutton').css('display', 'block');
                    $('#showbutton').css('display', 'none');
                    $('#linkbutton').css('display', 'block');
                }
            })

        }


        function request45() {

            $.ajax({
                type: 'GET',
                url: 'https://smarthub.rn-test.com/getcomments3',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    gid: $('#gid4').text(),
                },
                success: function(result) {
                    console.log(result);
                    $('#data-containerr').empty();
                    let html = '';
                    $('#data-containerr').html(html);
                    let comments = result.comments.data; // Access the comments array
                    $.each(comments, function(index, value) {
                        // Get the first two letters of the name
                        let firstTwoLetters = value.created_by.name.substring(0, 2);

                        // Calculate time difference
                        let timestamp = new Date(value.created_at);
                        let currentDate = new Date();
                        let diff = Math.floor((currentDate - timestamp) /
                            1000); // Difference in seconds

                        let days = Math.floor(diff / (60 * 60 * 24));
                        diff -= days * (60 * 60 * 24);

                        let hours = Math.floor(diff / (60 * 60));
                        diff -= hours * (60 * 60);

                        let minutes = Math.floor(diff / 60);
                        let htmlTime = '';

                        if (days > 0) {
                            htmlTime = `${days} Days`;
                        } else if (hours > 0) {
                            htmlTime = `${hours} Hours`;
                        } else if (minutes > 0) {
                            htmlTime = `${minutes} Minutes`;
                        } else {
                            htmlTime = 'Less than a minute ago';
                        }

                        html += `
                        <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                            <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                            <div class="col-span-9 text-start">
                                <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                            </div>
                        </div>
                        `;
                    });

                    $('#div22').css('grid-template-columns', '1fr 1fr');
                    $('#div22').css('width', '100%');
                    $('#div22').css('gap', '10px');
                    $('#div6').css('width', '50%');
                    $('#div5').css('width', '46%');
                    // $('#div6_div').css('width', '100%');

                    $('#div22_div').css('width', '100%');

                    // Insert the HTML into the container
                    $('#data-containerr').html(html);
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#firstt').css('display', 'block');
                    $('#hidebuttonnn').css('display', 'block');
                    $('#showbuttonnn').css('display', 'none');
                    $('#slackbuttonnn').css('display', 'block');
                }
            })

        }

        function request445() {
                    $('#div22').css('grid-template-columns', '1fr auto');
                    $('#div22').css('width', '100%');
                    $('#div22_div').css('width', '100%');
                    $('.modal-dialog').css('max-width', '500px');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('.modal-dialog').css('left', '0%');
                    $('#firstt').css('display', 'none');
                    $('#div6').css('width', '100%');
                    $('#div5').css('width', '98%');
                    $('#hidebuttonnn').css('display', 'none');
                    $('#showbuttonnn').css('display', 'block');
                    $('#slackbuttonnn').css('display', 'block');
        }


        function payment() {
            $('.modal-dialog').css('left', '-10%');
            $('.modal-dialog').css('max-width', '70%');
            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
            // $('#payment_div').css('width', '50%');
            // $('#payment_div').css('transition', 'width 0.4s ease');
            // $('#payment_div').css('display', 'block');
            // $('.svg3').css('display', 'block');
            $('.sou-pay-pupop').css('display', 'block');
        }




        function close_mail() {
            $('.approve_sale').hide();
            $('.request_conf').hide();
            $('.all_releases').hide();
            $('.primium_release').hide();

            $('#div444').css('width', '100%');
            $('#div5').css('width', '98%');
            $('#div6').css('width', '100%');

            $('#div22_div').css('width', '100%');

            $('.modal-dialog').css('max-width', '500px');
            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
            $('.modal-dialog').css('left', '0%');

            $('#request_div').css('width', '0');
            $('#request_div').css('transition', 'width 0.4s ease');
            $('#request_div').css('display', 'none');

            $('#send_mail').css('width', '0');
            $('#send_mail').css('transition', 'width 0.4s ease');
            $('#send_mail').css('display', 'none');

            $('#payment_div').css('width', '0');
            $('#payment_div').css('transition', 'width 0.4s ease');
            $('#payment_div').css('display', 'none');

            $('#email_send_div').css('display', 'none');

            $('.svg').css('display', 'none');
            $('.svg2').css('display', 'none');
            $('.svg3').css('display', 'none');
            $('#unlink_mail').css('display', 'none');

        }

        function requestconf() {
            var formId = $('#formid').val();
            var details = {!! json_encode($data) !!};
            var fsacheckk = $('#fsacheckkk').val();

            if (!formId || !details || !Array.isArray(details)) {
                console.error('Missing formId or details data.');
                return;
            }

            var item = details.find(function(item) {
                return item.form_id == formId;
            });


            console.log('Matched item:', item);

            $('#div22_div, #div5').css('width', '48%');
            $('#div6').css('width', '50%');

            $('.request_conf').css({
                'left': '62%',
                'opacity': '1',
                'z-index': '1',
                'transition': 'left 1s, opacity 2s',
                'display': 'block'
            });

            $('.modal-dialog').css({
                'left': '-10%',
                'max-width': '70%',
                'transition': 'max-width 0.4s ease'
            });

            if (fsacheckk === 'No') {
                $('.request_conf').css('top', '36%');
            } else {
                $('.request_conf').css('top', '51%');
            }
        }


        function fsaverify() {

            const selectedValue = $('input[name="fsa-status"]:checked').val();
            const button = document.getElementById('updatedone');
            const buttonText = button.textContent.trim();

            if (!selectedValue) {
                // alert('Please select an option.');
                return;
            }
            if (buttonText.includes("Create")) {
                fsasubtaskcreate();
                return;
            }

            $.ajax({
                type: 'post',
                data: {
                    formid: $('#formid').val(),
                    radiobutton: selectedValue
                },
                url: 'https://smarthub.rn-test.com/fsaverify',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },

                success: function(result) {
                    console.log('Response:', result);
                        $('.verfiyfsaa').css({
                            'cursor': 'pointer',
                            'pointer-events': 'auto'
                        });
                    $('.div22pending').css('display', 'none');
                    $('.div22done').css('display', 'block');
                    $('#div22text').text('Completed');
                    $('#number2div').css('background', '#0069d9');
                    $('#div2number').css('color', '#fff');
                    $('#alerttext').css('display', 'none');                    
                   
                   // $('#updatedone').css('display', 'none');
                    $('#showbuttonnn').css('display', 'none');
                    $('#hidebuttonnn').css('display', 'none');
                    $('#slackbuttonnn').css('display', 'none');
                    $('#fraud_list').text(result.data33);
                    
                // const fsaValue = matchingEntry.fsaverfify.toString();
                const selectedValue = $('input[name="fsa-status"]:checked').val();

$('label.fsa-option').each(function () {
    const $label = $(this);
    const $iconSpan = $label.find('.fsa-icon');
    const $checkbox = $iconSpan.find('input[name="fsa-status"]');
    
    const inputValue = $checkbox.val();

    // Remove any existing tick icon inside label
    $label.find('.tick-icon').remove();

 

    if (inputValue === selectedValue) {
        // Remove checkbox for selected option
        $checkbox.remove();

        // Add tick icon after the icon span content
        const tickIcon = `
            <svg class="tick-icon" style="margin-left: 5px; height: 18px; width: 18px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                    d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
            </svg>`;
        $iconSpan.append(tickIcon);
    } else {
        console.log('serbvkervhser', $checkbox.length)
        // if ($checkbox.length != 0) {
        const restoredCheckbox = $(`<input type="checkbox" name="fsa-status" value="${inputValue}" class="fsa-checkbox" onclick="onlyOne(this)">`);
        
        restoredCheckbox.prop('disabled', false);
        restoredCheckbox[0].style.setProperty('display', 'inline-block', 'important');
        restoredCheckbox.css('visibility', 'visible');

        $iconSpan.empty().append(restoredCheckbox);

        // Debug logs:
        console.log('Restored checkbox:', restoredCheckbox[0]);
        console.log('Is visible?', restoredCheckbox.is(':visible'));
        console.log('Parent styles:', $iconSpan.parent().attr('style'));
    // }


    }
});

// Hide all success messages
$('.success-message1, .success-message2, .success-message22').hide();

// Show relevant success messages based on selected value
if (selectedValue === '1') {
    $('.success-message1').css('display', 'inline-flex');
} else if (selectedValue === '2') {
    $('.success-message2').css('display', 'inline-flex');
    $('.success-message22').css('display', 'block');
}



                $('.div22done').show();
                $('.div22pending').hide();

                }
            })
        }

        let paypalbodyEditor;

  document.addEventListener('DOMContentLoaded', function () {
    // Initialize Quill editors
    paypalbodyEditor = new Quill('#paypalbody', {
      theme: 'snow',
      modules: {
        toolbar: '#toolbar-paypalbody'
      },
      placeholder: 'Compose your message here...'
    });

    document.getElementById('toggle-source-paypal').addEventListener('click', function () {
        const isSourceMode = this.classList.contains('source-mode');
        const quillContainer = document.getElementById('paypalbody');
        const sourceTextarea = document.getElementById('paypalbody-source');
        const toolbarButtons = document.querySelectorAll('#toolbar-paypalbody button, #toolbar-paypalbody select');
        const toolbarPickers = document.querySelectorAll('#toolbar-paypalbody .ql-picker');

        if (!isSourceMode) {
            // Switch to source mode
            sourceTextarea.value = paypalbodyEditor.root.innerHTML;
            quillContainer.style.display = 'none';
            sourceTextarea.style.display = 'block';
            this.classList.add('source-mode');

            // Disable all toolbar buttons except this one
            toolbarButtons.forEach(btn => {
            if (btn !== this) {
                btn.disabled = true;
                btn.style.opacity = '0.5';
                btn.style.pointerEvents = 'none';
            }
            });

            // Disable all .ql-picker dropdowns (font, size, color, etc.)
            toolbarPickers.forEach(picker => {
            picker.classList.add('ql-disabled');
            picker.style.opacity = '0.5';
            picker.style.pointerEvents = 'none';
            });

            // Highlight the toggle button
            this.style.border = '2px solid #1355AC';
            this.style.color = '#1355AC';
            this.style.borderRadius = '5px';
        } else {
            // Switch back to editor mode
            paypalbodyEditor.clipboard.dangerouslyPasteHTML(sourceTextarea.value);
            quillContainer.style.display = 'block';
            sourceTextarea.style.display = 'none';
            this.classList.remove('source-mode');

            // Re-enable all toolbar buttons
            toolbarButtons.forEach(btn => {
            btn.disabled = false;
            btn.style.opacity = '';
            btn.style.pointerEvents = '';
            });

            // Re-enable all .ql-picker dropdowns
            toolbarPickers.forEach(picker => {
            picker.classList.remove('ql-disabled');
            picker.style.opacity = '';
            picker.style.pointerEvents = '';
            });

            // Remove toggle button highlight
            this.style.border = '';
            this.style.color = '';
            this.style.borderRadius = '';
        }
     });

  });



        function request1() {
            var formId = $('#formid').val();
            var details = {!! json_encode($data) !!};
            var fsacheckk = $('#fsacheckkk').val();
            var username = $('#usename').val();
            var details = details.find(function(item) {
                return item.form_id == formId;
            });

            $('#paypalto').text(`${details.email}`);
//             $('#paypalbody').html(`Dear ${details.username},

// If you'd like to receive the earnings on your account, you'll first need to add a payment method to your account. 

// To link up your PayPal email to your account, you'll need to log in to your RouteNote account, hover over 'Your Account' and then click 'Payment Profile'. You'll see a prompt for a One-Time passcode which will have been sent to your registered email address. 
// If you'd rather close your account without receiving your final earnings, we can proceed without the need to add a payment method to your account. 

// This is in relation to the RouteNote account with the username ${details.username} and UID ${details.userID}.

// Please confirm in your reply when you've registered these details, or if you'd like to have your account closed without receiving the earnings. If you do not respond within 30 days, we will close the account as initially requested.


// Many Warm Regards,
// The RouteNote Team
// `);

const content = [
  { insert: `Dear ${username},\n\n`, attributes: { bold: true, color: '#1355AC', font: 'arial', size: 'large' } },
  { insert: `If you'd like to receive the earnings on your account, you'll first need to add a payment method to your account.\n\n` },
  { insert: `To link up your PayPal email to your account, you'll need to log in to your RouteNote account, hover over 'Your Account' and then click 'Payment Profile'. You'll see a prompt for a One-Time passcode which will have been sent to your registered email address.\n` },
  { insert: `If you'd rather close your account without receiving your final earnings, we can proceed without the need to add a payment method to your account.\n\n` },
  { insert: `This is in relation to the RouteNote account with the username ${details.username} and UID ${details.userID}.\n\n` },
  { insert: `Please confirm in your reply when you've registered these details, or if you'd like to have your account closed without receiving the earnings. If you do not respond within 30 days, we will close the account as initially requested.\n\n\n` },
  { insert: 'Many Warm Regards,\n', attributes: { size: 'medium-large' } },
  { insert: 'The RouteNote Team', attributes: { size: 'medium-large', color: '#1355ac', italic: true, bold: true } }
];

if (paypalbodyEditor) {
    paypalbodyEditor.setContents(content);
}


            $('#div22_div').css('width', '48%');
            $('#div444').css('width', '50%');
            $('#div5').css('width', '48%');
            $('#div6').css('width', '50%');
            $('.request_conf').css('display', 'none');
            $('#Request').toggle();
            $('.modal-dialog').css('left', '-10%');
            $('.modal-dialog').css('max-width', '70%');
            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
            $('#request_div').css('width', '50%');
            $('#request_div').css('transition', 'width 0.4s ease');
            $('#request_div').css('display', 'block');
            if(fsacheckk === 'No'){
                $('#request_div').css('top', '25%');
            }else{
                $('#request_div').css('top', '45%');
            }

        }

        function send() {
            var body = paypalbodyEditor.root.innerHTML;
            $.ajax({
                type: 'post',
                data: {
                    formid: $('#formid').val(),
                    // body: $('#paypalbody').text()
                    body: encodeURIComponent(body),
                },
                url: 'https://smarthub.rn-test.com/verifypaypal',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },

                success: function(result) {
                    $('.box').css('display', 'none');
                    $('.modal-dialog').css('left', '-10%');
                    $('.modal-dialog').css('max-width', '70%');
                    $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                    $('#request_div').css('display', 'none');
                    $('#email_send_div').css('display', 'block');
                    // $('#requestt').text('Request Sent');
                    $('#addcontent').empty();
                    $('#addcontent').html(`
                    <button style="background: #0069d9;" class=" btn-secondary actiondone11 verfiyfsaa" id="requesttdone" onclick="requestconf()" >Request Sent</button>`);
                    // $('#requesttdone').css('pointer-events', 'none');
                    // $('#requesttdone').css('cursor', 'not-allowed');
                    $('#div444').css('width', '100%');
                    $('#div22_div').css('width', '100%');
                    $('.div2pending').css('display', 'none');
                    $('.div2done').css('display', 'block');
                    $('#div2text').text('Completed');
                    $('#number3div').css('background', '#0069d9');
                    $('#div3number').css('color', '#fff');
                    setTimeout(function() {
                        $('#email_send_div').css('display', 'none');
                        $('.modal-dialog').css('max-width', '500px');
                        $('.modal-dialog').css('transition', 'max-width 0.4s ease');

                        $('#request_div').css('width', '0');
                        $('#request_div').css('transition', 'width 0.4s ease');
                        $('#request_div').css('display', 'none');



                    }, 2000);
                }
            })
        }

        function send_mail() {
            $('.modal-dialog').css('left', '-10%');
            $('.modal-dialog').css('max-width', '70%');
            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
            $('#send_mail').css('width', '50%');
            $('#send_mail').css('transition', 'width 0.4s ease');
            $('#send_mail').css('display', 'block');
        }
        //     function send3() {
        //         $.ajax({
        //             type: 'GET',
        //             data: {     
        //                 formid: $('#formid').val()
        //             },
        //             url: 'https://smarthub.rn-test.com/verifyartist',
        //             headers: {
        //                 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        //             },

        //             success: function(result) {
        //         $('.box').css('display', 'none');
        //         $('.modal-dialog').css('left', '-10%');
        //         $('.modal-dialog').css('max-width', '70%');
        //         $('.modal-dialog').css('transition', 'max-width 0.4s ease');
        //         $('#send_mail').css('display', 'none');
        //         $('#email_send_div').css('display', 'block');

        //         setTimeout(function() {
        //              $('#email_send_div').css('display', 'none');
        //              $('.modal-dialog').css('max-width', '500px');
        //             $('.modal-dialog').css('transition', 'max-width 0.4s ease');

        //             $('.div3pending').css('display', 'none');
        //             $('.div3done').css('display', 'block');
        //             $('#div3text').text('Completed');
        //         }, 2000);
        //     }
        // })
        //     }


        $(document).ready(function() {


            //             $('#analysismodal').on('hidden.bs.modal', function () {
            //     $('#div1').hide();
            //     $('#div2').hide();
            //     $('#div3').hide();
            //     $('#div4').hide();
            //     $('#div5').hide();
            //     $('#div6').hide();
            //   });

            $('.toggle-confirmation').change(function() {
                // Get the checkbox element
                var checkbox = $(this);

                // Get the ID of the item from the data-id attribute
                var itemId = checkbox.data('id');

                // Get the checked status
                var isChecked = checkbox.is(':checked');

                $.ajax({
                    url: 'https://smarthub.rn-test.com/update-confirmation-email',
                    type: 'POST', // Method type
                    data: {
                        _token: '{{ csrf_token() }}', // CSRF token for security
                        id: itemId,
                        confirmation_email: isChecked ? 1 : 0 // Send 1 if checked, 0 if not
                    },
                    success: function(response) {
                        // Handle the success response
                        console.log('Status updated successfully:', response);
                    },
                    error: function(xhr) {
                        // Handle errors
                        console.error('Error updating status:', xhr.responseText);
                    }
                });
            });

            var analysisData = null;
            var analysisData1 = null;
            var analysisData2 = null;

            // console.log('analysisData', analysisData);
            //fsa-checkbox

            $('#yourDataTableId').on('click', '.analysis', function () {

            // $('.analysis').click(function() {

                var formId = $(this).data('form-id');

                $('#gid1').text('');
                $('#gid2').text('');
                $('#gid3').text('');
                $('#gid4').text('');

                // $('.fsa-checkbox').prop('checked', false);

                var matchingEntry = analysisData.find(function(item) {
                    return item.form_id === formId;
                });

                $('#formid').val(matchingEntry.form_id);

                $.ajax({
                    
                    type: 'GET',
                    // data: {
                    //     uid: matchingEntry.userID
                    // },
                    url: `https://smarthub.rn-test.com/fsacheck?uid=${matchingEntry.userID}`,
                    
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },


                // $.ajax({
                //     url: 'fsacheck',
                //     method: 'GET',
                //     data: {
                //         uid: matchingEntry.userId
                //     },
                //     dataType: 'json',
       
                    success: function(response) {
                        console.log(response);
                        // if (response.fsacheck == '1') {
                        //     var varible = '<span style="padding: 10px;">FSA USER: YES</span>';
                        // } else if (response.fsacheck == '0') { 
                        //     var varible = '<span style="padding: 10px;">FSA USER: No</span>';
                        // }
                        // else{
                        //     var varible = '<span style="padding: 10px;">FSA USER: No</span>';
                        // }
                       // var variable = `<span style="padding: 10px;">FSA USER: ${response.fsacheck}</span>`;

                       let flagImages = '';

                        if (response.flagcolors && Array.isArray(response.flagcolors) && response.flagcolors
                            .length > 0) {
                            console.log('Processing flagcolors:', response.flagcolors); // Log the flagcolors array

                            // Loop through the flagcolors
                            response.flagcolors.forEach(flagObj => {
                                const flag = flagObj.flag_color;
                                console.log('Processing flag:', flag);
                                let flagImageSrc = '';
                                let flagTitle = '';

                                // Map flag type to corresponding image and title
                                switch (flag) {
                                    case 'Approved':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Flag-Approved.png';
                                        flagTitle = 'Approved';
                                        break;
                                    case 'Blacklisted':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/flag-blacklist.png';
                                        flagTitle = 'Blacklisted';
                                        break;
                                    case 'Copyright infringeme':
                                        flagImageSrc =
                                            'https://smarthub.rn-test.com/images/Copyright_infri-removebg-preview.png';
                                        flagTitle = 'Copyright infringement';
                                        break;
                                    case 'Blocklisted':
                                        flagImageSrc =
                                        'https://routenotetest.com/rn22/themes/rnmusic/images/flag-blacklist.png';
                                        flagTitle = 'Blocklisted';
                                        break;
                                    case 'FraudStrike':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Flag-Fraud.png';
                                        flagTitle = 'FraudStrike';
                                        break;
                                    case 'fraud_streaming':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Fraud_Streaming.png';
                                        flagTitle = 'Fraud Streaming';
                                        break;
                                    case 'Suspicious':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Flag-suspicious.png';
                                        flagTitle = 'Suspicious';
                                        break;
                                    case 'Warning':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Flag-Warning.png';
                                        flagTitle = 'Warning';
                                        break;
                                    case 'Priority':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/Flag-priority.png';
                                        flagTitle = 'Priority';
                                        break;
                                    case 'star_artist':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/star_artist.png';
                                        flagTitle = 'Star artist';
                                        break;
                                    case 'yt_network_abuse':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/ytblockflag.png';
                                        flagTitle = 'YouTube Network Abuse';
                                        break;
                                    case 'xpress':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/XPressflag.png';
                                        flagTitle = 'Xpress';
                                        break;
                                    case 'support_note':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/support_note.png';
                                        flagTitle = 'Support Note';
                                        break;
                                    case 'payment':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/payment-icon.png';
                                        flagTitle = 'Payment';
                                        break;
                                    case 'Publishing Information':
                                        flagImageSrc =
                                            'https://routenotetest.com/rn22/themes/rnmusic/images/publishing.svg';
                                        flagTitle = 'Publishing Information';
                                        break;
                                    default:
                                        console.log('Unmatched flag:', flag); // Log unmatched flags
                                        break;
                                }

                        if (flagImageSrc) {
                            if (flagImageSrc == 'https://smarthub.rn-test.com/images/Copyright_infri-removebg-preview.png') {
                                flagImages += `
                                                <img class="cursor-pointer" style="height:27px;display:inline;cursor:pointer" src="${flagImageSrc}" title="${flagTitle}" alt="${flagTitle}">
                                            `;
                            }else{
                                flagImages += `
                                                <img class="cursor-pointer" style="display:inline;cursor:pointer" src="${flagImageSrc}" title="${flagTitle}" alt="${flagTitle}">
                                            `;
                            }
                        }
                            });
                        } else {
                            if (!flagImages && response.flagcolors !== '' && response.uid !== '') {
                                flagImages = `
                                            No Flags
                                            `;
                            }

                        }



                        // $('#div1').html(`

                        // <span style="padding: 10px;">USER ID: ${matchingEntry.userID}</span>
                        // <span style="padding: 10px;">USERNAME:  ${matchingEntry.username}</span>
                        // <span style="padding: 10px;">EMAIL: ${matchingEntry.email}</span>
                        // <span style="padding: 10px;">FSA USER: ${response.fsacheck}</span>
                        // <span style="padding: 10px;">Flags - ${flagImages}</span>
                        // <span style="padding: 10px;" id="totalamount"></span>
                        // `);           
                        
                        $('#usename').val(response.username);
                        $('#fsacheckkk').val(response.fsacheck);

                        if (flagImages.trim() === 'No Flags') {
                            $('#div1').html(`
                            <span style="padding: 10px;">USER ID: ${matchingEntry.userID}</span>
                            <span style="padding: 10px;">USERNAME:  ${response.username}</span>
                            <span style="padding: 10px;">EMAIL: ${matchingEntry.email}</span>
                            <span style="padding: 10px;">FSA USER: ${response.fsacheck}</span>
                            <span style="padding: 10px;">Flags - ${flagImages}</span>
                            <span style="padding: 10px;" id="totalamount"></span>
                            `);   
                        } else {

                            $('#div1').html(`

                            <span style="padding: 10px;">USER ID: ${matchingEntry.userID}</span>
                            <span style="padding: 10px;">USERNAME:  ${response.username}</span>
                            <span style="padding: 10px;">EMAIL: ${matchingEntry.email}</span>
                            <span style="padding: 10px;">FSA USER: ${response.fsacheck}</span>
                            <span style="padding: 10px;">Flags - <a href="https://www.rnadmin.com/flags/${matchingEntry.userID}">${flagImages}</a></span>
                            <span style="padding: 10px;" id="totalamount"></span>
                            `);   
                
                        }
                        

                // if (matchingEntry.fsaverfify == 1 || matchingEntry.fsaverfify == 2  || matchingEntry.fsaverfify == 0 ) {
                //         $('.div22pending').css('display', 'block');
                //         $('.div22done').css('display', 'none');
                //         $('#div22text').text('Admin Action Need');
                //         $('#number2div').css('background', '#fff');
                //         $('#div2number').css('color', '#black');

                // }else if (matchingEntry.fsaverfify == 3){
                //         $('.div22pending').css('display', 'none');
                //         $('.div22done').css('display', 'block');
                //         $('#div22text').text('Completed');
                //         $('#number2div').css('background', '#0069d9');
                //         $('#div2number').css('color', '#fff');
                // }

                

                resetFsaCheckboxes();
             
                function resetFsaCheckboxes() {
                    $('input[name="fsa-status"]').each(function () {
                        const $checkbox = $(this);
                        const $label = $checkbox.closest('label');

                        $checkbox.show().prop('disabled', false).prop('checked', false);
                        $label.find('.tick-icon').remove();
                      
                        // $('.success-message2').css('display','none');
                        // $('.success-message1').css('display','none');
                        $label.find('.fsa-success-br').remove(); // ✅ remove previous <br>
                    });

                }


                if(response.fsacheck == 'No'){
                    $('.verfiyfsaa').css({
                        'cursor': 'pointer',
                        'pointer-events': 'auto'
                    });
                    $('#showsecondone').css('display','none');
                    $('#div3number').text('2');
                    $('#div4number').text('3');
                    $('#half').text('4');
                    $('#div6number').text('5');
                    
                    $('#half7').text('6');
                    $('#divlasttextno').text('7');
                    

                }else{

                    $('#showsecondone').css('display','flex');
                    $('#div3number').text('3');
                    $('#div4number').text('4');
                    $('#half').text('5');
                    $('#div6number').text('6');
                    
                    $('#half7').text('7');
                    $('#divlasttextno').text('8');

                    if (matchingEntry.fsaverfify == 0) {
                       
                            $('.verfiyfsaa').css({
                                            'cursor': 'not-allowed',
                                            'pointer-events': 'none'
                                        }); 
                                    
                            $('.div22pending').css('display', 'block');
                            $('.div22done').css('display', 'none');

                            $('#div22text').text('Admin Action Need');
                            $('#number2div').css('background', '#ccc');
                            $('#div2number').css('color', '#000');
                            $('#alerttext').css('display', 'none');
                           $('#updatedone').css('display', 'block'); 
                        } else {
                            if(matchingEntry.fsaverfify == 2) {  
                            $('.verfiyfsaa').css({
                                            'cursor': 'not-allowed',
                                            'pointer-events': 'none'
                                        }); 
                                    }else{
                                        $('.verfiyfsaa').css({
                                            'cursor': 'pointer',
                                            'pointer-events': 'auto'
                                        });
                                    }
                           
                            $('.div22pending').css('display', 'none');
                            $('.div22done').css('display', 'block');

                            $('#div22text').text('Completed');
                            $('#number2div').css('background', '#0069d9');
                            $('#div2number').css('color', '#fff');
                            $('#alerttext').css('display', 'none');
                           // $('#updatedone').css('display', 'none');
                        }
                // if (matchingEntry.fsaverfify == 3 || matchingEntry.fsaverfify == 4) {
                //             $('.verfiyfsaa').css({
                //                             'cursor': 'pointer',
                //                             'pointer-events': 'auto'
                //                         });
                // }else{
                //             $('.verfiyfsaa').css({
                //                             'cursor': 'not-allowed',
                //                             'pointer-events': 'none'
                //                         });
                // }

                if (matchingEntry.fsaverfify == 0 || matchingEntry.fsaverfify == 3 || matchingEntry.fsaverfify == 4) {
                    $('#showbuttonnn, #hidebuttonnn, #slackbuttonnn').hide();
                } else {
                    $('#showbuttonnn, #slackbuttonnn').show();
                    $('#hidebuttonnn').hide();
                }

                if (matchingEntry.fsaverfify != 0) {
                    const fsaValue = matchingEntry.fsaverfify.toString();

                    $('input[name="fsa-status"]').each(function () {
                        const $checkbox = $(this);
                        const value = $checkbox.val();
                        const $label = $checkbox.closest('label');
                        const $textSpan = $label.find('.fsa-label-text');

                        if (value === fsaValue) {
                            $checkbox.prop('checked', true).prop('disabled', true).hide();

                            $label.find('.tick-icon').remove();
                            $('.success-message2').css('display','none'); $('.success-message22').css('display','none');
                            $('.success-message1').css('display','none');
                            $label.find('.fsa-success-br').remove(); // ✅ remove previous <br>

                            // ✅ Add tick icon inside label using inline-flex
                            const tickIcon = `
                                <svg class="tick-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                                    <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                </svg>
                            `;
                            $textSpan.before(tickIcon);

                            

                            if (fsaValue === '1') {
                            
                                $('.success-message1').css('display', 'inline-flex');

                    // const successMessage = `
                    //     <span class="success-message" style="font-size: 12px; display: inline-flex; align-items: center; justify-content: flex-start; gap: 5px; margin-left: 60px; line-height: 1.5;">
                    //         Create SubTasks in "Asana" successfully
                    //         <svg class="w-6 h-6 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg"
                    //             width="20" height="20" fill="green" viewBox="0 0 24 24" style="z-index: 1;">
                    //             <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                    //                 d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"></path>
                    //         </svg>
                    //     </span>

                    // `;
                            }
                         if (fsaValue === '2') {
                            $('.success-message2').css('display', 'inline-flex');

                            $('.success-message22').css('display','block');
                            //$textSpan.after(successMessage);
                        }

                        if (fsaValue === '3' || fsaValue === '4') {
                            // $('.success-message2').css('display','none');
                            // $('.success-message1').css('display','none');
                        //$textSpan.after(successMessage);
                        }


                        } else {
                           // $checkbox.prop('checked', false).prop('disabled', true).show();
                            $label.find('.tick-icon').remove();
                            // $('.success-message2').css('display','none');
                            // $('.success-message1').css('display','none');
                            $label.find('.fsa-success-br').remove(); // ✅ clean <br>
                        }
                    });

                    $('.div22done').show();
                    $('.div22pending').hide();
                } else {
                    
                        $('input[name="fsa-status"]').each(function () {
                            const $checkbox = $(this);
                            const $label = $checkbox.closest('label');
                            $checkbox.prop('checked', false).prop('disabled', false);
                            $label.find('.tick-icon').remove();
                            $('.success-message2').css('display','none'); $('.success-message22').css('display','none');
                            $('.success-message1').css('display','none');
                            $label.find('.fsa-success-br').remove(); // ✅ clean <br>
                        });

                        const anyChecked = $('input[name="fsa-status"]:checked').length > 0;
                        if (!anyChecked) {
                            $('.div22done').hide();
                            $('.div22pending').show();
                        }
                    }

                    }

                  }
                })

                // $.ajax({
                //     url: 'getstatus1',
                //     method: 'GET',
                //     data: {
                //         uid: matchingEntry.userID
                //     },
                //     dataType: 'json',

                $.ajax({
                    type: 'GET',
                    data: {
                        uid: matchingEntry.userID,
                        form_id: $('#formid').val(),
                    },
                    url: 'https://smarthub.rn-test.com/getstatus1',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    success: function(result) {
                        console.log(result);
                        console.log('kajgweyjfgawe', result.premium);

                        if(result.premium != '0'){
                        $('.premium_check').css('display', 'block');
                        }else{
                        $('.premium_check').css('display', 'none');
                        }

                        $('#fraud_list').text(result.data3);
                        $('#div3').html(`
<span id="artistno" style="padding: 10px;">NO</span>
<span  id="artistyes" style="padding: 10px;">YES</span>
<!--span style="padding: 10px;"><button class="mail" style=" " id="artistmail" onclick="send_mail()">Send mail</button></span--> 
`);
                        if (result.artist > 0) {
                            $('#artistno').css('display', 'none');
                            $('#artistyes').css('display', 'block');
                        } else {
                            $('#artistyes').css('display', 'none');
                            $('#artistno').css('display', 'block');
                        }
                        const totalAmount = result.outstandings[0].total_amount;
//const displayAmount = totalAmount === 0 ? 0 : totalAmount.toFixed(2);
const displayAmount = (typeof totalAmount === 'number' && !isNaN(totalAmount))
  ? totalAmount.toFixed(2)
  : '0.00';

$('#totalamount').text(`Total Earnings - $${displayAmount}`);
                      //  $('#totalamount').text(`Total Earnings - ${result.outstandings[0].total_amount.toFixed(2)}`); 
if(result.soundcloud != 0){
    $('#chanel_link').html('<b>Channel: </b>');

result.soundcloud.forEach(function(channel) {
    if (channel.channel) {
        $('#chanel_link').append('<a href="' + channel.channel + '" target="_blank">' + channel.channel + '</a><br>');
    }
});

$('#chanel_linksound').html('<b>Channel: </b>');
$('#soundcloudtotext').val('');
result.soundcloud.forEach(function(channel) {
    if (channel.channel) {
        $('#chanel_linksound').append('<a href="' + channel.channel + '" target="_blank">' + channel.channel + '</a><br>');
    }


$('#soundcloudtotext').val($('#soundcloudtotext').val() + channel.channel + '\n');  // Adding newline for clarity
});

$('#SoundCloud').css('display', 'block');

}
                      

                        if (result.outstandings != '0') {
                            const totalAmount = result.outstandings[0].outstand_amount;
                            //const displayAmount = totalAmount === 0 ? 0 : totalAmount.toFixed(2);
                            const displayAmount = (typeof totalAmount === 'number' && !isNaN(totalAmount))
                            ? totalAmount.toFixed(2)
                            : '0.00';
                            var outstandings = '$' + displayAmount;

                        }else{
                            // var outstandings = 'No Outstandings';
                            var outstandings = 'None';
 
                        }
                        if (result.paypal != '0') {
                            var paypal = result.paypal;

                        }else{
                            var paypal = 'No Paypal Info';
                        }

                        if(result.ytchannel.length != 0){

                            $('#chanel_link1').html('<b>Channel: </b>');

result.ytchannel.forEach(function(channel) {
    if (channel.ytchannel_url) {
        $('#chanel_link1').append('<a href="' + channel.ytchannel_url + '" target="_blank">' + channel.ytchannel_url + '</a><br>');
    }
});
$('#chanel_link1y').html('<b>Channel: </b>');

result.ytchannel.forEach(function(channel) {
    if (channel.ytchannel_url) {
        $('#chanel_link1y').append('<a href="' + channel.ytchannel_url + '" target="_blank">' + channel.ytchannel_url + '</a><br>');
    }
});

$('#chanel_link1y2').html('<b>Channel: </b>');

result.ytchannel.forEach(function(channel) {
    if (channel.ytchannel_url) {
        $('#chanel_link1y2').append('<a href="' + channel.ytchannel_url + '" target="_blank">' + channel.ytchannel_url + '</a><br>');
    }

    $('#btnsief').css('display', 'block');
});



                        }

                        console.log('outstandings', matchingEntry.verify_paypal);

                        
                        $('#div2').html(`
                    <div style="display: grid;">
                    <span style="padding: 10px;">Outstanding Earnings: ${outstandings}</span>
                    <span style="padding: 10px;" id="changetext">Paypal Info: ${paypal}</span>
                    </div>
                    <div>
                    <span style="padding: 10px;" id="addcontent">
                
                    </span>
                    </div>
                    `);
                        if (matchingEntry.verify_paypal == '1') {
                            $('.div2pending').css('display', 'none');
                            $('.div2done').css('display', 'block');
                            $('#div2text').text('Completed');
                            $('#addcontent').html(`
                            <button style="background: #0069d9;" class=" btn-secondary actiondone11 verfiyfsaa" id="requesttdone" onclick="requestconf()"
                            >Request Sent</button>`);

                            // $('#requesttdone').css({
                            //     'pointer-events': 'none',
                            //     'cursor': 'not-allowed',
                            // });
                            $('#number3div').css('background', '#0069d9');
                            $('#div3number').css('color', '#fff');

                            // $('#requesttdone').css('display', 'block');
                        } else {
                            $('.div2pending').css('display', 'block');
                            $('.div2done').css('display', 'none');
                            $('#div2text').text('Admin Action needed');
                            $('#addcontent').html(`<button style="background: #0069d9;" class=" btn-secondary actiondone11 verfiyfsaa" id="requestt"
                                onclick="request1()">Request for Paypal info</button>
                            `);
                            $('#number3div').css('background', '#ccc');
                            $('#div3number').css('color', '#000');
                        }

                        // if (result.outstandings == '0' || result.paypal == '0') {
                        //     $('#addcontent').css('display', 'block');
                        // }else{
                        //         $('#addcontent').css('display', 'none');
                        // }

                        if (result.outstandings == '0' && result.paypal == '0') {
                        //     $('.div2pending').css('display', 'block');
                        //     $('.div2done').css('display', 'none');
                        //     $('#div2text').text('Admin Action needed');
                        //     $('#number3div').css('background', '#ccc');
                        //     $('#div3number').css('color', '#000');

                        //     $('#addcontent').css('display', 'block');
                        // }else{
                            // $('#number3div').css('background', '#0069d9');
                            // $('#div3number').css('color', '#fff');
                            // $('.div2pending').css('display', 'none');
                            // $('.div2done').css('display', 'block');
                            // $('#div2text').text('Completed');

                                //$('#addcontent').css('display', 'none');
                        }



                       






                  if (matchingEntry.verify_soundlink == '1' && $('#gid1').text() != '') {
                    $('.div5pending').css('display', 'none');
                    $('.div5done').css('display', 'block');
                    $('#div5text').text('Admin Action Completed');
                    $('#SoundCloud').css('display', 'none');
                    $('#chanel_unlink').css('display', 'block');
                    $('#chanel_link').css('display', 'none');
                    $('#number6div').css('background', '#0069d9');
                    $('#div6number').css('color', '#fff');
                    $('#btnsief').css('display', 'none');
                    $('#chanel_link1').css('display', 'none');
                    $('#chanel_link2').css('display', 'block');
                    $('#show').css('display', 'block');
                    $('#show1').css('display', 'block');
                    $('#show2').css('display', 'block');
                    $('#show4').css('display', 'block');

                } else if (matchingEntry.verify_soundlink == '1' || $('#gid1').text() != '') {
                    $('#number6div').css('background', '#ccc');
                    $('#div6number').css('color', '#000');
                    $('.div5pending').css('display', 'block');
                    $('.div5done').css('display', 'none');
                    $('#div5text').text('Admin Action Needed');
                    if (matchingEntry.verify_soundlink == '1') {


                        $('#SoundCloud').css('display', 'none');
                        $('#chanel_unlink').css('display', 'block');
                        $('#chanel_link').css('display', 'none');

                    } else {
                        if(result.soundcloud.length != 0){
                $('#SoundCloud').css('display', 'block');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_link').css('display', 'block');
                        $('#chanel_linksound').css('display', 'none');
                        }else{
                            $('#chanel_linksound').css('display', 'block');
                            
                            $('#SoundCloud').css('display', 'none');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_link').css('display', 'none');
                        }
                      
                    }
                    if ($('#gid1').text() != '') {

                        $('#btnsief').css('display', 'none');
                        $('#chanel_link1').css('display', 'none');
                        $('#chanel_link2').css('display', 'block');
                        $('#show').css('display', 'block');
                        $('#show1').css('display', 'block');
                        $('#show2').css('display', 'block');
                        $('#show4').css('display', 'block');
                    } else {
                        if(result.ytchannel.length != 0){
                    $('#btnsief').css('display', 'block');

                    }
                    else{
                        $('#chanel_link1').css('display', 'none');
                        $('#chanel_link2').css('display', 'block');
                        $('#chanel_link1y').html('<b>No Channels in Youtube.</b>');
                        // $('#show').css('display', 'block');
                        // $('#show1').css('display', 'block');
                        // $('#show2').css('display', 'block');
                        $('#btnsief').css('display', 'none');
                    }

                      //  $('#btnsief').css('display', 'block');
                      //  $('#chanel_link1').css('display', 'block');
                       // $('#chanel_link2').css('display', 'none');
                        $('#show').css('display', 'none');
                        $('#show1').css('display', 'none');
                        $('#show2').css('display', 'none');
                        $('#show4').css('display', 'none');
                    }


                } else {
                    $('#number6div').css('background', '#ccc');
                    $('#div6number').css('color', '#000');
                    $('.div5pending').css('display', 'block');
                    $('.div5done').css('display', 'none');
                    $('#div5text').text('Admin Action Needed');
                    if(result.soundcloud.length != 0){
                $('#SoundCloud').css('display', 'block');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_link').css('display', 'block');
                        $('#chanel_linksound').css('display', 'none');
                        }else{
                            $('#chanel_linksound').css('display', 'block');
                            
                            $('#SoundCloud').css('display', 'none');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_link').css('display', 'none');
                        }
                      
                    // $('#SoundCloud').css('display', 'block');
                    // $('#chanel_unlink').css('display', 'none');
                    // $('#chanel_link').css('display', 'block');
                    $('#chanel_link1').css('display', 'block');
                    $('#chanel_link2').css('display', 'none');
                    $('#show').css('display', 'none');
                    $('#show1').css('display', 'none');
                    $('#show2').css('display', 'none');
                    $('#show4').css('display', 'none');
                    if(result.ytchannel.length != 0){
                    $('#btnsief').css('display', 'block');

                    }
                    else{
                        $('#chanel_link1').css('display', 'none');
                        $('#chanel_link2').css('display', 'block');
                        $('#chanel_link1y').html('<b>No Channels in Youtube.</b>');
                        $('#btnsief').css('display', 'none');
                    }
                }





                if (result.outstandings != '0' && result.paypal != '') {
                        // $('#requestt').css('display', 'none');
                        $('#addcontent').empty();
                        $('#addcontent').html(`
                            <button style="background: #0069d9;" class=" btn-secondary actiondone11 verfiyfsaa" id="requesttdone" onclick="requestconf()"
                            >Request Sent</button>`);
                        $('.div2pending').css('display', 'none');
                        $('.div2done').css('display', 'block');
                        $('#div2text').text('Completed');
                        $('#number3div').css('background', '#0069d9');
                        $('#div3number').css('color', '#fff');
                  }



                    }
                })

                //     <div id="taskhide" style="width: 100%%;text-align: initial;">
                // <div><b>USER&nbsp;:&nbsp;</b> sellerrnn(72567)</div>
                // <div><b>Paypal Email Address&nbsp;:&nbsp;</b> ${matchingEntry.email}</div>
                // <!--div><b>Outstand Earnings&nbsp;:&nbsp;</b> $40</div-->
                // <div><b> Payment Option:</b>${matchingEntry.like_to_wait_value}</div>
                // </div>
                $('#div6sub').html(`
                <ul class="space-y-2 !text-start" id="taskhide">
                    <li class="grid grid-cols-2"><b>USER:</b><span>sellerrnn(72567)</span></li>
                    <li class="grid grid-cols-2"><b>Paypal Email Address:</b><span>${matchingEntry.email}</span></li>
                    <li class="grid grid-cols-2"><b>Payment Option:</b><span>${matchingEntry.like_to_wait_value}</span></li>
                </ul> 

            <div style="width: 100%;position: relative;text-align:left;">

            <button id="btnsief1" class="flex items-center gap-2 verfiyfsaa" onclick="subtask_create1()" style="background: #0069d9;padding: 10px 14px;border: none;border-radius: 6px;color: #fff;margin-top:1rem">
            Create Subtask in  <span><img src="https://smarthub.rn-test.com/images/asana_logo.svg" style="height: 15px;" alt="logo" /></span></button>


            <div id="taskdone" class="sub-tk-msg" style="text-align:left;display:none;font-weight: 600;color: #7d7d7d;padding: 7px 0;position: relative;">Subtask Created..</div>    
            <div id="show5" style="display:none;margin:auto;padding: 10px 0; ">
            <ul class="hidden" style="list-style: none;text-align: initial;width: 100%;">
            <li><b>Assignee:</b> Bryan</li>
            <li><b>Description:</b></li>
            <li><b> Paypal Email:</b> ${matchingEntry.email}<li>
            <!--li><b> Outstand Earnings:</b> $40</li-->
            <li><b> Payment Option:</b>${matchingEntry.like_to_wait_value}</li>
            <li ><b>Status:</b> Not Completed</li>
            </ul>
            <ul class="space-y-2">
                <li class="grid grid-cols-2"><b>Assignee:</b><span>Bryan</span></li>
                <!-- <li class="grid grid-cols-2"><b>Description:</b><span>-</span></li>-->
                <li class="grid grid-cols-2"><b>Paypal Email:</b><span>${matchingEntry.email}</span></li>
                <li class="grid grid-cols-2"><b>Fraud Payment list:</b><span id="fraud_list"></span></li>
                <li class="grid grid-cols-2"><b>Payment Option:</b><span>${matchingEntry.like_to_wait_value}</span></li>
                <li id="status1" class="grid grid-cols-2"></li>
            </ul>
            </div>
            <div style="display: flex; gap: 10px; align-items: center;">    
                <div id="hidebutton" onclick="request16()" style="display: none; cursor: pointer; color: #0000ffbd; display: none;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        Hide Comments
                    </span>
                </div>

                <div id="showbutton" onclick="request6()" style="display: none; cursor: pointer; color: #0000ffbd; display: none;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        View Comments
                    </span>
                </div>

                <div id="linkbutton" style="display: none;">
                    <a href="#" id="ytasanaLink" target="_blank" style="text-decoration: none; display: inline-block;">
                        <span style="padding: 6px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center;">
                            View in 
                            <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                        </span>
                    </a>
                </div>

            </div>

            `);
                if (matchingEntry.verify_rfs == '1' && matchingEntry.verify_disapprove == '1' && matchingEntry.verify_premium == '1') {
                    $('#div4text').text('Completed');
                    $('.half').css('background', '#0069d9');
                    $('#half').css('color', '#fff');

                    $('.div4done').css('display', 'block');
                    $('.div4pending').css('display', 'none');
                    $('#yes_txt').css('display', 'block');
                    $('#remove_txt').css('display', 'block');
                    $('#remove_txtt').css('display', 'block');

                    $('#click_yes').css('display', 'none');
                    $('#click_remove').css('display', 'none');
                    $('#click_primium').css('display', 'none');

                } else if (matchingEntry.verify_rfs == '1' || matchingEntry.verify_disapprove == '1' || matchingEntry.verify_premium == '1') {
                    $('#div4text').text('Admin Action needed');
                    $('.half').css('background', 'linear-gradient(to right, #ccc 50%, #0069d9 50%)');

                    $('.div4done').css('display', 'none');
                    $('.div4pending').css('display', 'block');

                    if (matchingEntry.verify_rfs == '1') {
                        $('#yes_txt').css('display', 'block');

                        $('#click_yes').css('display', 'none');
                    } else {
                        $('#yes_txt').css('display', 'none');

                        $('#click_yes').css('display', 'block');
                    }
                    if (matchingEntry.verify_disapprove == '1') {

                        $('#remove_txt').css('display', 'block');

                        $('#click_remove').css('display', 'none');
                    } else {
                        $('#remove_txt').css('display', 'none');

                        $('#click_remove').css('display', 'block');
                    }
                    if (matchingEntry.verify_premium == '1') {
                        $('#remove_txtt').css('display', 'block');

                        $('#click_primium').css('display', 'none');
                    } else {
                        $('#remove_txtt').css('display', 'none');

                        $('#click_primium').css('display', 'block');
                    }
                } else {
                    $('#div4text').text('Admin Action needed');
                    $('.half').css('background', '#ccc');
                    $('#half').css('color', '#000');

                    $('.div4done').css('display', 'none');
                    $('.div4pending').css('display', 'block');
                    if (matchingEntry.verify_rfs == '1') {
                        $('#yes_txt').css('display', 'block');

                        $('#click_yes').css('display', 'none');
                    } else {
                        $('#yes_txt').css('display', 'none');

                        $('#click_yes').css('display', 'block');
                    }
                    if (matchingEntry.verify_disapprove == '1') {

                        $('#remove_txt').css('display', 'block');

                        $('#click_remove').css('display', 'none');
                    } else {
                        $('#remove_txt').css('display', 'none');

                        $('#click_remove').css('display', 'block');
                    }
                    if (matchingEntry.verify_premium == '1') {
                        $('#remove_txtt').css('display', 'block');

                        $('#click_primium').css('display', 'none');
                    } else {
                        $('#remove_txtt').css('display', 'none');

                        $('#click_primium').css('display', 'block');
                    }
                }

                // if (matchingEntry.fsaverfify != '0') {

                    if (matchingEntry.verify_artist == '1') {
                        $('#number4div').css('background', '#0069d9');
                        $('#div4number').css('color', '#fff');
                        $('.div3pending').css('display', 'none');
                        $('.div3done').css('display', 'block');
                        $('#div3text').text('Completed');
                    }else{
                        $('#number4div').css('background', '#ccc');
                        $('#div4number').css('color', '#000');
                        $('.div3pending').css('display', 'block');
                        $('.div3done').css('display', 'none');
                        $('#div3text').text('Admin Action Need');
                    }

                // }
                // else{
                //         $('#number4div').css('background', '#ccc');
                //         $('#div4number').css('color', '#000');
                //         $('.div3pending').css('display', 'block');
                //         $('.div3done').css('display', 'none');
                //         $('#div3text').text('Admin Action Need');
                //     }


                if (matchingEntry.verify_rfs == '1' && matchingEntry.verify_disapprove == '1' && matchingEntry.verify_premium == '1') {
                    $('#div4text').text('Completed');
                    $('.div4done').css('display', 'block');
                    $('.div4pending').css('display', 'none');
                    $('.half').css('background', '#0069d9');
                    $('#half').css('color', '#fff');
                } else if (matchingEntry.verify_rfs == '1' || matchingEntry.verify_disapprove == '1' || matchingEntry.verify_premium == '1') {
                    $('.half').css('background', '#ccc');
                    $('#half').css('color', '#000');
                    $('#div4text').text('Admin Action needed');
                    $('.div4done').css('display', 'none');
                    $('.div4pending').css('display', 'block');
                } else {
                    $('.half').css('background', '#ccc');
                    $('#half').css('color', '#000');
                    $('#div4text').text('Admin Action needed');
                    $('.div4done').css('display', 'none');
                    $('.div4pending').css('display', 'block');
                }

                if (matchingEntry) {
                    var matchingEntry1 = analysisData1.find(function(item) {
                        return item.userid.toString() === matchingEntry.form_id.toString() && item
                            .type === 'accountform';

                    });
                    var matchingEntry2 = analysisData1.find(function(item) {
                        return item.userid.toString() === matchingEntry.form_id.toString() && item
                            .type === 'accountform2';

                    });
                    var matchingEntry3 = analysisData1.find(function(item) {
                        return item.userid.toString() === matchingEntry.form_id.toString() && item
                            .type === 'accountform3';

                    });
                    var matchingEntry4 = analysisData1.find(function(item) {
                        return item.userid.toString() === matchingEntry.form_id.toString() && item
                            .type === 'accountform4';

                    });

                }
                // $('#gid3').text(`${matchingEntry3.gid}`);
                if (matchingEntry1) {
                    $('#taskdone').css('display', 'none');
                    $('#chanel_link1').css('display', 'none');
                    $('#btnsief').css('display', 'none');
                    $('#chanel_link2').css('display', 'block');
                    $('#show').css('display', 'block');
                    $('#show1').css('display', 'block');
                    $('#show2').css('display', 'block');
                    $('#show4').css('display', 'block');
                    $('#gid1').text(`${matchingEntry1.gid}`);
                }
                if (matchingEntry2) {
                    $('#taskdone').css('display', 'block');
                    $('#taskhide').css('display', 'none');
                    $('#gid2').text(`${matchingEntry2.gid}`);
                    $('#btnsief1').css('display', 'none');
                    $('#showbutton').css('display', 'block');
                    $('#hidebutton').css('display', 'none');
                    $('#linkbutton').css('display', 'block');
                    $('#show5').css('display', 'block');
                    $('#div6text').text('Completed');
                    $('.div6pending').css('display', 'none');
                    $('.div6done').css('display', 'block');
                }
                if (matchingEntry3) {
                    $('#taskdone').css('display', 'block');
                    $('#taskhide').css('display', 'none');
                    $('#gid3').text(`${matchingEntry3.gid}`);
                    $('#btnsief1').css('display', 'none');
                    $('#showbuttonn').css('display', 'block');
                    $('#hidebuttonn').css('display', 'none');
                    $('#show5').css('display', 'block');
                    $('#div6text').text('Completed');
                    $('.div6pending').css('display', 'none');
                    $('.div6done').css('display', 'block');
                }
                if (matchingEntry4) {
                    $('#taskdone').css('display', 'block');
                    $('#taskhide').css('display', 'none');
                    $('#gid4').text(`${matchingEntry4.gid}`);
                    $('#btnsief1').css('display', 'none');
                    $('#showbuttonn').css('display', 'block');
                    $('#hidebuttonn').css('display', 'none');
                    $('#show5').css('display', 'block');
                    $('#div6text').text('Completed');
                    $('.div6pending').css('display', 'none');
                    $('.div6done').css('display', 'block');
                }

                if (matchingEntry.verify_soundlink == '1' && $('#gid1').text() != '') {
                    $('.div5pending').css('display', 'none');
                    $('.div5done').css('display', 'block');
                    $('#div5text').text('Admin Action Completed');
                    $('#SoundCloud').css('display', 'none');
                    $('#chanel_unlink').css('display', 'block');
                    $('#chanel_link').css('display', 'none');
                    $('#number6div').css('background', '#0069d9');
                    $('#div6number').css('color', '#fff');
                    $('#btnsief').css('display', 'none');
                    $('#chanel_link1').css('display', 'none');
                    $('#chanel_link2').css('display', 'block');
                    $('#show').css('display', 'block');
                    $('#show1').css('display', 'block');
                    $('#show2').css('display', 'block');
                    $('#show4').css('display', 'block');


                } else if (matchingEntry.verify_soundlink == '1' || $('#gid1').text() != '') {
                    $('#number6div').css('background', '#ccc');
                    $('#div6number').css('color', '#000');
                    $('.div5pending').css('display', 'block');
                    $('.div5done').css('display', 'none');
                    $('#div5text').text('Admin Action Needed');
                    if (matchingEntry.verify_soundlink == '1') {

                        $('#SoundCloud').css('display', 'none');
                        $('#chanel_unlink').css('display', 'block');
                        $('#chanel_link').css('display', 'none');

                    } else {
                        $('#SoundCloud').css('display', 'block');
                        $('#chanel_unlink').css('display', 'none');
                        $('#chanel_link').css('display', 'block');
                    }
                    if ($('#gid1').text() != '') {

                        $('#btnsief').css('display', 'none');
                        $('#chanel_link1').css('display', 'none');
                        $('#chanel_link2').css('display', 'block');
                        $('#show').css('display', 'block');
                        $('#show1').css('display', 'block');
                        $('#show2').css('display', 'block');
                        $('#show4').css('display', 'block');
                    } else {
                        $('#btnsief').css('display', 'block');
                        $('#chanel_link1').css('display', 'block');
                        $('#chanel_link2').css('display', 'none');
                        $('#show').css('display', 'none');
                        $('#show1').css('display', 'none');
                        $('#show2').css('display', 'none');
                        $('#show4').css('display', 'none');
                    }


                } else {
                    $('#number6div').css('background', '#ccc');
                    $('#div6number').css('color', '#000');
                    $('.div5pending').css('display', 'block');
                    $('.div5done').css('display', 'none');
                    $('#div5text').text('Admin Action Needed');
                    $('#SoundCloud').css('display', 'block');
                    $('#chanel_unlink').css('display', 'none');
                    $('#chanel_link').css('display', 'block');
                    $('#chanel_link1').css('display', 'block');
                    $('#chanel_link2').css('display', 'none');
                    $('#show').css('display', 'none');
                    $('#show1').css('display', 'none');
                    $('#show2').css('display', 'none');
                    $('#show4').css('display', 'none');
                    $('#btnsief').css('display', 'block');
                }


                if ($('#gid2').text() != '') {
                    $('#div6text').text('Admin Action Completed');

                    $('.div6pending').css('display', 'none');
                    $('.div6done').css('display', 'block');
                } else {
                    $('#div6text').text('Admin Action needed');

                    $('.div6pending').css('display', 'block');
                    $('.div6done').css('display', 'none');
                }

                $.ajax({
                    type: 'GET',
                    data: {
                        gid1: $('#gid1').text(),
                        gid2: $('#gid2').text(),
                        gid3: $('#gid3').text(),
                        gid4: $('#gid4').text(),
                    },
                    url: 'https://smarthub.rn-test.com/getstatus',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    success: function(result) {
                        console.log(result);
                        $('#status').html('<b>Status:</b><span>' + result.status + '</span>');
                        $('#status1').html('<b>Status:</b><span>' + result.status1 + '</span>');
                        $('#status2').html('<b>Status:</b>' + result.status2 + '');

                        document.getElementById('status1').innerHTML = '<b>Status:</b><span>' +
                            result.status1 + '</span>';
                        document.getElementById('status').innerHTML = '<b>Status:</b><span>' +
                            result.status + '</span>';
                        document.getElementById('status2').innerHTML = '<b>Status:</b> ' +
                            result.status2 ;

                            if (result.ytasanaLink) {
                                $('#show4 a').attr('href', result.ytasanaLink);
                            }

                            if (result.slackLink) {
                                $('#slackbuttonn a').attr('href', result.slackLink);
                            }
 
                            if (result.asanaLink) {
                                $('#linkbutton a').attr('href', result.asanaLink);
                               
                            }

                            if (result.slackLinkk) {
                                $('#slackbuttonnn a').attr('href', result.slackLinkk);
                            }
                            

                        var status = result.status;
                        if (status != 'Not Completed') {

                            $('#div5text').text('Completed');
                        } else {


                            if ($('#gid1').text() != '') {
                                $('#number6div').css('background', '#ccc');
                                $('#div6number').css('color', '#000');
                                $('.div5pending').css('display', 'none');
                                $('.div5done').css('display', 'block');
                                $('#div5text').text('Admin Action Completed');
                                $('#btnsief').css('display', 'none');
                                $('#chanel_link1').css('display', 'none');
                                $('#chanel_link2').css('display', 'block');
                                $('#show').css('display', 'block');
                                $('#show1').css('display', 'block');
                                $('#show2').css('display', 'block');
                                $('#show4').css('display', 'block');
                            } else {
                                $('#number6div').css('background', '#ccc');
                                $('#div6number').css('color', '#000');
                                $('.div5pending').css('display', 'block');
                                $('.div5done').css('display', 'none');
                                $('#div5text').text('Admin Action needed');

                                $('#btnsief').css('display', 'block');
                                $('#chanel_link1').css('display', 'block');
                                $('#chanel_link2').css('display', 'none');
                                $('#show').css('display', 'none');
                                $('#show1').css('display', 'none');
                                $('#show2').css('display', 'none');
                                $('#show4').css('display', 'none');
                            }
                        }

                        if (result.status1 != 'Not Completed') {
                            $('#div6text').text('Completed');
                            $('.half7').css('background', '#0069d9');
                            $('#half7').css('color', '#fff');

                        } else {
                            if ($('#gid2').text() != '') {
                                $('.half7').css('background', '#ccc');
                                $('#half7').css('color', '#000');
                                $('#div6text').text('Admin Action Completed');

                                $('.div6pending').css('display', 'none');
                                $('.div6done').css('display', 'block');
                            } else {
                                $('.half7').css('background', '#ccc');
                                $('#half7').css('color', '#000');
                                $('#div6text').text('Admin Action needed');

                                $('.div6pending').css('display', 'block');
                                $('.div6done').css('display', 'none');
                            }
                        }

//                        

                    }
                })

                var matchingEntry2 = analysisData2.find(function(item) {
                    return item.form_id.toString() === matchingEntry.form_id.toString() && item
                        .type === 'account';
                })
                if (matchingEntry2) {
                    $('#reject').css('display', 'none');
                    $('#request').css('display', 'none');
                    $('#approve').css('display', 'none');

                    if (matchingEntry2.status == 'approve') {
                        $('#approve').css({
                            'pointer-events': 'none',
                            'cursor': 'not-allowed',
                        });
                        $('#divlasttext').css('display', 'flex');
                        $('#textfinal').text('Approved');
                        // $('#approvetext').text('Approved & Assigned it to Luna');
                        // $('#reject').css('display', 'none');
                        // $('#request').css('display', 'none');
                    } else if (matchingEntry2.status == 'request') {
                        $('#request').css({
                            'pointer-events': 'none',
                            'cursor': 'not-allowed',
                        });
                        $('#divlasttext').css('display', 'flex');
                        $('#textfinal').text('Requested Information');
                        // $('#requesttext').text('Requested Information');

                        // $('#approve').css('display', 'none');
                        // $('#reject').css('display', 'none');
                        // $('#request').css('display', 'block');
                    } else {
                        $('#reject').css({
                            'pointer-events': 'none',
                            'cursor': 'not-allowed',
                        });
                        $('#divlasttext').css('display', 'flex');
                        $('#textfinal').text('Rejected');
                        // $('#rejecttext').text('Rejected');

                        // $('#approve').css('display', 'none');
                        // // $('#reject').css('display', 'block');
                        // $('#request').css('display', 'none');

                    }
                } else {
                    $('#divlasttext').css('display', 'none');
                    $('#reject').css('display', 'flex');
                    $('#request').css('display', 'flex');
                    $('#approve').css('display', 'flex');

                }






                $('#analysismodal').modal('show');
            })


            $('#yourDataTableId').on('click', '.view', function () {

            // $('.view').click(function() {
                var formId = $(this).data('form-id');
                var details = {!! json_encode($data) !!};
                var detail = details.find(function(item) {
                    return item.form_id == formId;
                });
console.log(detail);
                $('#email').text(detail.email);
                $('#comments').text(detail.comments);

                if (detail.elaborate_reason) {
                    $('#elaborate_reason_label').show();
                    $('#elaborate_reason').text(detail.elaborate_reason_value);
                } else {
                    $('#elaborate_reason_label').hide();
                }
                $('#other_distrubutor').text(detail.other_distributor_value);
                if (detail.other_distrubutor) {
                    $('#other_distrubutor_label').show();

                } else {
                    $('#other_distrubutor_label').hide();
                }

                $('#rating').text(detail.rating);
                $('#reason').text(detail.reason_value);
                $('#userID').text(detail.userID);
                $('#username').text(detail.username);
                $('#would_you_like_to_wait').text(detail.like_to_wait_value);

                var link = $('#exportdata');

                link.attr('href', '{{ route('exportform') }}?id=' + detail.form_id);

                $('#viewpop').modal('show');
            });

            $('#click_yes').click(function() {
                var id = parseInt($('#formid').val(), 10);
                var matchingEntry = analysisData.find(function(item) {
                    console.log('Current item:', item);

                    return item.form_id === id;
                });

                $('.all_releases').css('display', 'none');
                $('.primium_release').css('display', 'none');

                $('#click_yes').attr('style', 'background: rgb(0, 105, 217); color: white; cursor: pointer; pointer-events: auto; display: block;');

                $('#yes_txt').css('display', 'none');

                $('#saleapprove').text('Do you want to RFS all active releases for user id ' + matchingEntry
                    .userID);

                $('#action_4').css('display', 'none');
                // if (matchingEntry.verify_disapprove == 1) {
                //     $('#div4text').text('Completed');
                // } else {
                //     $('#div4text').text('Admin Action Completed');
                // }

                $('.approve_sale').toggle();
                // $('#click_remove').css('display', 'block');
                // $('#click_primium').css('display', 'block');
                $('#remove_txt').css('display', 'none');
                // $('.div4done').css('display', 'block');
                // $('.div4pending').css('display', 'none');
                $('.modal-dialog').css('left', '-10%');
                $('.modal-dialog').css('max-width', '70%');
                $('.modal-dialog').css('transition', 'max-width 0.4s ease');

                $('.approve_sale').css({
                    'left': '60%',
                    'opacity': '1',
                    'z-index': '1',
                    'top': '20%',
                    'transition': 'left 1s, opacity 2s',
                    'display': 'block'
                });

            });




            $('#click_remove').click(function() {
                var id = parseInt($('#formid').val(), 10);
                var matchingEntry = analysisData.find(function(item) {
                    console.log('Current item:', item);

                    return item.form_id === id;
                });
                $('.all_releases').toggle();

                $('.approve_sale').css('display', 'none');
                $('.request_conf').css('display', 'none');
                $('.all_releases').css('display', 'block');
                $('.primium_release').css('display', 'none');

                $('#removesale').text('Do you want to disapprove all pending releases for user id ' +
                    matchingEntry.userID);


                // $('.half').css('background', '#0069d9');
                // $('#half').css('color', '#fff');

                // if (matchingEntry.verify_rfs == 1) {
                //     $('#div4text').text('Completed');
                // } else {
                //     $('#div4text').text('Admin Action Completed');
                // }
                // $('.div4done').css('display', 'block');
                // $('.div4pending').css('display', 'none');

                $('.modal-dialog').css('left', '-10%');
                $('.modal-dialog').css('max-width', '70%');
                $('.modal-dialog').css('transition', 'max-width 0.4s ease');

                $('.all_releases').css({
                    'left': '60%',
                    'opacity': '1',
                    'z-index': '1',
                    'transition': 'left 1s, opacity 2s'
                });

            });


            $('#click_primium').click(function() {
                var id = parseInt($('#formid').val(), 10);
                var matchingEntry = analysisData.find(function(item) {
                    console.log('Current item:', item);

                    return item.form_id === id;
                });

                $('.close_btn').css('display', 'block');
                $('.primium_release').toggle();
                $('#div5').css('width', '48%');
                $('#div6').css('width', '50%');
                $('#div22_div').css('width', '50%');
                $('.all_releases').css('display', 'none');
                $('.approve_sale').css('display', 'none');
                $('.request_conf').css('display', 'none');
                $('#firsts').css('display', 'none');
                $('#pre_view').css('display', 'none');
                $('#pre_asana').css('display', 'none');
                $('.primium_release').css('display', 'block');
                $('#primiumsale').empty();
                var userID =  matchingEntry.userID;

                // alert(userID)

                $.ajax({
                    type: "POST",
                    url: "{{ route('getupcids') }}",
                    headers: {
                        'X-CSRF-TOKEN': '{{ csrf_token() }}'
                    },
                    dataType: "json",
                    data: {
                        uid: userID,
                    },
                    success: function(response) {
                        let upcList = response.premium_details;

                        let html = `
                            <input type="text" id="upc-search" placeholder="Search UPC..." style="margin-bottom: 10px; width: 100%; padding: 5px; border: 1px solid #dedede; border-radius: 5px;" />
                            <div id="upc-container">`;

                        upcList.forEach(item => {
                            let color = 'skyblue'; // default
                            if (item.subtaskCount !== 0) {
                                color = 'black';
                            } else if (item.days_old <= 30) {
                                color = 'grey';
                            }

                            html += `
                                <button class="upc-btn" style="background-color: ${color}; color: white;">
                                    ${item.upc}
                                </button>`;
                        });

                        html += '</div>';
                        $('#primiumsale').html(html);

                        // Search
                        $('#upc-search').on('input', function() {
                            $('#pre_view').hide();
                            $('#pre_asana').hide();
                            $('.close_btn').css('display', 'block');
                            let searchVal = $(this).val().toLowerCase();
                            $('.upc-btn').each(function() {
                                let upc = $(this).text().toLowerCase();
                                $(this).toggle(upc.includes(searchVal));
                            });
                        });
                    }
                });


                $(document).on('click', '.upc-btn', function() {
                    var upc = $(this).text();  
                    $('#upc_idss').val(upc);

                    // alert($('#upc_idss').val())
                    
                    $.ajax({
                        type: "POST",
                        url: "{{ route('upcchecklist') }}",
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        data: {
                            upc: upc,  // Send the clicked UPC
                        },
                        success: function(response) {
                            // Check if the response is successful
                            // alert(response.upccheckdt)
                            var reldate = response.upccheckdt;  // '2025-04-18 14:05:32'
                            var responseDate = new Date(reldate);

                            // Add 30 days to the responseDate
                            var datePlus30 = new Date(responseDate);
                            datePlus30.setDate(responseDate.getDate() + 30);

                            // Get today's date at midnight
                            var currentDate = new Date();
                            currentDate.setHours(0, 0, 0, 0);

                            // Debug outputs
                            console.log("Response Date: " + responseDate);     // Original date
                            console.log("Date + 30 days: " + datePlus30);      // Corrected future date
                            console.log("Current Date: " + currentDate);       // Current date for comparison


                            if(response.resultt != '0'){
                                    // $('.premium_sm').removeClass('hidden'); 
                                    // setTimeout(function() {
                                        // $('.premium_sm').addClass('hidden'); 
                                        // $('.primium_release').hide();
                                        $('#pre_view').css('display', 'block');
                                        $('#pre_asana').css('display', 'block');
                                        $('.close_btn').css('display', 'none');
                                        $('#asanalinkkkk').attr('href', response.asanalinkkkk);
                                    // }, 3000);
                                    return;
                                }else{
                                        $('#pre_view').css('display', 'none');
                                        $('#pre_asana').css('display', 'none');
                                        $('.close_btn').css('display', 'block');
                                        // $('#asanalinkkkk').attr('href', 'https://your-dynamic-link.com');
                                }

                            if (currentDate > datePlus30) {

                                // window.location.href = 'https://www.rnadmin.com/cancelpaypalsubscription#'; 
                                window.open('https://www.rnadmin.com/cancelpaypalsubscription#', '_blank');
                                
                             } 
                             else {
                                createAsanaTask(upc);
                            }
                        },
                        error: function(xhr) {
                            console.error('Error:', xhr.responseText);
                        }
                    });
                });

                function createAsanaTask(upc){
                    var upcs = upc;
                    $.ajax({
                        type: "POST",
                        url: "{{ route('premiumsubtask') }}",
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        data: {
                            upc: upcs,
                            formid: $('#formid').val(),
                        },
                        success: function(response) {
                            $('.premium_sm').removeClass('hidden'); 
                            setTimeout(function() {
                                $('.premium_sm').addClass('hidden'); 
                                $('#pre_view').css('display', 'block');
                                $('#pre_asana').css('display', 'block');
                                $('#asanalinkkkk').attr('href', response.asanalinkkkk);
                                $('.close_btn').css('display', 'none');
                                // $('.primium_release').hide();
                            }, 3000);
                        },
                        error: function(xhr) {
                            console.error('Error:', xhr.responseText);
                        }
                    });

                }

                $(document).on('click', '#pre_view', function() {

                    var storedUpc = $('#upc_idss').val();

                $.ajax({
                    type: 'GET',
                    url: 'https://smarthub.rn-test.com/getpremiumtsk',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: {
                        upc: storedUpc,
                    },
                    success: function(result) {
                        console.log(result);
                        $('#data-containerer').empty();
                        let html = '';
                        $('#data-containerer').html(html);
                        let comments = result.comments.data; // Access the comments array
                        $.each(comments, function(index, value) {
                            // Get the first two letters of the name
                            let firstTwoLetters = value.created_by.name.substring(0, 2);

                            // Calculate time difference
                            let timestamp = new Date(value.created_at);
                            let currentDate = new Date();
                            let diff = Math.floor((currentDate - timestamp) /
                                1000); // Difference in seconds

                            let days = Math.floor(diff / (60 * 60 * 24));
                            diff -= days * (60 * 60 * 24);

                            let hours = Math.floor(diff / (60 * 60));
                            diff -= hours * (60 * 60);

                            let minutes = Math.floor(diff / 60);
                            let htmlTime = '';

                            if (days > 0) {
                                htmlTime = `${days} Days`;
                            } else if (hours > 0) {
                                htmlTime = `${hours} Hours`;
                            } else if (minutes > 0) {
                                htmlTime = `${minutes} Minutes`;
                            } else {
                                htmlTime = 'Less than a minute ago';
                            }

                            html += `
                            <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                                <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                                <div class="col-span-9 text-start">
                                    <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                    <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                                </div>
                            </div>
                            `;
                        });
                        
                        $('.primium_release').hide();
                        $('.sou-yt-pupoop').css({
                            'left': '50%',
                            'top': '0',
                            'width' : '50%',
                            'opacity': '1',
                            'z-index': '1',
                            'transition': 'left 1s, opacity 2s'
                        });
                        // Insert the HTML into the container
                        $('#data-containerer').html(html);
                        // $('.modal-dialog').css('left', '-10%');
                        // $('.modal-dialog').css('max-width', '70%');
                        // $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        $('#firsts').css('display', 'block');
                    }
                })

            });


            $(document).on('click', '.close_btn', function() {
                var formid =  matchingEntry.form_id;
                    $.ajax({
                    type: 'POST',
                    url: 'https://smarthub.rn-test.com/verifypremium',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: {
                        form_id: formid,
                    },
                    success: function(result) {
                        $('.close_btn').css('display', 'none');
                        $('#primiumsale')
                        .empty()
                        .append('<p style="color: black;">Premium Releases Updated Successfully..</p>');
                        $('#click_primium').css('display', 'none');
                        $('#remove_txtt').css('display', 'block');
                        
                        if (result.resultt[0].verify_rfs == 1 && result.resultt[0].verify_disapprove == 1) {
                            $('.half').css('background', '#0069d9');
                            $('#half').css('color', '#fff');
                            $('#div4text').text('Completed');
                            $('.div4done').css('display', 'block');
                            $('.div4pending').css('display', 'none');
                        } else {
                            $('#div4text').text('Admin Action Completed');
                            $('.div4done').css('display', 'none');
                            $('.div4pending').css('display', 'block');
                            $('.half').css('background', '#ccc');
                            $('#half').css('color', '#000');
                        }
                        setTimeout(function() {
                        close_mail();
                        $('#div5').css('width', '98%');
                        $('#div6').css('width', '100%');
                        },  3000);
                    }
                    })
                });

                $('.modal-dialog').css('left', '-10%');
                $('.modal-dialog').css('max-width', '70%');
                $('.modal-dialog').css('transition', 'max-width 0.4s ease');

                $('.primium_release').css({
                    'left': '50%',
                    'top': '0%',
                    'opacity': '1',
                    'z-index': '1',
                    'transition': 'left 1s, opacity 2s'
                });

            });


            $(document).on('click', '#comment_posttt', function() {
            // function comment_posttt() {

                var cmts = document.getElementById('texst_valuee').value;
                var storedUpc = $('#upc_idss').val();
                // var gid = $('#gid1').text();

                $.ajax({
                    type: 'POST',
                    url: 'https://smarthub.rn-test.com/cmtpremiumtsk',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: {
                        cmts: cmts,
                        // subtaskid: gid
                        upc: storedUpc,
                    },
                    success: function(result) {

                        $('#texst_valuee').val('');

                        $('#data-containerer').empty();
                        let html = '';
                        $('#data-containerer').html(html);
                        let comments = result.comments.data; // Access the comments array

                        $.each(comments, function(index, value) {
                            // Get the first two letters of the name
                            let firstTwoLetters = value.created_by.name.substring(0, 2);

                            // Calculate time difference
                            let timestamp = new Date(value.created_at);
                            let currentDate = new Date();
                            let diff = Math.floor((currentDate - timestamp) /
                                1000); // Difference in seconds

                            let days = Math.floor(diff / (60 * 60 * 24));
                            diff -= days * (60 * 60 * 24);

                            let hours = Math.floor(diff / (60 * 60));
                            diff -= hours * (60 * 60);

                            let minutes = Math.floor(diff / 60);
                            let htmlTime = '';

                            if (days > 0) {
                                htmlTime = `${days} Days`;
                            } else if (hours > 0) {
                                htmlTime = `${hours} Hours`;
                            } else if (minutes > 0) {
                                htmlTime = `${minutes} Minutes`;
                            } else {
                                htmlTime = 'Less than a minute ago';
                            }

                            html += `
                            <div class="grid grid-cols-10 items-center gap-[3.5rem]">
                                <div class="h-12 w-12 bg-orange-400 rounded-full grid place-items-center">${firstTwoLetters}</div>
                                <div class="col-span-9 text-start">
                                    <div class="flex items-center gap-1"><div class="font-medium ">${capitalize(value.created_by.name)}</div><span class="text-sm font-medium text-gray-500">${htmlTime}</span></div>
                                    <div class="font-medium text-slate-500 text-xs">${value.text}</div>
                                </div>
                            </div>
                            `;
                        });

                        $('.primium_release').hide();
                        $('.sou-yt-pupoop').css({
                            'left': '50%',
                            'top': '0',
                            'width' : '50%',
                            'opacity': '1',
                            'z-index': '1',
                            'transition': 'left 1s, opacity 2s'
                        });

                        $('#data-containerer').html(html);
                        $('#firsts').css('display', 'block');
                    }
                })

                });


            $('#approve_sale_ok').click(function() {


                //     $('.approve_sale').css('display', 'none');
                //     $('.approve_sale_completed').css('display', 'block');
                //     $('.approve_sale_completed').css('opacity', '1');
                //     $('.approve_sale_completed').css('left', '60%');

                //  setTimeout(function() {
                //             $('.approve_sale_completed').css('display', 'none');
                //             $('#approve_sale').css('opacity', '0');
                //             $('.modal-dialog').css('max-width', '500px');
                //             $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                //         }, 2000);

                $.ajax({
                    type: 'GET',
                    data: {
                        formid: $('#formid').val()
                    },
                    url: 'https://smarthub.rn-test.com/verifyrfs',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    success: function(result) {
                        var analysisData = null;
                        var id = $('#formid').val();
                        var matchingEntry = analysisData.find(function(item) {


                            return item.form_id === parseInt(id);
                        });
                        console.log(id);
                        console.log(result);
                       // if (matchingEntry.verify_disapprove == 1 && matchingEntry.verify_premium == 1) {

                       if (result.resultt[0].verify_premium == 1 && result.resultt[0].verify_disapprove == 1) {
                            $('#div4text').text('Completed');
                            $('.div4done').css('display', 'block');
                            $('.div4pending').css('display', 'none');
                            $('.half').css('background', '#0069d9');
                            $('#half').css('color', '#fff');
                        } 
                        // else if (matchingEntry.verify_rfs == 1 || matchingEntry
                        //     .verify_disapprove == 1) {
                        //     $('.half').css('background', '#ccc');
                        //     $('#half').css('color', '#000');
                        //     $('#div4text').text('Admin Action needed');
                        //     $('.div4done').css('display', 'none');
                        //     $('.div4pending').css('display', 'block');
                        // }
                         else {
                            $('.half').css('background', '#ccc');
                            $('#half').css('color', '#000');
                            $('#div4text').text('Admin Action needed');
                            $('.div4done').css('display', 'none');
                            $('.div4pending').css('display', 'block');
                        }
                        // $('.half').css('background', '#ccc');
                        // $('#half').css('color', '#000');
                        // $('#div4text').text('Admin Action needed');
                        // $('.div4done').css('display', 'none');
                        // $('.div4pending').css('display', 'block');

                        $('#click_yes').css('display', 'none');
                        $('#yes_txt').css('display', 'block');
                        if (result.resultt[0].verify_premium == 1){
                            $('#click_primium').css('display', 'none');
                            $('#remove_txtt').css('display', 'block');
                        } else{
                            $('#click_primium').css('display', 'block');
                            $('#remove_txtt').css('display', 'none');
                        }

                        if (result.resultt[0].verify_disapprove == 1){
                            
                            $('#remove_txt').css('display', 'block');       $('#click_remove').css('display', 'none');
                        }else{
                            $('#click_remove').css('display', 'block');  $('#remove_txt').css('display', 'none');  
                        }

                        $('#premium_check').css('display', 'block');


                        $('.approve_sale').css('display', 'none');
                        $('.request_conf').css('display', 'none');
                        $('.approve_sale_completed').css('display', 'block');
                        $('.approve_sale_completed').css('opacity', '1');
                        $('.approve_sale_completed').css('left', '60%');

                        setTimeout(function() {
                            $('.approve_sale_completed').css('display', 'none');
                            $('#approve_sale').css('opacity', '0');
                            $('.request_conf').css('opacity', '0');
                            $('.modal-dialog').css('max-width', '500px');
                            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        }, 2000);
                    }
                })
            });




            $('#all_releases_ok').click(function() {

                //  $('.all_releases').css('display', 'none');
                //         $('.approve_sale_completed').css('display', 'block');
                //         $('.approve_sale_completed').css('opacity', '1');
                //         $('.approve_sale_completed').css('left', '60%');
                //         setTimeout(function() {
                //             $('.approve_sale_completed').css('display', 'none');
                //             $('#approve_sale').css('opacity', '0');
                //             $('.modal-dialog').css('max-width', '500px');
                //             $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                //         }, 2000);

                $.ajax({
                    type: 'GET',
                    data: {
                        formid: $('#formid').val()
                    },
                    url: 'https://smarthub.rn-test.com/verifydisapprove',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    success: function(result) {
                        var analysisData = null;
                        var id = $('#formid').val();
                        var matchingEntry = analysisData.find(function(item) {


                            return item.form_id === parseInt(id);
                        });

                    // if (matchingEntry.verify_rfs == 1 && matchingEntry.verify_premium == 1) {

                        if (result.resultt[0].verify_rfs == 1 && result.resultt[0].verify_premium == 1) {
                            $('#div4text').text('Completed');
                            $('.div4done').css('display', 'block');
                            $('.div4pending').css('display', 'none');
                            $('.half').css('background', '#0069d9');
                            $('#half').css('color', '#fff');
                        } 
                        // else if (matchingEntry.verify_rfs == 1 || matchingEntry
                        //     .verify_disapprove == 1) {
                        //     $('.half').css('background', '#ccc');
                        //     $('#half').css('color', '#000');
                        //     $('#div4text').text('Admin Action needed');
                        //     $('.div4done').css('display', 'none');
                        //     $('.div4pending').css('display', 'block');
                        // } 
                        else {
                            $('.half').css('background', '#ccc');
                            $('#half').css('color', '#000');
                            $('#div4text').text('Admin Action needed');
                            $('.div4done').css('display', 'none');
                            $('.div4pending').css('display', 'block');
                        }
                        // $('#div4text').text('Completed');
                        // $('.div4done').css('display', 'block');
                        // $('.div4pending').css('display', 'none');
                        // $('.half').css('background', '#0069d9');
                        // $('#half').css('color', '#fff');
                        
                        if (result.resultt[0].verify_premium == 1){
                            $('#click_primium').css('display', 'none');
                            $('#remove_txtt').css('display', 'block');
                        }
                        else{
                            $('#click_primium').css('display', 'block');
                            $('#remove_txtt').css('display', 'none');
                        }

                        if (result.resultt[0].verify_rfs == 1){
                            
                            $('#yes_txt').css('display', 'block');       $('#click_yes').css('display', 'none');
                        }else{
                            $('#click_yes').css('display', 'block');  $('#yes_txt').css('display', 'none');  
                        }

                        $('#premium_check').css('display', 'block');




                        $('#click_remove').css('display', 'none');
                        $('#remove_txt').css('display', 'block');

                        $('.primium_release').css('display', 'none');
                        $('.all_releases').css('display', 'none');
                        $('.approve_sale_completed').css('display', 'block');
                        $('.approve_sale_completed').css('opacity', '1');
                        $('.approve_sale_completed').css('left', '60%');
                        setTimeout(function() {
                            $('.approve_sale_completed').css('display', 'none');
                            $('#approve_sale').css('opacity', '0');
                            $('.request_conf').css('opacity', '0');
                            $('.modal-dialog').css('max-width', '500px');
                            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        }, 2000);
                    }
                })
            });








        });


        let requestEditor, rejectEditor;

// Whitelist font sizes
const Size = Quill.import('formats/size');
Size.whitelist = ['small', 'normal', 'large', 'huge', 'medium-large'];
Quill.register(Size, true);

document.addEventListener('DOMContentLoaded', function () {
  // Initialize Quill editors
  requestEditor = new Quill('#requestname', {
    theme: 'snow',
    modules: {
      toolbar: '#toolbar-request'
    },
    placeholder: 'Compose your message here...'
  });

  rejectEditor = new Quill('#rejectname', {
    theme: 'snow',
    modules: {
      toolbar: '#toolbar-reject'
    },
    placeholder: 'Compose your rejection message here...'
  });

  // Toggle source button for request editor only
  document.getElementById('toggle-source').addEventListener('click', function () {
        const isSourceMode = this.classList.contains('source-mode');
        const quillContainer = document.getElementById('requestname');
        const sourceTextarea = document.getElementById('request-source');
        const toolbarButtons = document.querySelectorAll('#toolbar-request button, #toolbar-request select');
        const toolbarPickers = document.querySelectorAll('#toolbar-request .ql-picker');

        if (!isSourceMode) {
            // Switch to source mode
            sourceTextarea.value = requestEditor.root.innerHTML;
            quillContainer.style.display = 'none';
            sourceTextarea.style.display = 'block';
            this.classList.add('source-mode');

            // Disable all toolbar buttons except this one
            toolbarButtons.forEach(btn => {
            if (btn !== this) {
                btn.disabled = true;
                btn.style.opacity = '0.5';
                btn.style.pointerEvents = 'none';
            }
            });

            // Disable all .ql-picker dropdowns (font, size, color, etc.)
            toolbarPickers.forEach(picker => {
            picker.classList.add('ql-disabled');
            picker.style.opacity = '0.5';
            picker.style.pointerEvents = 'none';
            });

            // Highlight the toggle button
            this.style.border = '2px solid #1355AC';
            this.style.color = '#1355AC';
            this.style.borderRadius = '5px';
        } else {
            // Switch back to editor mode
            requestEditor.clipboard.dangerouslyPasteHTML(sourceTextarea.value);
            quillContainer.style.display = 'block';
            sourceTextarea.style.display = 'none';
            this.classList.remove('source-mode');

            // Re-enable all toolbar buttons
            toolbarButtons.forEach(btn => {
            btn.disabled = false;
            btn.style.opacity = '';
            btn.style.pointerEvents = '';
            });

            // Re-enable all .ql-picker dropdowns
            toolbarPickers.forEach(picker => {
            picker.classList.remove('ql-disabled');
            picker.style.opacity = '';
            picker.style.pointerEvents = '';
            });

            // Remove toggle button highlight
            this.style.border = '';
            this.style.color = '';
            this.style.borderRadius = '';
        }
     });

    document.getElementById('toggle-reject-source').addEventListener('click', function () {
        const isSourceMode = this.classList.contains('source-mode');
        const quillContainer = document.getElementById('rejectname');
        const sourceTextarea = document.getElementById('reject-source');
        const toolbarButtons = document.querySelectorAll('#toolbar-reject button, #toolbar-reject select');
        const toolbarPickers = document.querySelectorAll('#toolbar-reject .ql-picker');

        if (!isSourceMode) {
            // Switch to source mode
            sourceTextarea.value = rejectEditor.root.innerHTML;
            quillContainer.style.display = 'none';
            sourceTextarea.style.display = 'block';
            this.classList.add('source-mode');

            // Disable all toolbar buttons except this one
            toolbarButtons.forEach(btn => {
            if (btn !== this) {
                btn.disabled = true;
                btn.style.opacity = '0.5';
                btn.style.pointerEvents = 'none';
            }
            });

            // Disable all .ql-picker dropdowns (font, size, color, etc.)
            toolbarPickers.forEach(picker => {
            picker.classList.add('ql-disabled');
            picker.style.opacity = '0.5';
            picker.style.pointerEvents = 'none';
            });

            // Highlight the toggle button
            this.style.border = '2px solid #1355AC';
            this.style.color = '#1355AC';
            this.style.borderRadius = '5px';
        } else {
            // Switch back to editor mode
            rejectEditor.clipboard.dangerouslyPasteHTML(sourceTextarea.value);
            quillContainer.style.display = 'block';
            sourceTextarea.style.display = 'none';
            this.classList.remove('source-mode');

            // Re-enable all toolbar buttons
            toolbarButtons.forEach(btn => {
            btn.disabled = false;
            btn.style.opacity = '';
            btn.style.pointerEvents = '';
            });

            // Re-enable all .ql-picker dropdowns
            toolbarPickers.forEach(picker => {
            picker.classList.remove('ql-disabled');
            picker.style.opacity = '';
            picker.style.pointerEvents = '';
            });

            // Remove toggle button highlight
            this.style.border = '';
            this.style.color = '';
            this.style.borderRadius = '';
        }
     });
});



        function request() {
            var analysisData = null;
            var formId = $('#formid').val();
            var username = $('#usename').val();
            var matchingEntry = analysisData.find(function(item) {
                return item.form_id == formId;
            });
            console.log(matchingEntry);
            $('#requestto').text(matchingEntry.email);
//             $('#requestname').text(`Hey ${matchingEntry.username},

// Thanks for submitting our closure form. We have started to process your request, however in order to proceed further, we will need you to confirm the following details:






// Many Warm Regards,
// The RouteNote Team`);


const content = [
  { insert: `Dear ${username},\n`, attributes: { bold: true, color: '#1355AC', font: 'arial', size: 'large' } },
  { insert: '\nThanks for submitting our closure form. We have started to process your request, however in order to proceed further, we will need you to confirm the following details:\n\n\n'},
  { insert: 'Many Warm Regards,\n', attributes: { size: 'medium-large' } },
  { insert: 'The RouteNote Team', attributes: { size: 'medium-large', color: '#1355ac', italic: true, bold: true } }
];


if (requestEditor) {
  requestEditor.setContents(content);
}

            $('#requestmail').modal('show');
            $('#analysismodal').modal('hide');
            $('#approvemodal').modal('hide');

        }


        function reject() {
            var analysisData = null;
            var formId = $('#formid').val();
            var username = $('#usename').val();
            var matchingEntry = analysisData.find(function(item) {
                return item.form_id == formId;
            });
            console.log(matchingEntry);
            $('#rejectto').text(matchingEntry.email);
//             $('#rejectname').text(`Hey ${matchingEntry.username},

// Thanks for submitting our closure form, however unfortunately this request has been rejected for the following reasons:






// Many Warm Regards,
// The RouteNote Team`);

const content = [
  { insert: `Dear ${username},\n`, attributes: { bold: true, color: '#1355AC', font: 'arial', size: 'large' } },
  { insert: '\nThanks for submitting our closure form, however unfortunately this request has been rejected for the following reasons:\n\n\n'},
  { insert: 'Many Warm Regards,\n', attributes: { size: 'medium-large' } },
  { insert: 'The RouteNote Team', attributes: { size: 'medium-large', color: '#1355ac', italic: true, bold: true } }
];


if (rejectEditor) {
    rejectEditor.setContents(content);
}

            $('#rejectmail').modal('show');
            $('#analysismodal').modal('hide');
            $('#approvemodal').modal('hide');

        }

        function mailsent(value) {
                if (value === 'reject') {
                    body = rejectEditor.root.innerHTML;
                to = $('#rejectto').text();
                } else if (value === 'request') {
                    body = requestEditor.root.innerHTML;
                to = $('#requestto').text();
                }else{
                var body = '';
                var to = $('#approveto').val();
            }

            $.ajax({
                type: 'POST',
                data: {
                    formid: $('#formid').val(),
                    value: value,
                    type: 'account',
                    body: encodeURIComponent(body),
                    to: to
                },
                url: 'https://smarthub.rn-test.com/actiondone',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },

                success: function(result) {
                    console.log(result);
                    $('#mailsentinfo').modal('show');
                    $('#requestmail').modal('hide');
                    $('#rejectmail').modal('hide');
                }
            })
            
        }

        function approve() {
            var analysisData = null;
            var formId = $('#formid').val();
            var matchingEntry = analysisData.find(function(item) {
                return item.form_id == formId;
            });
            console.log(matchingEntry);
            $('#approveto').val(matchingEntry.email);
            $.ajax({
                type: 'POST',
                data: {
                    formid: $('#formid').val(),
                    value: 'approve',
                    type: 'account',
                    to: $('#approveto').val()
                },
                url: 'https://smarthub.rn-test.com/actiondone',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },

                success: function(result) {

                    $('#approvemodal').modal('show');
                    $('#analysismodal').modal('hide');
                }
            })

        }
    </script>

    <body>


        <!-- Full Container Start -->
        <div class="full_container_start" style="width: 100%;overflow: scroll;height: 75vh;    padding: 17px;">

            <h4>Account Closure OTL Forms</h4><br>


            <style>
                .switch {
                    position: absolute;
                    display: inline-block;
                    width: 34px;
                    height: 20px;
                }

                .switch input {
                    opacity: 0;
                    width: 0;
                    height: 0;
                }

                .slider {
                    position: absolute;
                    cursor: pointer;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    background-color: #ccc;
                    transition: .4s;
                    border-radius: 20px;
                }

                .slider:before {
                    position: absolute;
                    content: "";
                    height: 12px;
                    width: 12px;
                    border-radius: 50%;
                    left: 4px;
                    bottom: 4px;
                    background-color: white;
                    transition: .4s;
                }

                input:checked+.slider {
                    background-color: #2196F3;
                }

                input:checked+.slider:before {
                    transform: translateX(14px);
                }
            </style>
                        <style>
                #primiumsale {
                    max-height: 300px;
                    overflow-y: auto;
                }

                #upc-container {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 10px;
                }

                .upc-btn {
                    flex: 0 0 calc(33.333% - 10px);
                    padding: 10px;
                    border: none;
                    border-radius: 4px;
                    text-align: center;
                    cursor: pointer;
                    font-size: 14px;
                }

                .upc-btn:focus {
                    border: 2px solid black;
                    outline: none; 
                }


            </style>



            <table id="yourDataTableId" style="font-size: 14px;" class="stripe bordered">
                <thead
                    style="width: 100%;background-color: #807a7a; justify-content: space-between;color: #fff;font-size: 14px; font-weight: 500;text-align: center;">
                    <tr>
                        <th style="width:5%">#</th>
                        <th style="width:10%">Form Type</th>
                        <th style="width:10%">UserName</th>
                        <th style="width:10%">Submitted On</th>
                        <th style="width:10%">Status</th>
                        <th style="width:10%">Confirmation Email</th>
                        <th style="width:15%">Account Closure Form Details</th>
                        <th style="width:10%">Smarthub Report</th>
                    </tr>
                </thead>
                <tbody id="tbody">
                    @foreach ($data as $item)
                        <tr>
                            @if($item->type == '1')
                            <td>{{ $item->id }}</td>
                            @else
                            <td>{{ $item->form_id }}</td>
                            @endif
                            <td>Account Closure Form</td>
                            <td>{{ $item->username }}
                            </td>
                            <td>{{ $item->submitted_at }}</td>
                            <td>
                                @if($item->status == 'approve')
                                    Approved
                                @elseif($item->status == 'reject')
                                    Rejected
                                @elseif($item->status == '')
                                    Admin Action Needed
                                    @elseif($item->status == 'request')
                                    Requested Information
                                @else
                                    {{ $item->status }}
                                @endif
                            </td>

                            <td>
                                <label class="switch">
                                    <input type="checkbox" class="toggle-confirmation" data-id="{{ $item->form_id }}"
                                        {{ $item->confirmation_email ? 'checked' : '' }}>
                                    <span class="slider round"></span>
                                </label>
                            </td>



                            <td><button class="btn btn-secondary view" style="border-radius: 9px;background-color: #0069d9;"
                                    data-form-id="{{ $item->form_id }}">View Details</button></td>
                            <td><button class="btn btn-secondary analysis"
                                    style="width: 128px;height: 37px;border-radius: 9px;background-color: #0069d9;"
                                    data-form-id="{{ $item->form_id }}">View Details</button></td>

                        </tr>
                    @endforeach
                </tbody>
            </table>

        </div>


        <!-- Modal HTML -->
        <div class="modal fade" id="analysismodal" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content" style="width: 132%;height: ;">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">Processing the Closure</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span style="color: #fff">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                        <input type="hidden" id="formid">
                        <input type="hidden" id="usename">
                        <input type="hidden" id="fsacheckkk">

                        <div class="full">
                            <div style="display: flex;">
                                <div style="padding: 20px;position: relative;" class="hover_div">
                                    <span class="number" style="background-color: #0069d9;"> <span
                                            style="color:#fff;font-weight: bold">1</span></span>

                                    <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                        xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                        viewBox="0 0 24 24"
                                        style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                        <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                            d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                        </path>
                                    </svg>
                                    <span class="hover_txt">Completed</span>

                                </div>

                                <div style="padding: 20px;">
                                    <span id="sentence_1" onclick="toggleDiv()" style="font-size: medium;"> Security
                                        Check - do the details match?</span>

                                    <div class="open_div" id="div1" style="display:grid">

                                    </div>
                                </div>
                            </div>


                            <div style="display: flex;" id="showsecondone">
                                <div style="padding: 20px;position: relative;" class="hover_div">

                                    <span class="number" id="number2div" style=""><span
                                            style="color:#000;font-weight: bold" id="div2number">2</span></span>

                                    <svg class="div22pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                        xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                        viewBox="0 0 24 24"
                                        style="position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                        <path stroke="red" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2" d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                    </svg>


                                    <svg class="div22done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                        xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                        viewBox="0 0 24 24"
                                        style="display:none;position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                        <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2" d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                        </path>
                                    </svg>



                                    <span id="div22text" class="hover_txt">Admin Action Needed</span>


                                </div>
                                <!-- <span class="hidden" id="fsaverfifyy"></span> -->

<div style="padding: 20px; width: 100%; gap: 10px;">
    <span id="sentence_1" onclick="toggleDiv222()" style="font-size: medium;">
      Security Check process for 'FSA USER'
    </span>

    <style>
        .fsa-option {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 12px;
            flex-wrap: nowrap;
        }

        .fsa-checkbox {
            width: 20px;
            height: 20px;
            accent-color: green;
            flex-shrink: 0;
            margin-left: 10px;
        }

        .tick-icon {
            display: inline-block;
            margin-left: -5px;
            width: 30px !important;
            height: 30px !important;
            fill: green;
            vertical-align: middle;
            flex-shrink: 0;
        }

        .fsa-label-text {
            flex: 1;
            margin-left: 5px;
        }

    </style>

<div id="div22_div" style="width: 100%;">
    <div id="div22" class="open_div" style="display: grid; width: auto; z-index: 11;">
        <div>

<!--  -->


        <label class="fsa-option" style="display: flex !important">
        <span class="fsa-icon">   <input type="checkbox" name="fsa-status" value="1" class="fsa-checkbox" onclick="onlyOne(this)">  </span>
            <span class="fsa-label-text">The user is not listed on the FSA tracker (meaning they need to be reviewed for eligibility to be moved back to the standard payment list)</span>
        </label>
        <p class="success-message1" style="font-size: 12px;display: none;align-items: center;justify-content: flex-start;gap: 5px;margin-left: 60px;line-height: 1.5;">
            Created SubTasks in "Asana" successfully
            <svg class="w-6 h-6 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="green" viewBox="0 0 24 24" style="z-index: 1;">
                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"></path>
            </svg>
        </p>

        <br>
        <label class="fsa-option" style="display: flex !important">
        <span class="fsa-icon"> <input type="checkbox" name="fsa-status" value="2" class="fsa-checkbox" onclick="onlyOne(this)"></span>
            <span class="fsa-label-text">The user is listed on the FSA tracker, but hasn't been reviewed for eligibility to be moved back to the standard payment list</span>
        </label>
    
        <p class="success-message2" style="font-size: 12px;display: none;align-items: center;justify-content: flex-start;gap: 5px;margin-left: 60px;line-height: 1.5;">
            Created SubTasks in "Asana" successfully
            <svg class="w-6 h-6 text-gray-800 dark:text-white" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="green" viewBox="0 0 24 24" style="z-index: 1;">
                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"></path>
            </svg>
        </p>
        <br> 
        <label class="fsa-option" style="display: flex !important">
        <span class="fsa-icon"> <input type="checkbox" name="fsa-status" value="3" class="fsa-checkbox" onclick="onlyOne(this)"></span>
            <span class="fsa-label-text">The user is listed on the FSA tracker, has been reviewed, and is remaining on the fraud payment list.</span>
        </label>
        <br>
        <label class="fsa-option" style="display: flex !important">
        <span class="fsa-icon"> <input type="checkbox" name="fsa-status" value="4" class="fsa-checkbox" onclick="onlyOne(this)"></span>
            <span class="fsa-label-text">The user is listed on the FSA tracker, has been reviewed, and has been moved back to the standard payment list</span>
        </label>
<br>
        <div>
         

            <div style="display: flex; gap: 10px; align-items: center; margin-top: -10px;">    

            <div id="updatedone" onclick="fsaverify()" style="cursor: pointer; color: #0000ffbd;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                    Update
                    </span>
                </div>

                <div id="hidebuttonnn" onclick="request445()" style="display: none; cursor: pointer; color: #0000ffbd;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        Hide Comments
                    </span>
                </div>

                <div id="showbuttonnn" onclick="request45()" style="cursor: pointer; color: #0000ffbd;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        View Comments
                    </span>
                </div>

                <div id="slackbuttonnn" style="">
                    <a href="#" id="slackLinkk" target="_blank" style="text-decoration: none; display: inline-block;">
                        <span style="padding: 6px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center;">
                            View in 
                            <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                        </span>
                    </a>
                </div>
            
            </div>
            <br>
            <p class="success-message22" style="
    color: red;
    font-weight: 800;
    display: none; 
    font-size: 14px;
">The closure process is paused until a verdict from the review is received.</p><br>
          </div>
        </div>
        <!-- <div style="color: red; margin-left: 116px; display: none;" id="alerttext">* Must completed this step</div> -->


                             <div class="sou-yt-pupopp" id="firstt" style="display: none;">
                                        <div class="yt-headerr">
                                            <div class="flex items-center gap-2 justify-center">
                                                <div>All Activity in</div>
                                                <img src="https://smarthub.rn-test.com/images/asana_logo.svg"
                                                    alt="ansana" class="h-3">
                                            </div>
                                        </div>
                                        <div id="data-containerr" class="space-y-3"
                                            style="height: 14rem;width: 100%;padding: 1.5rem;overflow:auto">


                                        </div>
                                        <div class="w-full">
                                            <div class="relative">
                                                <input type="text" id="texst_value"
                                                    class="w-full pl-3 pr-10 py-2 bg-transparent placeholder:text-slate-400 text-slate-600 text-sm border border-slate-200 rounded-md transition duration-300 ease focus:outline-none focus:border-slate-400 hover:border-slate-300 shadow-sm focus:shadow"
                                                    placeholder="comments *" />

                                                <svg xmlns="http://www.w3.org/2000/svg" Onclick="comment_postt()"
                                                    width="16" height="16" fill="currentColor"
                                                    class="bi bi-send absolute w-5 h-5 top-2.5 right-2.5 text-slate-600"
                                                    viewBox="0 0 16 16">
                                                    <path
                                                        d="M15.854.146a.5.5 0 0 1 .11.54l-5.819 14.547a.75.75 0 0 1-1.329.124l-3.178-4.995L.643 7.184a.75.75 0 0 1 .124-1.33L15.314.037a.5.5 0 0 1 .54.11ZM6.636 10.07l2.761 4.338L14.13 2.576zm6.787-8.201L1.591 6.602l4.339 2.76z" />
                                                </svg>
                                            </div>
                                        </div>
                                </div>
                     </div>
            </div>

        </div>

</div>

<!-- <script>
function onlyOne(checkbox) {
    const checkboxes = document.getElementsByName('fsa-status');
    const alertText = document.getElementById('alerttext');

    checkboxes.forEach((item) => {
        if (item !== checkbox) item.checked = false;
    });

    // Check if any checkbox is selected
    const anyChecked = Array.from(checkboxes).some(cb => cb.checked);
    alertText.style.display = anyChecked ? 'none' : 'block';
}

// Run on page load to show alert if nothing is selected
window.onload = function () {
    const checkboxes = document.getElementsByName('fsa-status');
    const alertText = document.getElementById('alerttext');
    const anyChecked = Array.from(checkboxes).some(cb => cb.checked);
    alertText.style.display = anyChecked ? 'none' : 'block';
};
</script> -->
<script>
function onlyOne(checkbox) {
    const checkboxes = document.getElementsByName('fsa-status');
    const updateButton = document.getElementById('updatedone');

    checkboxes.forEach((item) => {
        if (item !== checkbox) item.checked = false;
    });

    // Change button content based on selected checkbox value
    const selectedValue = checkbox.checked ? checkbox.value : null;

    if (selectedValue === "1" || selectedValue === "2") {

updateButton.innerHTML = `
    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px;">
        Create
        <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 14px;">
    </span>
`;
} else {
updateButton.innerHTML = `
    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
        Update
    </span>
`;
}
}
</script>




                            <div style="display: flex;">
                                <div style="padding: 20px;position: relative;" class="hover_div">

                                    <span class="number" id="number3div" style=""><span
                                            style="color:#000;font-weight: bold" id="div3number">3</span></span>

                                    <svg class="div2pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                        xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                        viewBox="0 0 24 24"
                                        style="position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                        <path stroke="red" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2" d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                    </svg>


                                    <svg class="div2done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                        xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                        viewBox="0 0 24 24"
                                        style="display:none;position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                        <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2" d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                        </path>
                                    </svg>



                                    <span id="div2text" class="hover_txt">Admin Action Needed</span>


                                </div>


                                <div style="padding: 20px;width: 100%;gap: 10px;">
                                    <span id="sentence_1" onclick="toggleDiv2()" style="font-size: medium;">
                                        Does the account have any outstanding earnings?</span>

                                    <div style="width: 100%;display: flex;">
                                        <div id="div2" class="open_div"
                                            style=" display:grid;width: auto;height: 10%;z-index:11">
                                            
                                       </div>

                                        <div class="box svg" style="display: none;margin-top: -31px;"></div>

                                        <div id="request_div" style=" width: 50%;">
                                            <div class="modal-content" style=" ">
                                                <div class="modal-header">
                                                    <h5 style="color: white;" class="modal-title" id="customPopupLabel">
                                                        Request for Paypal</h5>
                                                    <button type="button" class="close">
                                                        <span onclick="close_mail()" style="color: #fff">&times;</span>
                                                    </button>
                                                </div>
                                                <div class="modal-body">
                                                    <label class="modalabel">To:</label>
                                                    <label id="paypalto" disabled class="login-form__input">
                                                    </label><br>
                                                    <label class="modalabel">Subject:</label><br>
                                                    <input class="login-form__input" type="text" name="Email"
                                                        id="name" size="59px"
                                                        value="Closure - No Payment Method">
                                                    <br><br>
                                                    <label class="modalabel">Body:</label><br>
                                                    <!-- <textarea class="login-form__input" type="text" name="paypalbody" id="paypalbody"
                                                        style="position: relative;height: 150px;width: 100%;text-align: left" disabled>

                                                    </textarea> -->

                                                    <div id="toolbar-paypalbody">
                                                    <span class="ql-formats">
                                                        <select class="ql-font"></select>
                                                        <select class="ql-size"></select>
                                                    </span>
                                                    <span class="ql-formats">
                                                        <button class="ql-bold"></button>
                                                        <button class="ql-italic"></button>
                                                        <button class="ql-underline"></button>
                                                        <button class="ql-strike"></button>
                                                    </span>
                                                    <span class="ql-formats">
                                                        <select class="ql-color"></select>
                                                        <select class="ql-background"></select>
                                                    </span>
                                                    <span class="ql-formats">
                                                        <button class="ql-header" value="1"></button>
                                                        <button class="ql-header" value="2"></button>
                                                        <button class="ql-header" value="3"></button>
                                                        <button class="ql-blockquote"></button>
                                                        <button class="ql-code-block"></button>
                                                        
                                                    </span>
                                                    <span class="ql-formats">
                                                        <button class="ql-list" value="ordered"></button>
                                                        <button class="ql-list" value="bullet"></button>
                                                        <button class="ql-indent" value="-1"></button>
                                                        <button class="ql-indent" value="+1"></button>
                                                    </span>
                                                    <span class="ql-formats">
                                                        <button class="ql-direction" value="rtl"></button>
                                                        <select class="ql-align"></select>
                                                    </span>
                                                    <span class="ql-formats">
                                                        <button class="ql-link"></button>
                                                        <button class="ql-image"></button>
                                                        <button type="button" id="toggle-source-paypal" class="btn btn-sm btn-outline-secondary ml-2"><svg viewBox="0 0 18 18"><polyline class="ql-even ql-stroke" points="5 7 3 9 5 11"></polyline><polyline class="ql-even ql-stroke" points="13 7 15 9 13 11"></polyline><line class="ql-stroke" x1="10" x2="8" y1="5" y2="13"></line></svg></button>
                                                    </span>
                                                </div>


                                                <div id="paypalbody" style="height: 200px;"></div>
                                                <textarea id="paypalbody-source" style="display:none; width: 100%; height: 200px;border-radius: 0px !important;"></textarea>
     
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="submit" class="btn btn-secondary login maill"
                                                        onclick="send()" id="send">Send</button>
                                                    <button type="button" class="btn btn-secondary" id="approvesend"
                                                        onclick="close_mail()">Close</button>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="request_conf"
                                            style="padding: 0;border-radius: 6px;overflow: hidden;">
                                            <div style="padding: 10px; background: #0069d9;color: #fff">Action
                                                <button type="button" class="close">
                                                    <span onclick="close_mail()" style="color: #fff">×</span>
                                                </button>
                                            </div>

                                            <div style="padding: 20px;">
                                            Are you sure you want to re-send this email? 
                                            </div>

                                            <div class="modal-footer"
                                                style="padding: 0px;display: flex;gap: 0px;justify-content: end;">
                                                <button class="ok_btn" onclick="request1()">Yes</button>
                                                <button class="ok_btn" style="background-color: #ccc"
                                                    onclick="close_mail()">No</button>

                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                       </div>



                        <div style="display: flex;">
                            <div style="padding: 20px;position: relative;" class="hover_div">
                                <span class="number" id="number4div" style="background-color: #0069d9;"><span
                                        style="color:#fff;font-weight: bold" id="div4number">4</span></span>

                                <svg class="div3done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                    viewBox="0 0 24 24"
                                    style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                    <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                    </path>
                                </svg>
                                <svg class="div3pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                    viewBox="0 0 24 24"
                                    style="display:none;position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                    <path stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                </svg>
                                <span id="div3text" class="hover_txt">Completed</span>
                            </div>

                            <div style="padding: 20px;">
                                <span id="sentence_1" onclick="toggleDiv3()" style="font-size: medium;"> Are they an
                                    Artist Services managed account?</span>

                                <div style="width: 100%;display: flex;">
                                    <div id="div3" class="open_div" style="display:grid;height: 10%;z-index:11">
                                    <span  id="artistyes" style="padding: 10px;">YES</span>
                                    </div>

                                    <div class="box svg2" style="display: none;"></div>



                                    <!--div id="send_mail" style=" width: 50%;">
                                                                                                        <div class="modal-content" style=" ">
                                                                                                            <div class="modal-header">
                                                                                                                <h5 style="color: white;" class="modal-title" id="customPopupLabel">
                                                                                                                    Email Confirmation</h5>
                                                                                                                <button type="button" class="close">
                                                                                                                    <span onclick="close_mail()" style="color: #fff">&times;</span>
                                                                                                                </button>
                                                                                                            </div>
                                                                                                            <div class="modal-body">
                                                                                                                <label class="modalabel">To:</label>
                                                                                                                <label disabled class="login-form__input">
                                                                                                                    mcldevtest@gmail.com</label><br>
                                                                                                                <label class="modalabel">Subject:</label>
                                                                                                                <input class="login-form__input" type="text" name="Email"
                                                                                                                    id="name" size="59px"
                                                                                                                    value="Closure - No Payment Method">
                                                                                                                <br><br>
                                                                                                                <label class="modalabel">Body:</label><br>
                                                                                                                <textarea class="login-form__input" type="text" name="Email" id="name"
                                                                                                                    style="position: relative;height: 150px;width: 100%;text-align: left">Dear sellerrnn,

                                                If you'd like to receive the earnings on your account, you'll first need to add a payment method to your account. 

                                                To link up your PayPal email to your account, you'll need to log in to your RouteNote account, hover over 'Your Account' and then click 'Payment Profile'. You'll see a prompt for a One-Time passcode which will have been sent to your registered email address. 
                                                If you'd rather close your account without receiving your final earnings, we can proceed without the need to add a payment method to your account. 

                                                This is in relation to the RouteNote account with the username sellerrnn and UID 725567.

                                                Please confirm in your reply when you've registered these details, or if you'd like to have your account closed without receiving the earnings. If you do not respond within 30 days, we will close the account as initially requested.

                                                Many Warm Regards,
                                                The RouteNote Team

                                                </textarea>
                                                                                                            </div>
                                                                                                            <div class="modal-footer">
                                                                                                                <button type="submit" class="btn btn-secondary login maill"
                                                                                                                    onclick="send3()">Send</button>
                                                                                                                <button type="button" class="btn btn-secondary" id="approvesend"
                                                                                                                    data-dismiss="modal">Close</button>
                                                                                                            </div>
                                                                                                        </div>
                                                                                                    </div-->
                                </div>
                            </div>
                        </div>

                        <style>
                            .hover_div:hover {
                                cursor: pointer;
                            }

                            .hover_div:hover .hover_txt {
                                display: block;
                                cursor: pointer;
                                color: #01216a;
                            }

                            .hover_txt {
                                width: max-content;
                                left: 50px;
                                top: 20px;
                                display: none;
                                position: absolute;
                                z-index: 9999;
                                background: white;
                                padding: 3px 14px;
                                box-shadow: 0px 0px 15px 0px;
                                border-radius: 7px;
                            }

                            input {
                                width: 100%;
                            }
                        </style>

                        <div style="display: flex;">
                            <div style="padding: 20px;position: relative;" class="hover_div">
                                <span class="number half" id="number5div" style=" "><span id="half"
                                        style="color:black;font-weight: bold" >5</span></span>

                                <svg class="div4pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                    viewBox="0 0 24 24"
                                    style="position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                    <path stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                </svg>

                                <svg class="div4done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                    viewBox="0 0 24 24"
                                    style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;display: none;">
                                    <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                    </path>
                                </svg>

                                <span class="hover_txt" id="div4text">Admin Action Needed</span>

                            </div>

                            <div id="div444" style="padding: 20px;position: relative;width: 100%;">
                                <span id="sentence_1" onclick="toggleDiv4()" style="font-size: medium;">
                                    Removing approved releases from sale/disapproving pending releases</span>
                                <div id="div4" class="open_div" style="display:grid;width: fit-content">
                                    <div id="remove_flex" style="display:grid;gap: 10px">
                                        <span style="">
                                            <button style="background: #0069d9;color:white;" class="remove verfiyfsaa"
                                                id="click_yes">RFS all Active Releases</button>
                                            <span id="yes_txt" style="display:none;position: relative;">
                                                <li style="display:flex">
                                                    <span>Removing approved releases from sale </span>
                                                    <span><svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                            aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                            width="24" height="24" fill="green"
                                                            viewBox="0 0 24 24"
                                                            style="position: ;z-index: 1;width: 20px;">
                                                            <path stroke="#fff" stroke-linecap="round"
                                                                stroke-linejoin="round" stroke-width="2"
                                                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                            </path>
                                                        </svg> </span>
                                                </li>

                                            </span>
                                        </span>

                                        <span class="premium_check" style="display:none;">
                                            <button style="background: #0069d9;color:white;" class="remove verfiyfsaa"
                                                id="click_primium">View Premium Releases</button>
                                            <span id="remove_txtt" style="display:none; position: relative;">
                                                <li style="display:flex">
                                                    <span>Remove all premium releases </span>
                                                    <span><svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                            aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                            width="24" height="24" fill="green"
                                                            viewBox="0 0 24 24" style="z-index: 1;width: 20px;">
                                                            <path stroke="#fff" stroke-linecap="round"
                                                                stroke-linejoin="round" stroke-width="2"
                                                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                            </path>
                                                        </svg> </span>
                                                </li>

                                            </span>
                                        </span>

                                        <span style="">
                                            <button style="background: #0069d9;color:white;" class="remove verfiyfsaa"
                                                id="click_remove">Disapprove all pending releases</button>
                                            <span id="remove_txt" style="display:none;position: relative;">


                                                <li style="display:flex">
                                                    <span> Disapproving all pending releases </span>
                                                    <span><svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                            aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                            width="24" height="24" fill="green"
                                                            viewBox="0 0 24 24" style="z-index: 1;width: 20px;">
                                                            <path stroke="#fff" stroke-linecap="round"
                                                                stroke-linejoin="round" stroke-width="2"
                                                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                            </path>
                                                        </svg> </span>
                                                </li>

                                            </span>
                                        </span>
                                    </div>
                                </div>

                                <style>
                                    .approve_sale_completed,
                                    .all_releases,
                                    .approve_sale {
                                        padding: 20px;
                                        background-color: #f8f8f8;
                                        width: 35%;
                                        right: 0;
                                        opacity: 0;
                                        z-index: -1;
                                        position: absolute;
                                        border-radius: 6px;
                                        box-shadow: 3px 3px 4px -4px;
                                    }
                                    .primium_release {
                                        padding: 20px;
                                        background-color: #f8f8f8;
                                        width: 47%;
                                        right: 0;
                                        opacity: 0;
                                        z-index: -1;
                                        position: absolute;
                                        border-radius: 6px;
                                        box-shadow: 3px 3px 4px -4px;
                                    }
                                    .sou-yt-pupoop {
                                        padding: 20px;
                                        background-color: #f8f8f8;
                                        width: 47%;
                                        right: 0;
                                        opacity: 0;
                                        z-index: -1;
                                        position: absolute;
                                        border-radius: 6px;
                                        box-shadow: 3px 3px 4px -4px;
                                    }
                                    .request_conf {
                                        padding: 20px;
                                        background-color: #f8f8f8;
                                        width: 32%;
                                        right: 0;
                                        opacity: 0;
                                        z-index: -1;
                                        position: absolute;
                                        border-radius: 6px;
                                        box-shadow: 3px 3px 4px -4px;
                                    }
                                </style>

                                <div class="approve_sale"
                                    style="padding: 0;top: 25%;border-radius: 6px;overflow: hidden;">
                                    <div style="padding: 10px; background: #0069d9;color: #fff">Action
                                        <button type="button" class="close">
                                            <span onclick="close_mail()" style="color: #fff">×</span>
                                        </button>
                                    </div>

                                    <div id="saleapprove" style="padding: 20px;">
                                    </div>

                                    <div class="modal-footer"
                                        style="padding: 0px;display: flex;gap: 0px;justify-content: end;">
                                        <button class="ok_btn" id="approve_sale_ok">ok</button>
                                        <button class="ok_btn" style="background-color: #ccc" id="approve_sale_no"
                                            onclick="toggleDiv44()">Cancel</button>

                                    </div>
                                </div>

                                <div class="all_releases "
                                    style="padding: 0;top: 25%;border-radius: 6px;overflow: hidden;">
                                    <div style="padding: 10px; background: #0069d9;color: #fff">Action
                                        <button type="button" class="close">
                                            <span onclick="close_mail()" style="color: #fff">×</span>
                                        </button>
                                    </div>

                                    <div id="removesale" style="padding: 20px;">
                                    </div>

                                    <div class="modal-footer"
                                        style="padding: 0px;display: flex;gap: 0px;justify-content: end;">
                                        <button class="ok_btn" id="all_releases_ok">ok</button>
                                        <button class="ok_btn" style="background-color: #ccc" id="all_releases_no"
                                            onclick="toggleDiv444()">Cancel</button>

                                    </div>
                                </div>

                                <div class="primium_release"
                                    style="padding: 0;top: 25%;border-radius: 6px;overflow: hidden;">
                                    <div id="premium_hd" style="padding: 10px; background: #0069d9;color: #fff">Premium Releases
                                        <button type="button" class="close">
                                            <span onclick="close_mail()" style="color: #fff">×</span>
                                        </button>
                                    </div>

                                    <div id="primiumsale" style="padding: 20px;">
                                    </div>

                                    <span class="hidden" id="upc_idss"></span>

                                    <div class="modal-footer"
                                        style="padding: 10px;display: flex;gap: 0px;justify-content: end;">
                                        <!-- <button class="ok_btn" id="all_releases_ok">ok</button> -->
                                        <div class="premium_sm flex items-center gap-2 hidden">
                                            <span>Created Premium SubTasks in "Asana" successfully</span>
                                            <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="green" viewBox="0 0 24 24">
                                                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                                    d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                            </svg>
                                        </div>

                                        <div id="pre_view" style="cursor: pointer; color: #0000ffbd; display:none;">
                                            <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                                                View Comments
                                            </span>
                                        </div>


                                        <div id="pre_asana" style="display: none;">
                                            <a href="#" id="asanalinkkkk" target="_blank" style="text-decoration: none; display: inline-block;">
                                                <span style="padding: 6px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center;">
                                                    View in 
                                                    <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                                                </span>
                                            </a>
                                        </div>

                                        <button class="close_btn" style="background: #0069d9; color: #fff;padding: 5px 1rem;border-radius: 5px;">Close Premium Releases</button>

                                        <button class="ok_btn" style="background-color: #ccc"
                                            onclick="close_mail()">Close</button>
                                    </div>
                                </div>


                                <div class="sou-yt-pupoop" id="firsts" style="display: none;">
                                        <div class="yt-header">
                                            <button type="button" class="close" style="margin-top: -5px;">
                                                <span onclick="close_mail()" style="color: black;">&times;</span>
                                            </button>
                                            <div class="flex items-center gap-2 justify-center">
                                                <div>All Activity in</div>
                                                <img src="https://smarthub.rn-test.com/images/asana_logo.svg"
                                                    alt="ansana" class="h-3">
                                            </div>
                                        </div>
                                        <div id="data-containerer" class="space-y-3"
                                            style="height: 14rem;width: 100%;padding: 1.5rem;overflow:auto">


                                        </div>
                                        <div class="w-full">
                                            <div class="relative">
                                                <input type="text" id="texst_valuee"
                                                    class="w-full pl-3 pr-10 py-2 bg-transparent placeholder:text-slate-400 text-slate-600 text-sm border border-slate-200 rounded-md transition duration-300 ease focus:outline-none focus:border-slate-400 hover:border-slate-300 shadow-sm focus:shadow"
                                                    placeholder="comments *" />

                                                <svg xmlns="http://www.w3.org/2000/svg" id="comment_posttt" style="cursor: pointer;"
                                                    width="16" height="16" fill="currentColor"
                                                    class="bi bi-send absolute w-5 h-5 top-2.5 right-2.5 text-slate-600"
                                                    viewBox="0 0 16 16">
                                                    <path
                                                        d="M15.854.146a.5.5 0 0 1 .11.54l-5.819 14.547a.75.75 0 0 1-1.329.124l-3.178-4.995L.643 7.184a.75.75 0 0 1 .124-1.33L15.314.037a.5.5 0 0 1 .54.11ZM6.636 10.07l2.761 4.338L14.13 2.576zm6.787-8.201L1.591 6.602l4.339 2.76z" />
                                                </svg>
                                            </div>
                                        </div>

                                    </div>

                                <div class="approve_sale_completed"
                                    style="padding: 0;top: 25%;border-radius: 6px;overflow: hidden;">
                                    <div style="padding: 10px; background: #0069d9;color: #fff">Action
                                        <button type="button" class="close">
                                            <span onclick="close_mail()" style="color: #fff">×</span>
                                        </button>
                                    </div>

                                    <div style="padding: 20px;">
                                        Updated Successfully..
                                    </div>

                                    <div class="modal-footer"
                                        style="padding: 0px;display: flex;gap: 20px;justify-content: end;">
                                        <!-- <button class="ok_btn" id="all_releases_ok">ok</button> -->
                                    </div>

                                </div>



                            </div>
                        </div>

                        <div style="display: flex;">
                            <div style="padding: 20px;position: relative;" class="hover_div">



                                <span class="number" id="number6div" style="background-color: #ccc;"><span
                                        id="div6number" style="color:black;font-weight: bold">6</span></span>

                                <svg class="div5done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                    viewBox="0 0 24 24"
                                    style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                    <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                    </path>
                                </svg>

                                <svg class="div5pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                    viewBox="0 0 24 24"
                                    style="position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                    <path stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                                </svg>





                                <span class="hover_txt" id="div5text">Admin Action Needed</span>


                            </div>

                            <div style="padding: 20px;position: relative;width: 100%;">
                                <span id="sentence_1" onclick="toggleDiv5()" style="font-size: medium;"> Unlinking
                                    any linked SoundCloud/YouTube channels</span>

                                <div class="open_div" id="div5"
                                    style="postion:relative;display:grid;width: 98%;grid-template-columns: 1fr auto;">

                                    <div style="width:100%;">
                                        <div style="width:100%;text-align: left;font-weight:600">
                                            <span
                                                style="font-weight:bold;font-size: larger;position: relative;">SoundCloud</span>
                                            <div style="position: relative;"> <span id="chanel_link" style="width: 70%;"><b>Channel:
                                                    </b>https://soundcloud.com/routenote</span></div>
                                                    <div style="position: relative;"> <span id="chanel_linksound"><b>Channel:
                                                        </b>https://soundcloud.com/routenote</span></div><br>
                                            <div id="chanel_unlink"
                                                style="display:none;font-size: 14px;font-weight: 500;">
                                              

                                                <div style="position: relative;font-size: 16px;">
                                                    <ul style="text-align: left;">
                                                        <li style="display:flex">
                                                            <!-- <span>Soundcloud Unliked in "RN" -->
                                                            <span>Created SubTasks in "Asana" successfully</span> &nbsp;&nbsp;
                                                            <span> <svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                                    width="24" height="24" fill="green"
                                                                    viewBox="0 0 24 24" style=" ;z-index: 1;width: 20px;">
                                                                    <path stroke="#fff" stroke-linecap="round"
                                                                        stroke-linejoin="round" stroke-width="2"
                                                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                                    </path>
                                                                </svg></span>
                                                        </li>
                                                        <li>
                                                        <div style="font-weight: 600;color: #7d7d7d;padding: 7px 0;position: relative;">
                                                            Subtask Created..</div>

                                                            <div style="margin: -9px 0 0 0px;padding: 10px 0; ">
                                                            <ul style="list-style: none;text-align: initial;">
                                                                <li><b>Assignee:</b> Bryan</li>
                                                                <!-- <li><b>Description:</b> Can you Please check the <br>userid(72567) for the FSA Payment Tracker?</li> -->
                                                                <li id="status2"></li>
                                                            </ul>
                                                            </div>
                                                        </li>
                                                        <!-- <li style="display:flex"><span>Email sent to "soundcloud@route.com"
                                                                successfully</span>&nbsp;&nbsp;
                                                            <span> <svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                                    aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                                    width="24" height="24" fill="green"
                                                                    viewBox="0 0 24 24" style="z-index: 1;width: 20px;">
                                                                    <path stroke="#fff" stroke-linecap="round"
                                                                        stroke-linejoin="round" stroke-width="2"
                                                                        d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                                    </path>
                                                                </svg></span>
                                                        </li> -->
                                                    </ul>
               <div style="display: flex; gap: 10px; align-items: center; margin-top: -10px;">    
                <div id="hidebuttonn" onclick="request155()" style="display: none; cursor: pointer; color: #0000ffbd;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        Hide Comments
                    </span>
                </div>

                <div id="showbuttonn" onclick="request55()" style="cursor: pointer; color: #0000ffbd;">
                    <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                        View Comments
                    </span>
                </div>

                <div id="slackbuttonn" style="">
                    <a href="#" id="slackLink" target="_blank" style="text-decoration: none; display: inline-block;">
                        <span style="padding: 6px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center;">
                            View in 
                            <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                        </span>
                    </a>
                </div>
            </div>
                                                </div>
                                            </div>


                                            <!-- <div style="background: #0069d9;padding: 9px;margin: 15px 0;border-radius: 6px;cursor: pointer;color: #fff;width: fit-content;"
                                                id="SoundCloud">
                                                Unlink &amp; Notify soundcloud Network
                                            </div> -->

                                            <div id="SoundCloud" style="margin-bottom:10px;" class="verfiyfsaa">
                                                    <span style="padding: 10px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center; width: 62% !important; cursor: pointer; font-size: 16px;">
                                                    Create SubTasks in   
                                                        <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                                                    </span>
                                            </div>



                                        </div>
                                        <div style="width: 95%;text-align: left; margin-top: 10px;">
                                            <div
                                                style="font-weight:bold;font-size: larger;text-align: left;position: relative;">
                                                YouTube channels</div>
                                                                                        <span id="gid1" style="display:none;"></span> <span id="gid2"
                                                style="display:none;"></span><span id="gid3" style="display:none;"></span>
                                                <span id="gid4" style="display:none;"></span>
                                            <div style="position: relative;"> <span id="chanel_link1"><b>Channel:
                                                    </b>https://www.youtube.com/channel/zzzzzzzzzz</span></div>
                                            <div id="btnsief">
                                                <button onclick="subtask_create()"
                                                    class="mt-2 bg-[#0069d9] text-white p-2 w-max flex items-center gap-2 rounded-md verfiyfsaa">
                                                    <div class="font-medium">Unlink & Create Subtask</div>
                                                    <img src="https://smarthub.rn-test.com/images/asana_logo.svg"
                                                        alt="asana" class="h-3">
                                                </button>
                                            </div>


                                            <div id="chanel_link2" style="display:none;position: relative;">
                                                <span id="chanel_link1y"><b>Channel: </b>https://www.youtube.com/channel/zzzzzzzzzz</span>
                                            </div>
                                            <ul id="show" style="display:none;text-align: left;">
                                                <li style="display:flex"><span>Youtube channel Unliked in "RN" successfully
                                                    </span>&nbsp;&nbsp;
                                                    <span> <svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                            aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                            width="24" height="24" fill="green"
                                                            viewBox="0 0 24 24" style=" z-index: 1;width: 20px;">
                                                            <path stroke="#fff" stroke-linecap="round"
                                                                stroke-linejoin="round" stroke-width="2"
                                                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                            </path>
                                                        </svg></span>
                                                </li>
                                                <li style="display:flex">
                                                    <span><svg class="w-6 h-6 text-gray-800 dark:text-white"
                                                            aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                                            width="24" height="24" fill="green"
                                                            viewBox="0 0 24 24" style="z-index: 1;width: 20px;">
                                                            <path stroke="#fff" stroke-linecap="round"
                                                                stroke-linejoin="round" stroke-width="2"
                                                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                                            </path>
                                                        </svg>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span>Created this
                                                        task as a subtask of "Unlinks" task under "YouTube Requests
                                                        from Support Project" in Asana</span> &nbsp;&nbsp;
                                                </li>
                                             </ul>

                                            <div class="sub-tk-msg"
                                                style="display:none;font-weight: 600;color: #7d7d7d;padding: 7px 0;position: relative;">
                                                Subtask Created.</div>

                                            <div id="show1"
                                                style="display:none;margin: -9px 0 0 0px;padding: 10px 0; ">

                                                <ul class="space-y-2">
                                                    <li class="grid" style="grid-template-columns: 1fr 1fr;">
                                                        <b>Assignee:</b><span>Bryan</span></li>
                                                    <li class="grid" style="grid-template-columns: 1fr 1fr;">
                                                        <b>Description:</b><br><span id="chanel_link1y2">Channel:
                                                            https://www.youtube.com/channel/zzzzzzzzzz</span></li>
                                                    <li id="status" class="grid grid-cols-2"></li>
                                                </ul>
                                            </div>
                                            <div style="display: flex; gap: 10px; align-items: center;">
                                            <div id="show3" style="display:none; cursor: pointer; color: #1010ffde;" onclick="request15()">
                                                <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                                                    Hide Comments
                                                </span>
                                            </div>

                                            <div id="show2" style="display:none; cursor: pointer; color: #1010ffde;" onclick="request555()">
                                                <span style="padding: 8px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600;">
                                                    View Comments
                                                </span>
                                            </div>

                                            <div id="show4" style="display: none;">
                                                <a href="#" id="asanaLink" target="_blank" style="text-decoration: none; display: inline-block;">
                                                    <span style="padding: 6px 1rem; background: #0069d9; color: #fff; border-radius: 5px; font-weight: 600; display: flex; align-items: center;">
                                                        View in 
                                                        <img src="https://smarthub.rn-test.com/images/asana_logo.svg" alt="asana" style="height: 12px; margin-left: 5px;">
                                                    </span>
                                                </a>
                                            </div>

                                        </div>

                                        </div>

                                    </div>

                                    <div class="sou-yt-pupop" id="first">
                                        <div class="yt-header">
                                            <div class="flex items-center gap-2 justify-center">
                                                <div>All Activity in</div>
                                                <img src="https://smarthub.rn-test.com/images/asana_logo.svg"
                                                    alt="ansana" class="h-3">
                                            </div>
                                        </div>
                                        <div id="data-container" class="space-y-3"
                                            style="height: 14rem;width: 100%;padding: 1.5rem;overflow:auto">


                                        </div>
                                        <div class="w-full">
                                            <div class="relative">
                                                <input type="text" id="texst_value"
                                                    class="w-full pl-3 pr-10 py-2 bg-transparent placeholder:text-slate-400 text-slate-600 text-sm border border-slate-200 rounded-md transition duration-300 ease focus:outline-none focus:border-slate-400 hover:border-slate-300 shadow-sm focus:shadow"
                                                    placeholder="comments *" />

                                                <svg xmlns="http://www.w3.org/2000/svg" Onclick="comment_post()"
                                                    width="16" height="16" fill="currentColor"
                                                    class="bi bi-send absolute w-5 h-5 top-2.5 right-2.5 text-slate-600"
                                                    viewBox="0 0 16 16">
                                                    <path
                                                        d="M15.854.146a.5.5 0 0 1 .11.54l-5.819 14.547a.75.75 0 0 1-1.329.124l-3.178-4.995L.643 7.184a.75.75 0 0 1 .124-1.33L15.314.037a.5.5 0 0 1 .54.11ZM6.636 10.07l2.761 4.338L14.13 2.576zm6.787-8.201L1.591 6.602l4.339 2.76z" />
                                                </svg>
                                            </div>
                                        </div>

                                    </div>
                                </div>




                                <div id="unlink_mail"
                                    style=" width: 50%;display:none;border: 1px solid #bbb;border-radius: 10px;overflow: hidden;">
                                    <div class="modal-content" style=" ">
                                        <div class="modal-header">
                                            <h5 style="color: white;" class="modal-title" id="customPopupLabel">Request
                                                for Soundlink</h5>
                                            <button type="button" class="close">
                                                <span onclick="toggleDiv5()" style="color: #fff">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <label class="modalabel">To:</label>
                                            <label id="soundcloudto" disabled class="login-form__input">
                                                soundcloud@routenote.com</label><br>
                                            <label class="modalabel">Subject:</label><br>
                                            <input class="login-form__input" type="text" name="Email"
                                                id="name" size="59px" value=" Unlink">
                                            <br><br>
                                            <label class="modalabel">Body:</label><br>
                                            <textarea class="login-form__input" type="text" name="Email" id="soundcloudtotext"
                                                style="position: relative;height: 150px;width: 100%;text-align: left">https://soundcloud.com/routenote
                                                    </textarea>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="submit" class="btn btn-secondary login maill"
                                                id="SoundCloud_send">Send</button>
                                            <button type="button" class="btn btn-secondary" id="approvesend"
                                                onclick="toggleDiv5()">Close</button>
                                        </div>
                                    </div>
                                </div>

                                <div class="ass-crt-suf-popup">
                                    <div class="suf-header">INFO</div>
                                    <div style="padding: 2rem;">
                                        <!-- Payment Task Created in Asana Successfully. -->
                                        Youtube channel has been unlinked in RN & Subtask created.
                                    </div>
                                </div>
                                <div
                                    style="position: absolute;right: 5%;top: 20%;width: 30%;border-radius: 10px;overflow: hidden;border: 1px solid #bbb;display:none"id="email_done_div">
                                    <div style="padding: 10px; background: #0069d9;color: #fff">INFO</div>
                                    <div style="padding: 20px;">
                                        Email Sent Successfully
                                    </div>
                                </div>
                            </div>
                            <style>
                                .ass-crt-suf-popup {
                                    height: auto;
                                    width: 28rem;
                                    background-color: #fff;
                                    position: absolute;
                                    right: 6rem;
                                    top: 10%;
                                    border-radius: 8px;
                                    box-shadow: 0px 2px 7px 1px #dddddd96;
                                    display: none;
                                    overflow: hidden;
                                }

                                .ass-crt-suf-popup .suf-header {
                                    height: 3rem;
                                    width: 100%;
                                    background-color: #0069d9;
                                    color: #fff;
                                    padding: 12px 1rem;
                                    font-weight: bolder;
                                }

                                .ass-crt-suf-popup1 {
                                    height: auto;
                                    width: 28rem;
                                    background-color: #fff;
                                    position: absolute;
                                    right: 6rem;
                                    top: 10%;
                                    border-radius: 8px;
                                    box-shadow: 0px 2px 7px 1px #dddddd96;
                                    display: none;
                                    overflow: hidden;
                                }

                                .ass-crt-suf-popup1 .suf-header {
                                    height: 3rem;
                                    width: 100%;
                                    background-color: #0069d9;
                                    color: #fff;
                                    padding: 12px 1rem;
                                    font-weight: bolder;
                                }
                            </style>



                        </div>
                    </div>


                    <div style="display: flex;">
                        <div style="padding: 20px;position: relative; left: 1rem;" class="hover_div">



                            <span class="number half7" style=" "><span id="half7"
                                    style="color:black;font-weight: bold">7</span></span>



                            <svg class="div6done w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                viewBox="0 0 24 24"
                                style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                    d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                </path>
                            </svg>
                            <svg class="div6pending w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#fff"
                                viewBox="0 0 24 24"
                                style="position: absolute;z-index: 1;width: 18px;top: 35px;right: 20px;">
                                <path stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                    d="M12 13V8m0 8h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                            </svg>

                            <span class="hover_txt" id="div6text">Admin Action Needed</span>

                        </div>

                        <div style="padding: 20px;">
                            <span id="sentence_1" onclick="toggleDiv6()" style="font-size: medium;">Creating a
                                payment task</span>

                            <div style="width: 100%;display:flex;" id="div6_div">
                                <div id="div6" class="open_div"
                                    style="position:relative;display:grid;z-index:11;text-align: center;width: 100%; grid-template-columns: 1fr auto;">

                                    <div id="div6sub" style="width: 100%">

                                    </div>

                                    <div class="sou-pay-pupop" id="last">
                                        <div class="yt-header">
                                            <div class="flex items-center gap-2 justify-center">
                                                <div>All Activity in</div>
                                                <img src="https://smarthub.rn-test.com/images/asana_logo.svg"
                                                    alt="ansana" class="h-3">
                                            </div>
                                        </div>
                                        <div id="data-container1" class="space-y-3"
                                            style="height: 14rem;width: 100%;padding: 1.5rem;overflow:auto">

                                        </div>
                                        <div class="w-full">
                                            <div class="relative">
                                                <input type="text" id="texst_value1"
                                                    class="w-full pl-3 pr-10 py-2 bg-transparent placeholder:text-slate-400 text-slate-600 text-sm border border-slate-200 rounded-md transition duration-300 ease focus:outline-none focus:border-slate-400 hover:border-slate-300 shadow-sm focus:shadow"
                                                    placeholder="comments *" />

                                                <svg xmlns="http://www.w3.org/2000/svg" Onclick="comment_post1()"
                                                    width="16" height="16" fill="currentColor"
                                                    class="bi bi-send absolute w-5 h-5 top-2.5 right-2.5 text-slate-600"
                                                    viewBox="0 0 16 16">
                                                    <path
                                                        d="M15.854.146a.5.5 0 0 1 .11.54l-5.819 14.547a.75.75 0 0 1-1.329.124l-3.178-4.995L.643 7.184a.75.75 0 0 1 .124-1.33L15.314.037a.5.5 0 0 1 .54.11ZM6.636 10.07l2.761 4.338L14.13 2.576zm6.787-8.201L1.591 6.602l4.339 2.76z" />
                                                </svg>
                                            </div>
                                        </div>
                                        {{-- <div style="display: flex;align-items: baseline;gap: 1rem;">
                                            <input type="text" id="texst_value1" style="width: 85%;padding: 6px;"
                                                placeholder="comments *">
                                            <button
                                                style="background: #0069d9;padding: 7px 14px;border: none;border-radius: 6px;color: #fff;margin-top:1rem"
                                                Onclick="comment_post1()">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                                    fill="currentColor" class="bi bi-send" viewBox="0 0 16 16">
                                                    <path
                                                        d="M15.854.146a.5.5 0 0 1 .11.54l-5.819 14.547a.75.75 0 0 1-1.329.124l-3.178-4.995L.643 7.184a.75.75 0 0 1 .124-1.33L15.314.037a.5.5 0 0 1 .54.11ZM6.636 10.07l2.761 4.338L14.13 2.576zm6.787-8.201L1.591 6.602l4.339 2.76z" />
                                                </svg>
                                            </button>
                                        </div> --}}
                                    </div>
                                    <div class="ass-crt-suf-popup1">
                                        <div class="suf-header">INFO</div>
                                        <div style="padding: 2rem;">
                                            Payment Task Created in Asana Successfully.
                                            <!-- Youtube channel has been unlinked in RN & Subtask created. -->
                                        </div>
                                    </div>
                                </div>
                                <style>
                                    .box {
                                        width: 500px;
                                        height: 100px;
                                        border: dashed 5px #000;
                                        border-color: #4573d1 transparent transparent transparent;
                                        border-radius: 50%/100px 100px 0 0;
                                        rotate: 150deg;
                                        margin-left: -68px;
                                        left: 19px;
                                        margin-top: -85px;
                                        display: none;

                                    }
                                </style>




                                <div class="email_send_div" id="email_send_div"
                                    style="display: none;width: 500px;height: 150px;position: absolute;top: 20%;border: 1px solid;padding: 0;z-index: ;left: 50%;border-radius: 9px; box-shadow: 1px 1px 13px -3px #000;overflow: hidden;z-index: 1; background: #fff;">
                                    <div
                                        style="display: flex; justify-content: space-between;padding: 10px;background-color: #4573d1;color: #fff;font-weight: bold;z-index: 11111;position: relative;">
                                        <span>INFO</span>
                                        <span onclick="close_mail()" style="color: #fff">&times;</span>
                                    </div>

                                    <div style="padding: 40px;">
                                        Email Sent Successfully.
                                    </div>
                                </div>














                            </div>
                        </div>
                    </div>



                    <div id="divlasttext" style="display: none;">
                        <div style="padding: 20px;position: relative; left: 1rem;" class="hover_div">

                            <span class="number " style="background:#0069d9"><span
                                    style="color:white;font-weight: bold" id="divlasttextno">8</span></span>

                            <svg class="divlastdone w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                                xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="green"
                                viewBox="0 0 24 24"
                                style="position: absolute;z-index: 1;width: 20px;top: 35px;right: 20px;">
                                <path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                    d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z">
                                </path>
                            </svg>


                            <span class="hover_txt">Completed</span>

                        </div>

                        <div style="padding: 20px;">
                            <span id="textfinal" style=" font-weight: 600;font-size: medium;"></span>

                            <div style="width: 100%;display:flex;">




                            </div>
                        </div>
                    </div>

                    <div class="bar"
                        style="width: 6px;left: 52px;position: absolute;background-color: #0069d9;top: 98px;bottom: 65px;">
                    </div>
                    <div
                    style="display: flex;padding: 10px;justify-content: center;gap: 10px;background:#fff;margin-top: -1px;
                    mix-blend-mode: darken;
                    border-radius: 0 0 .3rem .3rem;">
                    <button id="approve" onclick="approve()"
                        class="!h-[2.5rem] w-max rounded-md bg-green-600 !py-2 !px-4 border border-transparent text-center text-sm text-white transition-all shadow-md hover:shadow-lg focus:bg-green-700 focus:shadow-none active:bg-green-700 hover:bg-green-700 active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none !ml-2 flex items-center gap-1 verfiyfsaa"
                        type="button">
                        <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                            xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"
                            viewBox="0 0 24 24">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M8.5 11.5 11 14l4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"></path>
                        </svg>
                        <div id="approvetext" class="font-sans text-xs">Approve and Assign it to Luna</div>
                    </button>
                    <button id="reject" onclick="reject()"
                        class="!h-[2.5rem] w-max rounded-md bg-red-600 !py-2 !px-4 border border-transparent text-center text-sm text-white transition-all shadow-md hover:shadow-lg focus:bg-red-700 focus:shadow-none active:bg-red-700 hover:bg-red-700 active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none !ml-2 flex items-center gap-1 verfiyfsaa"
                        type="button">
                        <svg class="w-6 h-6 text-gray-800 dark:text-white " aria-hidden="true"
                            xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
                            viewBox="0 0 24 24">
                            <path fill-rule="evenodd"
                                d="M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Zm7.707-3.707a1 1 0 0 0-1.414 1.414L10.586 12l-2.293 2.293a1 1 0 1 0 1.414 1.414L12 13.414l2.293 2.293a1 1 0 0 0 1.414-1.414L13.414 12l2.293-2.293a1 1 0 0 0-1.414-1.414L12 10.586 9.707 8.293Z"
                                clip-rule="evenodd"></path>
                        </svg>
                        <div id="rejecttext" class="font-sans text-xs">Reject</div>
                    </button>
                    <button id="request" onclick="request()"
                        class="!h-[2.5rem] w-max rounded-md bg-[#fcba03] !py-2 !px-4 border border-transparent text-center text-sm text-slate-800 transition-all shadow-md hover:shadow-lg focus:bg-amber-700 focus:shadow-none active:bg-amber-700 hover:bg-amber-700 active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none !ml-2 flex items-center gap-1 verfiyfsaa"
                        type="button">
                        <svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
                            xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
                            viewBox="0 0 24 24">
                            <path fill-rule="evenodd"
                                d="M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Zm7.707-3.707a1 1 0 0 0-1.414 1.414L10.586 12l-2.293 2.293a1 1 0 1 0 1.414 1.414L12 13.414l2.293 2.293a1 1 0 0 0 1.414-1.414L13.414 12l2.293-2.293a1 1 0 0 0-1.414-1.414L12 10.586 9.707 8.293Z"
                                clip-rule="evenodd"></path>
                        </svg>
                        <div id="rejecttext" class="text-white font-sans text-xs">Request Information</div>
                    </button>





                </div>
                </div>

                <style>
                    .ap_rej_btns {
                        padding: 5px 15px;
                        border: 1px solid;
                        border-radius: 8px;
                        color: #fff;
                    }
                </style>

                


            </div>

        </div>
        </div>
        </div>

        <!-- Modal HTML -->
        <div class="modal fade" id="mail" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document"
                style="max-width: 500px !important;left: 0 !important;transition: max-width 0.4s ease 0s;">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">INFO</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        Email sent successfully.
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" id="approvesend"
                            data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>




        <div class="modal fade" id="requestmail" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document"
                style="max-width: 500px !important;left: 0 !important;transition: max-width 0.4s ease 0s;">
                <div class="modal-content" style="width:122%">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">INFO</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <label class="modalabel">To:</label>
                        <label disabled="" class="login-form__input" id="requestto"> mcldevtest@gmail.com</label><br>
                        <label class="modalabel">Subject:</label>
                        <input class="login-form__input" type="text" name="Email" id="name" size="59px"
                            value="Closure - Request for more Information">
                        <br><br>
                        <label class="modalabel">Body:</label><br>
                        <div id="toolbar-request">
                        <span class="ql-formats">
                            <select class="ql-font"></select>
                            <select class="ql-size"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-bold"></button>
                            <button class="ql-italic"></button>
                            <button class="ql-underline"></button>
                            <button class="ql-strike"></button>
                        </span>
                        <span class="ql-formats">
                            <select class="ql-color"></select>
                            <select class="ql-background"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-header" value="1"></button>
                            <button class="ql-header" value="2"></button>
                            <button class="ql-header" value="3"></button>
                            <button class="ql-blockquote"></button>
                            <button class="ql-code-block"></button>
                            
                        </span>
                        <span class="ql-formats">
                            <button class="ql-list" value="ordered"></button>
                            <button class="ql-list" value="bullet"></button>
                            <button class="ql-indent" value="-1"></button>
                            <button class="ql-indent" value="+1"></button>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-direction" value="rtl"></button>
                            <select class="ql-align"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-link"></button>
                            <button class="ql-image"></button>
                            <button type="button" id="toggle-source" class="btn btn-sm btn-outline-secondary ml-2">
                                <svg viewBox="0 0 18 18"><polyline class="ql-even ql-stroke" points="5 7 3 9 5 11"></polyline><polyline class="ql-even ql-stroke" points="13 7 15 9 13 11"></polyline><line class="ql-stroke" x1="10" x2="8" y1="5" y2="13"></line></svg>
                            </button>
                        </span>
                    </div>


                    <div id="requestname" style="height: 200px;"></div>
                    <textarea id="request-source" style="display:none; width: 100%; height: 200px;border-radius: 0px !important;"></textarea>
                    </div>

                    <div class="modal-footer">
                        <button type="submit" class="btn btn-secondary login maill"
                            onclick="mailsent('request')">Send</button>
                        <button type="button" class="btn btn-secondary" id="approvesend"
                            data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>





        <div class="modal fade" id="rejectmail" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document"
                style="max-width: 500px !important;left: 0 !important;transition: max-width 0.4s ease 0s;">
                <div class="modal-content" style="width:122%">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">INFO</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <label class="modalabel">To:</label>
                        <label disabled="" class="login-form__input" id="rejectto"> </label><br>
                        <label class="modalabel">Subject:</label>
                        <input class="login-form__input" type="text" name="Email" id="name" size="59px"
                            value="Closure - Reject">
                        <br><br>
                        <label class="modalabel">Body:</label><br>
                        <div id="toolbar-reject">
                        <span class="ql-formats">
                            <select class="ql-font"></select>
                            <select class="ql-size"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-bold"></button>
                            <button class="ql-italic"></button>
                            <button class="ql-underline"></button>
                            <button class="ql-strike"></button>
                        </span>
                        <span class="ql-formats">
                            <select class="ql-color"></select>
                            <select class="ql-background"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-header" value="1"></button>
                            <button class="ql-header" value="2"></button>
                            <button class="ql-header" value="3"></button>
                            <button class="ql-blockquote"></button>
                            <button class="ql-code-block"></button>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-list" value="ordered"></button>
                            <button class="ql-list" value="bullet"></button>
                            <button class="ql-indent" value="-1"></button>
                            <button class="ql-indent" value="+1"></button>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-direction" value="rtl"></button>
                            <select class="ql-align"></select>
                        </span>
                        <span class="ql-formats">
                            <button class="ql-link"></button>
                            <button class="ql-image"></button>
                            <button type="button" id="toggle-reject-source" class="btn btn-sm btn-outline-secondary ml-2"><svg viewBox="0 0 18 18"><polyline class="ql-even ql-stroke" points="5 7 3 9 5 11"></polyline><polyline class="ql-even ql-stroke" points="13 7 15 9 13 11"></polyline><line class="ql-stroke" x1="10" x2="8" y1="5" y2="13"></line></svg></button>
                        </span>
                    </div>

                    <div id="rejectname" style="height: 200px;"></div>
                 <textarea id="reject-source" style="display:none; width: 100%; height: 200px; border-radius: 0px !important;"></textarea>
                    </div>

                    <div class="modal-footer">
                        <button type="submit" class="btn btn-secondary login maill"
                            onclick="mailsent('reject')">Send</button>
                        <button type="button" class="btn btn-secondary" id="approvesend"
                            data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>




        <div class="modal fade" id="mailsentinfo" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document"
                style="max-width: 500px !important;left: 0 !important;transition: max-width 0.4s ease 0s;">
                <div class="modal-content" style="">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">INFO</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        Email sent successfully.
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" id="approvesend"
                            data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>








        <!-- Modal HTML -->
        <div class="modal fade" id="approvemodal" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content" style="width:130%">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">
                            INFO</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="modal-body">
                            <input type="hidden" id="approveto">
                            Account Closure Request Is Approved..
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" id="approvesend"
                                data-dismiss="modal">Close</button>
                        </div>

                    </div>
                </div>
            </div>
        </div>






        <!-- Modal HTML -->
        <div class="modal fade" id="viewpop" tabindex="-1" role="dialog" aria-labelledby="customPopupLabel"
            aria-hidden="true">
            <div class="modal-dialog" style="margin-right: auto;" role="document">
                <div class="modal-content" style="width: auto !important;">
                    <div class="modal-header">
                        <h5 style="color: white;" class="modal-title" id="customPopupLabel">Account Closure Form
                            Details</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true" style="color: white;">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <!-- <div style="right: 10px;position: absolute;"><a id="exportdata" href="">
                                <img title="Export PDF" src="{{ asset('images/upload.png') }}"
                                    style="width: 30px;border-radius: 50%;box-shadow: 0 0 10px #bbb;"></a></div> -->
                        <div>
                            <label class="modalabel">Email:</label>
                            <label disabled class="login-form__input" id="email"> </label>
                        </div>
                        <div><label class="modalabel">Username:</label>
                            <label disabled class="login-form__input" id="username"> </label>
                        </div>
                        <div> <label class="modalabel">User ID:</label>
                            <label disabled class="login-form__input" id="userID"> </label>
                        </div>
                        <hr style="margin-top: 0rem !important;">
                        <div><label class="modalabel">Would you like to wait for your final sales report or close your
                                account immediately?
                            </label><br></div>
                        <div> <label disabled class="login-form__input" id="would_you_like_to_wait"> </label></div>
                        <hr style="margin-top: 0rem !important;">
                        <div><label class="modalabel">Were you satisfied with RouteNote?
                            </label></div>
                        <div><label disabled class="login-form__input" id="rating"> </label></div>
                        <hr style="margin-top: 0rem !important;">
                        <div> <label class="modalabel">Why have you decided to close your account?
                            </label></div>
                        <label disabled class="login-form__input" id="reason"> </label>
                        <hr style="margin-top: 0rem !important;">


                        <div>
                            <div id="elaborate_reason_label" style="display:none; "><label class="modalabel">To help us
                                    improve, could you please elaborate?</label><br>
                                <label style="position: relative;" disabled class="login-form__input"
                                    id="elaborate_reason">
                                </label>
                                <hr style="margin-top: 0rem !important;">
                            </div>

                            <div id="other_distrubutor_label" style="display:none; ">
                                <label class="modalabel">Where are you heading?</label><br>
                                <label style="position: relative;" disabled class="login-form__input"
                                    id="other_distrubutor">
                                </label>
                                <hr style="margin-top: 0rem !important;">
                            </div>
                        </div>

                        <div style=" "><label class="modalabel">Before you go, is there
                                anything you'd like to suggest to improve the RouteNote experience?</label></div>
                    </div>

                    <div><label style="left: 17px;position: relative;" disabled class="login-form__input" id="comments">
                        </label></div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>

            </div>
        </div>
        </div>







        </div>
        </div>
        <!-- Full Container End -->


        </div>


    </body>




    <script>
        $(document).ready(function() {

            // $('#SoundCloud').click(function() {
            //     $('.modal-dialog').css('left', '-10%');
            //     $('.modal-dialog').css('max-width', '70%');
            //     $('.modal-dialog').css('transition', 'max-width 0.4s ease');
            //     $('#unlink_mail').css('width', '35%');
            //     $('#unlink_mail').css('position', 'absolute');
            //     $('#unlink_mail').css('top', '-19%');
            //     $('#unlink_mail').css('right', '5%');
            //     $('#unlink_mail').css('text-align', 'left');
            //     $('#unlink_mail').css('display', 'block');


            //     $('#div5').css('width', '50%');
            // });




            $('#SoundCloud').click(function() {



                $.ajax({
                    type: 'GET',
                    data: {
                        formid: $('#formid').val(),
                        // soundcloudto:$('#soundcloudto').text(),
                        // soundcloudtotext:$('#soundcloudtotext').text()
                    },
                    url: 'https://smarthub.rn-test.com/verifysoundlink',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    success: function(response) {
                        // alert(response.gid3);
                        $('#gid3').text(response.gid3);
                        $('#div5pending').css('display', 'none');
                        $('#div5done').css('display', 'block');
                        $('.half5').css('background',
                            'linear-gradient(to right, #ccc 50%, #0069d9 50%)');
                        $('#half5').css('color', '#fff');
                        $('#unlink_mail').css('display', 'none');
                        $('#div5').css('width', '100%');

                        $('.all_releases').hide();
                        $('.primium_release').hide();
                        $('.approve_sale_completed').css('display', 'none');


                        $('#SoundCloud').hide();
                        $('#chanel_link').hide();
                        $('#chanel_unlink').toggle();

                        if ($('#gid1').text() != '') {
                            $('#number6div').css('background', '#ccc');
                            $('#div6number').css('color', '#000');
                            $('#div5text').text('Admin Action Completed');

                        } else {
                            $('#number6div').css('background', '#ccc');
                            $('#div6number').css('color', '#000');
                            $('#div5text').text('Admin Action needed');

                        }

                        // $('#email_done_div').show();

                        setTimeout(function() {
                            // $('#email_done_div').hide();
                            $('#div5').css('width', '100%');
                            $('.exelen_half5').css('display', 'none');
                            $('.tick_half5').css('display', 'block');
                            $('.approve_sale_completed').css('display', 'none');
                            $('#approve_sale').css('opacity', '0');
                            $('.request_conf').css('opacity', '0');
                            $('.modal-dialog').css('max-width', '500px');
                            $('.modal-dialog').css('transition', 'max-width 0.4s ease');
                        }, 2000);
                    }
                })
            });





            $('#send1').click(function() {
                $('.earning_untick').css('display', 'none');
                $('.earning_tick').css('display', 'block');
                $('#earning_untick').css('display', 'none');
                $('#earning_tick').css('opacity', '1');
            });

        });
    </script>
@endsection