@extends('front.layout.app')
@section('content')

<style>
@media only screen and (min-width: 300px) and (max-width: 519px) {
  .hbd h2 {
    font-size: 17px !important;
  }
    
}
  .height {
    height: 100vh;
    padding-top: 180px;
}
label {
    display: inline-block;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    color: #fff;
    font-weight: 400;
    background-color: #ffab00;
    padding: 10px 25px;
    font-weight: 600;
    outline: none;
    border: 0;
    cursor: pointer;
}
.video_main_section .flex_dire {
    display: flex;
    padding-top: 15px;
    align-items: center;
    justify-content: center;
}
.hbd h2 {
    text-transform: uppercase;
    padding: 8px 0;
    position: relative;
    font-family: "Poppins", sans-serif;
    transition: 0.5s;
    font-size: 50px;
    color: #ffab00;
    font-weight: 500;
    text-align: center;
    margin-bottom: 60px;
}
.video_main_section .flex_dire {
    display: flex;
    padding-top: 15px;
    align-items: center;
    justify-content: center;
}
</style>

<section class="video_main_section height  mt-3">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12 hbd">
                    <h2>Payment has been recevied. You may now download the file!</h2>
                </div>
                <div class="col-12 col-sm-12 col-md-10">
                    <div class="col-12">
                        <video autoplay="autoplay" controls="">
                            <source src="{{ url('assets/admin/videos/'.$video->video) }}" class="img-fluid">
                        </video>
                    </div>

                    <div class="col-12">
                        <div class="flex_dire">
                            <form action="http://localhost/fitkatie/public/paypal/handle-payment">
                                <input type="hidden" name="amount" value="{{ $video->price }}">
                                <input type="hidden" name="video_id" value="{{ $video->id }}">
                                <label for="radioId">Download video</label>
                                <input type="radio" hidden id="radioId" value="{{ url('paypal/videos/download/'.encrypt($video->id)) }}">
                                <a href="" hidden type="submit" class="btnn" id="clickDynamic">Download Now</a>
                            </form>
                        </div>

                   

                        <div class="flex_dire">
                            <p>
                            
                            </p>
                        </div>
                    </div>

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

<script>

document.getElementById('radioId').addEventListener('click', function() {
    // window.location.href = this.href;
    var newUrl = this.value;
    var clickDynamic = document.getElementById('clickDynamic');
    clickDynamic.href=newUrl;
    clickDynamic.click();

    setTimeout(() => {
        
        window.location.replace("https://fitkatiekarr.com");
    
    }, 10000);
});

</script>

@endsection