@extends('cabMeWebsite.master')
<title>Feedback</title>
<style>

    .hide {
        display: none;
    }

    .clear {
        float: none;
        clear: both;
    }

    .rating {
        width: 90px;
        unicode-bidi: bidi-override;
        direction: rtl;
        text-align: center!important;
        position: relative;
    }

    .rating > label {
        float: right;
        display: inline;
        padding: 0;
        margin: 0;
        position: relative;
        width: 1.1em;
        cursor: pointer;
        color: #000;
    }

    .rating > label:hover,
    .rating > label:hover ~ label,
    .rating > input.radio-btn:checked ~ label {
        color: transparent;
    }

    .rating > label:hover:before,
    .rating > label:hover ~ label:before,
    .rating > input.radio-btn:checked ~ label:before,
    .rating > input.radio-btn:checked ~ label:before {
        content: "\2605";
        position: absolute;
        left: 0;
        color: #FFD700;
    }

</style>
@section('content')
    <section class="search-cab">

    <div class="container">
        <div class="col-12">
            <div class="row">
                <div class="feedback text-center ml-auto mr-auto">
                    <form class="feedbackForm" id="formdata" method="post">
                        <div class="row">
                            <a class="theme-text back-to-trip float-right" id="skipReview" name="skip" style="text-decoration: underline" href="{{url('/')}}">Skip</a>
                        </div>
                        <div id="response">
                        </div>

                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                        <input class="form-control" type="hidden" name="user_id" id="user_id" value="{{$_SESSION['userid']}}"  />
                        <input class="form-control" type="hidden" name="rider_id" id="rider_id" value=""  />
                        <input class="form-control" type="hidden" name="driver_id" id="driver_id" value=""  />
                        <input class="form-control" type="hidden" name="ride_id" id="ride_id" value=""  />
                        <input class="form-control" type="hidden" name="review_for" id="review_for" value=""  />


                        <p>How was your trip<br />with <lable id="driver_name"></lable>?</p>
                        <div class="deiver_img" id="driver_img">

                        </div>
                        <div class="rating">
                            <input id="star5" name="stars" type="radio" value="5" class="radio-btn hide stars" />
                            <label for="star5" >☆</label>
                            <input id="star4" name="stars" type="radio" value="4" class="radio-btn hide stars" />
                            <label for="star4" >☆</label>
                            <input id="star3" name="stars" type="radio" value="3" class="radio-btn hide stars" />
                            <label for="star3" >☆</label>
                            <input id="star2" name="stars" type="radio" value="2" class="radio-btn hide stars" />
                            <label for="star2" >☆</label>
                            <input id="star1" name="stars" type="radio" value="1" class="radio-btn hide stars" />
                            <label for="star1" >☆</label>
                            <div class="clear"></div>
                        </div>

                        <textarea class="my-2 my-sm-3 form-control" id="comment" name="comments" placeholder="Write Your Review"></textarea>
                        <input class="theme-btn-small btn-block mt-25 mt-md-5" id="sendReview" type="button" value="Send" />
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
    <script type="text/javascript">
        var base_url = '