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

{% block title %}{{ 'lang.myAccount'|trans }}{% endblock %}

{% block styles %}
    <style>
        #background {
            background-image: url('{{ asset('images/car.png') }}');
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
        }
    </style>
{% endblock %}

{% block body %}
    <div class="container p-0 h-100 h-md-auto">
        <div class="{{ license_data ? '' : 'col-12 col-md-6' }} h-100 h-md-auto p-4 m-md-5 border-radius-container background-trans">
            <div class="row">
                <div class="{{ license_data ? 'col-12 col-md-6' : 'col-12' }} p-4">
                    <h4 class="mb-5">
                        {{ 'lang.licenseInformation'|trans }}
                    </h4>

                    {% if license_data is empty %}
                        <p>
                            {{ 'lang.licenseType'|trans }}: <span
                                    class="float-end">{{ license_type|getLicenseType }}</span>
                        </p>
                    {% endif %}

                    <p>
                        {{ 'lang.licenseOwner'|trans }}: <span class="float-end">{{ license_user }}</span>
                    </p>

                    {% if license_data %}
                        <p>
                            {{ 'lang.licenseType'|trans }}:
                            <span class="float-end">
                                {{ license_type|getLicenseType() }}
                                {% if license_data.isTrial %}
                                    ( {{ 'lang.trialPeriod' | trans }} )
                                {% endif %}
                            </span>
                        </p>
                        <p>
                            {{ 'lang.validFrom'|trans }}:
                            <span class="float-end">
                                {{ license_data.validFrom|date('d.m.Y') }}
                            </span>
                        </p>
                        <p>
                            {{ 'lang.validUntil'|trans }}:
                            <span class="float-end">
                                {{ license_data.validUntil|date('d.m.Y') }}
                            </span>
                        </p>


                        <hr class="d-none d-md-block">
                    {% endif %}
                    <div class="display-flex-start d-none d-md-flex mt-5">
                        <a href="{{ path('app_price') }}" class="btn button button-gradient button-lg">
                            {% if license == "free" %}
                                {{ 'lang.updatePlan' | trans }}
                            {% endif %}

                            {% if license == 'pro' %}
                                {{ 'lang.changePlan' | trans }}
                            {% endif %}

                            {% if license == 'business' %}
                                {{ 'lang.changePlan' | trans }}
                            {% endif %}
                        </a>
                    </div>
                </div>
                <hr class="d-block d-md-none">


                {% if license_data %}
                    {% if payment %}
                        <div class="col-12 col-md-6 p-4 custom-left-border">
                            <div class="display-flex-between mb-4">
                                <h4>{{ 'lang.paymentInformation'|trans }}</h4>
                                <a class=""
                                   href="{{ path('app_payment_information_edit', { id: id }) }}">
                                    <svg class="" width="24" height="24" viewBox="-6 -6 50 50" fill="currentColor"
                                         xmlns="http://www.w3.org/2000/svg">
                                        <path fill-rule="evenodd" clip-rule="evenodd"
                                              d="M20.6704 7.99651L26.5883 2.07861C27.9216 0.74528 28.5883 0.0786133 29.4167 0.0786133C30.2451 0.0786133 30.9118 0.74528 32.2451 2.07861L34.9216 4.7551C36.2549 6.08843 36.9216 6.75509 36.9216 7.58352C36.9216 8.41195 36.2549 9.07861 34.9216 10.4119L29.0486 16.285C25.595 14.2634 22.7166 11.4063 20.6704 7.99651ZM19.2161 9.45072L3.18973 25.4771C2.76467 25.9022 2.55214 26.1147 2.4124 26.3758C2.27267 26.6369 2.21372 26.9317 2.09583 27.5211L0.397104 36.0148C0.330582 36.3474 0.297321 36.5137 0.391929 36.6083C0.486537 36.7029 0.652842 36.6696 0.985452 36.6031L9.4791 34.9044C10.0686 34.7865 10.3633 34.7275 10.6244 34.5878C10.8855 34.4481 11.098 34.2355 11.5231 33.8105L27.5906 17.7429C24.1878 15.6573 21.3236 12.8133 19.2161 9.45072Z"
                                              fill="currentColor"></path>
                                    </svg>
                                </a>
                            </div>
                            <div class="mb-4"></div>

                            <p class="">
                                {{ 'lang.accountHolder'|trans }}: <span
                                        class="float-end">{{ payment.accountHolder }}</span>
                            </p>
                            <p>
                                {{ 'lang.bank'|trans }}: <span class="float-end">{{ payment.bank }}</span>
                            </p>
                            <p>
                                {{ 'lang.iban'|trans }}: <span class="float-end">{{ payment.iban }}</span>
                            </p>
                            <p>
                                {{ 'lang.bic'|trans }}: <span class="float-end">{{ payment.bic }}</span>
                            </p>
                            <p>
                                {{ 'lang.paymentInterval'|trans }}: <span
                                        class="float-end">{{ payment.paymentInterval|getPaymentInterval }}</span>
                            </p>
                            <p>
                                {{ 'lang.directDebit'|trans }}: <span
                                        class="float-end">{{ payment.agreeDirectDebit ? 'lang.yes'|trans : 'lang.no'|trans }}</span>
                            </p>
                        </div>
                    {% endif %}
                {% endif %}
                <div class="display-flex-center d-flex d-md-none mt-3 mb-3">
                    <a href="{{ path('app_price') }}" class="btn  button button-gradient button-lg">
                        {% if license == "free" %}
                            {{ 'lang.updatePlan' | trans }}
                        {% endif %}

                        {% if license == 'pro' %}
                            {{ 'lang.changePlan' | trans }}
                        {% endif %}

                        {% if license == 'business' %}
                            {{ 'lang.changePlan' | trans }}
                        {% endif %}
                    </a>
                </div>
            </div>
        </div>
    </div>



{% endblock %}


{% block javascripts %}
    {{ encore_entry_script_tags('license') }}
{% endblock %}