{% extends 'App::base.html.twig' %}

{% block title %}Premium{% endblock %}

{% block stylesheets %}

	<link href="https://fonts.googleapis.com/css?family=Nunito&display=swap" rel="stylesheet"> 
	<style>
		.radio input {

			margin-left: 10px;

		}
		.mandatory-star {
			color: red;
			font-size: 25px;
		}
		.mandatory-text {
			color: red;
		}
		.h1_style {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
			font-size: 40px;
			color: #3498db;
		}
		.price_style {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
			font-size: 50px;			
		}
		.h2_style {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
			font-size: 30px;
			color: #353b48;
		}

		.btn-custom {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
			font-size: 22px;
			color: white;			
		}

		.pricing-font {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
		}
		.btn-custom-free {
			font-family: 'Nunito';
			font-style: normal;
			font-weight: 900;
			font-size: 22px;
			color: #2980b9;			
		}
		.front_page_blur{
			display:none;
		}
		.slideAnim {
			display:block;
		  	animation-name: slide;
		  	animation-duration: 2s;
		}
	</style>
	
{% endblock %}

{% block body %}
	
	{% if app.user.profile %}
      	<div class="d-flex align-items-center p-3 my-3 bg-green rounded box-shadow">
	      	{% if app.user.profile and app.user.profile.avatar and app.user.profile.avatar.path %}
	        	<img class="mr-3" src="/uploads/avatar/{{ app.user.profile.avatar.path }}" alt="{{ app.user.profile.firstname }} {{ app.user.profile.lastname }}" width="48" height="48">
			{% else %}
	        	<img class="mr-3" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcTrxwZhuShcQieycZ7U7thuj9cmUESbEffhVLc_EsxRJCLPDr7NUA" alt="{{ app.user.profile.firstname }} {{ app.user.profile.lastname }}" width="48" height="48">
			{% endif %}

	        <div class="lh-100">
		        {% if app.user.profile %}
			          <h6 class="mb-0 lh-100">{{ app.user.profile.firstname }} {{ app.user.profile.lastname }}</h6>
			          <small>Membre depuis {{ app.user.created|date('Y') }}</small>
		        {% endif %}
	        </div>
      	</div>
    {% endif %}

      <div class="my-3 p-3 bg-white rounded box-shadow">

        <h6 class="border-bottom border-gray pb-2 mb-0"><span data-feather="zap"></span> Devenez Premium !</h6>

		<div class="row">
			<div class="col-md-12">

		        <div class="text-center">
			        <div class="h1_style">Paiement accepté</div>
			        <div class="h2_style">Votre paiement a été accepté.</div>
			        <hr />
			        <div><a href="{{ path('app_setting_index') }}" class="btn btn-lg btn-success">Retourner sur le tableau de bord</a></div>
			    </div>

			</div>
		</div>




      </div>



{% endblock body %}

{% block javascripts %}

	<script>
		function open_pricing(){
		  //document.getElementById('front_page_blur').classList.add('slideAnim'); 
		  $( "#front_page_blur" ).slideDown( "slow", function() {
		    // Animation complete.
		  });  
		}
	</script>
{% endblock %}