{% set title = item|os_trans("label") %}
{% set desc = item|os_trans("target") %}
{% set menu = 'digital' %}
{% if item.banner %}
{% set thumbnail = item.banner.thumbnail %}
{% set banner = asset(item.banner.file) %}
{% endif %}

{% extends 'Default/base.html.twig' %}
{% import "Macros/smallInfo.html.twig" as smallInfo %}
{% import "Macros/card.html.twig" as card %}

{% block content %}
<div class='{{desktop("gpadding vt-40-in")}} {{mobile("gpadding vt-30-in")}} '>
    <div class='{{desktop("flex row space top")}} {{mobile("")}}'>
        <aside class="{{desktop('third right-80 vt-20-in')}} {{mobile('vt-20-in hz-15-in')}}">
            {{card.render(item,1)}}
        </aside>
        <div id='article' class='w100 flex row wrap top left {{desktop("")}} {{mobile("vt-20-in")}}'>
            <div class="w100 flex row wrap left">
                {{smallInfo.render("Coût"|os_trans("Cost"),item.cost)}}
                {{smallInfo.render("Coût d'acquisition"|os_trans("Acquisition cost"),item.acquisitionCost)}}
                {{smallInfo.render("Validité"|os_trans("Validity"),item.validity)}}
                {{smallInfo.render("Cible"|os_trans("target"),item|os_trans("target")|markdown_to_html)}}
                {{smallInfo.render("Opérations"|os_trans("Operations"),item|os_trans("operations")|markdown_to_html)}}

                <h5 class="h6 medium top-20">{{"Limites de retrait"|os_trans("Withdrawal limits")}}</h5>
                {{smallInfo.render("Par opération"|os_trans("per operation"),item.transactionWithdrawalLimit)}}
                {{smallInfo.render("Par jour"|os_trans("per day"),item.dayWithdrawalLimit)}}
                {{smallInfo.render("Par mois"|os_trans("per month"),item.monthWithdrawalLimit)}}

                <h5 class="h6 medium top-20">{{"Nombres de retrait"|os_trans("Withdrawal numbers")}}</h5>
                {{smallInfo.render("par jour"|os_trans("per day"),item.dayMaximumWithdrawal)}}
                {{smallInfo.render("par mois"|os_trans("êr month"),item.monthMaximumWithdrawal)}}

                <h5 class="h6 medium top-20">{{"Coûts de retrait"|os_trans("Withdrawal costs")}}</h5>
                {{smallInfo.render("Réseau NSIA"|os_trans("NSIA Network"),item.nsiaWithdrawalCost)}}
                {{smallInfo.render("Réseau GIM"|os_trans("GIM Network"),item.gimWithdrawalCost)}}
                {{smallInfo.render("Réseau VISA"|os_trans("VISA Network"),item.visaWithdrawalCost)}}

                <h5 class="h6 medium top-20">{{"Limites de paiement"|os_trans("Payment limits")}}</h5>
                {{smallInfo.render("par opération"|os_trans("per operation"),item.transactionPaymentLimit)}}
                {{smallInfo.render("par jour"|os_trans("per day"),item.dayPaymentLimit)}}
                {{smallInfo.render("par mois"|os_trans("per month"),item.monthPaymentLimit)}}

                {% if item.dayPaymentNumber and item.monthPaymentNumber %}
                <h5 class="h6 medium top-20">{{"Nombres de paiement"|os_trans("Payments numbers")}}</h5>
                {{smallInfo.render("par jour"|os_trans("per day"),item.dayPaymentNumber)}}
                {{smallInfo.render("par mois"|os_trans("per month"),item.monthPaymentNumber)}}
                {% endif %}

                <h5 class="h6 medium top-20">{{"Coûts de paiement"||os_trans("Payment costs")}}</h5>
                {{smallInfo.render("Réseau GIM"|os_trans("GIM Network"),item.gimPaymentCost)}}
                {{smallInfo.render("Réseau VISA"|os_trans("VISA Network"),item.visaPaymentCost)}}
            </div>
            <article  class='h6 article lh-4x text-justify {{desktop("top-30")}}'>
            {{ item|os_trans("details")|raw }}
            </article>
{#
            <div class="flex row wrap flex-1 nowrap">
                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Limite de retrait :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Par opération :</th>
                            <td class="left-25-in text-right">{{item.transactionWithdrawalLimit}}</td>
                        </tr>
                        <tr>
                            <th>Par jour :</th>
                            <td class="left-25-in text-right">{{item.dayWithdrawalLimit}}</td>
                        </tr>
                        <tr>
                            <th>Par mois :</th>
                            <td class="left-25-in text-right">{{item.monthWithdrawalLimit}}</td>
                        </tr>transaction
                    </table>
                </div>

                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Nombre de retrait :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Par jour :</th>
                            <td class="left-25-in text-right">{{item.dayMaximumWithdrawal}}</td>
                        </tr>
                        <tr>
                            <th>Par mois :</th>
                            <td class="left-25-in text-right">{{item.monthMaximumWithdrawal}}</td>
                        </tr>
                    </table>
                </div>


                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Coûts de retrait :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Réseau NSIA :</th>
                            <td class="left-25-in text-right">{{item.nsiaWithdrawalCost}}</td>
                        </tr>
                        <tr>
                            <th>Réseau GIM :</th>
                            <td class="left-25-in text-right">{{item.gimWithdrawalCost}}</td>
                        </tr>
                        <tr>
                            <th>Réseau VISA :</th>
                            <td class="left-25-in text-right">{{item.visaWithdrawalCost}}</td>
                        </tr>
                    </table>
                </div>

                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Limite de paiement :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Par opération :</th>
                            <td class="left-25-in text-right">{{item.transactionPaymentLimit}}</td>
                        </tr>
                        <tr>
                            <th>Par jour :</th>
                            <td class="left-25-in text-right">{{item.dayPaymentLimit}}</td>
                        </tr>
                        <tr>
                            <th>Par mois :</th>
                            <td class="left-25-in text-right">{{item.monthPaymentLimit}}</td>
                        </tr>
                    </table>
                </div>

                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Nombre de paiement :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Par jour :</th>
                            <td class="left-25-in text-right">{{item.dayPaymentNumber}}</td>
                        </tr>
                        <tr>
                            <th>Par mois :</th>
                            <td class="left-25-in text-right">{{item.monthPaymentNumber}}</td>
                        </tr>
                    </table>
                </div>


                <div class="shadow-alt-2 vt-25-in hz-30-in top-20 right-20">
                    <h3 class="h5 success">Coûts des paiements :</h3>
                    <table class="noborder text-left">
                        <tr>
                            <th>Réseau GIM :</th>
                            <td class="left-25-in text-right">{{item.gimPaymentCost}}</td>
                        </tr>
                        <tr>
                            <th>Réseau VISA :</th>
                            <td class="left-25-in text-right">{{item.visaPaymentCost}}</td>
                        </tr>
                    </table>
                </div>
            </div> #}
        </div>
	</div>
</div>
{% endblock %}