<!-- code by @pv200-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="/images/candlestick.png">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Black+Ops+One&family=Lobster&display=swap" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Kalam&display=swap" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Rajdhani&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Tulpen+One&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Monoton&display=swap" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Stint+Ultra+Condensed&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="/css/style.css">
    <title>FinanceCraft</title>
    
</head>
<body class="user-page-body">
    <div class="navbar-div-user">
        <nav class="navbar navbar-expand-lg bg-body-tertiary">
            <div class="container-fluid">
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarNavDropdown">
                    <ul class="navbar-nav">
                    <li class="nav-text">
                        <a class="nav-link nav-text-inner" href="/home">Home</a>
                    </li>
                    <li class="nav-text">
                        <a class="nav-link" href="/analyse">Analyse</a>
                    </li>
                    <li class="nav-text">
                        <a class="nav-link" href="/predict">Predict</a>
                    </li>
                    <li class="nav-text">
                        <a class="nav-link" href="/guide">Guide</a>
                    </li>
                    <li class="nav-text">
                        <a class="nav-link" href="/feedback">Feedback</a>
                    </li>
                    </ul>
                </div>
            </div>
        </nav>
        <div class="user-div">
            <div class="User-h1">
                <br>
                <h1>USER FEEDBACK</h1>


            </div>
            <div class="span-h1">
                
                <span>Your thoughts matter! Share your feedback and help us shine.</span>
            </div>
            <div class="img-user">
                <img src="/images/feedbackformpic.gif" class="img-1-user" >
            </div>
            <br>
            <br>
            <a class="button-c-2" href="#feedback-part">Give Feedback</a>
            <br>
            <br>
            <br>

        </div>
    </div>
    
    <section id="feedback-part">
        <div class="feedback-1">
            
            
            <div class="feedback-1-container">

                <h1>We Value Your Feedback !!</h1>

            </div>
            
            <div class="feedback-2-container">
                <br>
                <div class="feed-form">
                    <div class="feedback-pd">
                
                        <h2>Personal Details :</h2>
                    </div>
                    <br>

                    <div class="tab-name">
                        <div class="ps-c-1"><h2>Name :</h2></div>
                        <p><input placeholder="First name..." oninput="this.className = ''" name="fname" id="input-n"></p>
                        <p><input placeholder="Last name..." oninput="this.className = ''" name="lname" id="input-n"></p>
                    </div>
                    <div class="tab-contact">
                        <div class="ps-c-1"><h2>Contact-Info :</h2></div>
                        <p><input placeholder="E-mail..." oninput="this.className = ''" name="email" id="input-n"></p>
                        <p><input placeholder="Phone..." oninput="this.className = ''" name="phone" id="input-n"></p>
                    </div>
                    <hr class="hr-user">
                    <div class="rating-sec">
                        <div class="feedback-sye">
                            
                            <h2>Share Your Experience</h2>
                        </div>
                    
                        <div class="question-feed">
                            <br>
                            <div>
                            <h2>Rate your overall experience out of five while using our website.</h2>
                            </div>
                            
                            <div class="rate-div">
                                <select id="rate" name="rate">
                                    <option value="0" id="scroller">0</option>
                                    <option value="1" id="scroller">1</option>
                                    <option value="2" id="scroller">2</option>
                                    <option value="3" id="scroller">3</option>
                                    <option value="4" id="scroller">4</option>
                                    <option value="5" id="scroller">5</option>
                                </select>
                            </div>
                        </div>
                
                        <div class="question-feed">
                            <br>
                            <div>
                            <h2>How much you rate the accuracy level of our prediction functionality out of five ? </h2>
                            </div>
                            <div class="rate-div">
                                <select id="rate" name="rate">
                                    <option value="0" id="scroller">0</option>
                                    <option value="1" id="scroller">1</option>
                                    <option value="2" id="scroller">2</option>
                                    <option value="3" id="scroller">3</option>
                                    <option value="4" id="scroller">4</option>
                                    <option value="5" id="scroller">5</option>
                                </select>
                            </div>
                        </div>
                        <div class="question-feed">
                            <br>
                            <div>
                            <h2>How much you rate our guide section and analysis section out of five ? </h2>
                            </div>
                            <div class="rate-div">
                                <select id="rate" name="rate">
                                    <option value="0" id="scroller">0</option>
                                    <option value="1" id="scroller">1</option>
                                    <option value="2" id="scroller">2</option>
                                    <option value="3" id="scroller">3</option>
                                    <option value="4" id="scroller">4</option>
                                    <option value="5" id="scroller">5</option>
                                </select>
                            </div>
                        </div>
                </div>
                <hr class="hr-user">
                <div class="suggestions-feed">
                    <br>
                    <div>
                    <h2>Do you have any suggestions for how we can enhance our website and services?</h2>
                    </div> 
                    <div class="suggest">
                        <p class="suggest-p"><input placeholder="plz give your valuable suggestions here........." oninput="this.className = ''" name="Suggestion" type="text" id="input-s"></p>
                    </div>        
                    </div>
                    <div>
                        <input type="submit" id="btn-feedback-submit" onclick="function()">
                    </div>
                    <br>
                    <div id="thankyoumessage">Thank you for your feedback!!</div>

                    <br>
                </div>
            </div>


        </div>
    </section>
    <script src="Feedbackform.js"></script>
</body>
</html>

<footer class="footer">
    <h4 class="footer-heading">FinanceCraft</h4>
    <hr class="footer-hr">
    <p class="footer-subheading">LEARN . ANALYSE . PREDICT</p>
    <p class="footer-txt">Stay ahead of the market trends, make informed decisions, and maximize your returns. Join us in shaping your financial success today.</p>
    <p class="footer-txt">. . .</p>
    <div class="footer-icon">
        <img src="/images/icons8-gmail-50.png">
        <img src="/images/i.png">
        <img src="/images/icons8-linkedin-50.png">
    </div>

</footer>
