     <!--New Chat Section Modal HTML -->
     <div id="newchatModal" class="modal rbt-modal-box copy-modal fade" tabindex="-1">
         <div class="modal-dialog modal-dialog-centered">
             <div class="modal-content wrapper">
                 <div class="section-title text-center mb--30 sal-animate" data-sal="slide-up" data-sal-duration="400"
                     data-sal-delay="150">
                     <h3 class="title mb--0 w-600">Unlock the power of AI</h3>
                 </div>
                 <div class="genarator-section">
                     <ul class="genarator-card-group">
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/text.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Text Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.image.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/photo.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Image Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.image.editor') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/photo.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Photo Editor</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.code.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/code-editor.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Code Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/text-voice.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Text to speech</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/voice.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Speech to text</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.video.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/video-camera.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Vedio Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card disabled"
                                 tabindex="-1">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/website-design.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Website Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <span class="rainbow-badge-card">Coming</span>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.code.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/code-editor.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">HTML Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card disabled"
                                 tabindex="-1">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/document.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Chat with Documents</h5>
                                     </div>
                                     <div class="right-align">
                                         <span class="rainbow-badge-card">Coming</span>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.email.generator') }}" class="genarator-card">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/email.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Email Writer</h5>
                                     </div>
                                     <div class="right-align">
                                         <div class="icon-bar"><i class="fa-sharp fa-solid fa-arrow-right"></i></div>
                                     </div>
                                 </div>
                             </a>
                         </li>
                         <li>
                             <a href="{{ route('tools.text.generator') }}" class="genarator-card disabled"
                                 tabindex="-1">
                                 <div class="inner">
                                     <div class="left-align">
                                         <div class="img-bar">
                                             <img src="{{ asset('assets/images/generator-icon/lyrics.png') }}"
                                                 alt="AI Generator">
                                         </div>
                                         <h5 class="title">Lyrics Generator</h5>
                                     </div>
                                     <div class="right-align">
                                         <span class="rainbow-badge-card">Coming</span>
                                     </div>
                                 </div>
                             </a>
                         </li>
                     </ul>
                 </div>
                 <button class="close-button" data-bs-dismiss="modal">
                     <i class="fa-sharp fa-regular fa-x"></i>
                 </button>
             </div>
         </div>
     </div>

     <!--Like Section Modal HTML -->
     <div id="likeModal" class="modal rbt-modal-box like-modal fade" tabindex="-1">
         <div class="modal-dialog modal-dialog-centered">
             <div class="modal-content wrapper">
                 <h5 class="title">Provide additional feedback</h5>
                 <div class="chat-form">
                     <div class="text-form">
                         <textarea rows="6" placeholder="Send a message..."></textarea>
                     </div>
                 </div>
                 <div class="bottom-btn mt--20">
                     <a class="btn-default btn-small round" href="#">Send Feedback</a>
                 </div>
                 <button class="close-button" data-bs-dismiss="modal">
                     <i class="fa-sharp fa-regular fa-x"></i>
                 </button>
             </div>
         </div>
     </div>

     <!--DisLike Section Modal HTML -->
     <div id="dislikeModal" class="modal rbt-modal-box dislike-modal fade" tabindex="-1">
         <div class="modal-dialog modal-dialog-centered">
             <div class="modal-content wrapper">
                 <h5 class="title">Why do you like this response?</h5>
                 <select class="form-select" multiple aria-label="multiple select example">
                     <option selected>Irrelevant</option>
                     <option value="2">Offensive</option>
                     <option value="3">Not Correct</option>
                 </select>
                 <div class="chat-form">
                     <h6 class="title">Provide your feedback</h6>
                     <div class="text-form">
                         <textarea rows="6" placeholder="Send a message..."></textarea>
                     </div>
                 </div>
                 <div class="bottom-btn mt--20">
                     <a class="btn-default btn-small round" href="#">Send Feedback</a>
                 </div>
                 <button class="close-button" data-bs-dismiss="modal">
                     <i class="fa-sharp fa-regular fa-x"></i>
                 </button>
             </div>
         </div>
     </div>

     <!--Share Section Modal HTML -->
     <div id="shareModal" class="modal rbt-modal-box share-modal fade" tabindex="-1">
         <div class="modal-dialog modal-dialog-centered">
             <div class="modal-content wrapper modal-small">
                 <h5 class="title">Share</h5>
                 <ul class="social-icon social-default transparent-with-border mb--20">
                     <li data-sal="slide-up" data-sal-duration="400" data-sal-delay="200"><a
                             href="https://www.facebook.com/">
                             <i class="fa-brands fa-facebook-f"></i>
                         </a>
                     </li>
                     <li data-sal="slide-up" data-sal-duration="400" data-sal-delay="300"><a
                             href="https://www.twitter.com">
                             <i class="fa-brands fa-twitter"></i>
                         </a>
                     </li>
                     <li data-sal="slide-up" data-sal-duration="400" data-sal-delay="400"><a
                             href="https://www.instagram.com/">
                             <i class="fa-brands fa-instagram"></i>
                         </a>
                     </li>
                     <li data-sal="slide-up" data-sal-duration="400" data-sal-delay="500"><a
                             href="https://www.linkdin.com/">
                             <i class="fa-brands fa-linkedin-in"></i>
                         </a>
                     </li>
                 </ul>
                 <div class="chat-form">
                     <div class="text-form d-flex align-items-center">
                         <input type="text" class="copy-link-input" value="https://www.youtube.com/" readonly>
                         <button class="btn-default bg-solid-primary" type="submit">Copy</button>
                     </div>
                 </div>
                 <button class="close-button" data-bs-dismiss="modal">
                     <i class="fa-sharp fa-regular fa-x"></i>
                 </button>
             </div>
         </div>
     </div>
