<email-body v-bind="$props">
    <div class="grid-row">
        <div class="grid-block vn-pa-ml">
            <h1>{{ $t('title') }}</h1>
            <p>{{$t('dearClient')}},</p>
            <p v-html="$t('clientData')"></p>

            <p>
            <div>{{$t('clientId')}}: <strong>{{client.id}}</strong></div>
            <div>{{$t('user')}}: <strong>{{client.userName}}</strong></div>
            <div>{{$t('password')}}: <strong>********</strong>
                (<a href="https://shop.verdnatura.es">{{$t('passwordResetText')}}</a>)
            </div>
            </p>

            <h1>{{$t('sections.howToBuy.title')}}</h1>
            <p>{{$t('sections.howToBuy.description')}}</p>
            <ol>
                <li v-for="requeriment in $t('sections.howToBuy.requeriments')">
                    <span v-html="requeriment"></span>
                </li>
            </ol>
            <p>{{$t('sections.howToBuy.stock')}}</p>
            <p>{{$t('sections.howToBuy.delivery')}}</p>

            <h1>{{$t('sections.howToPay.title')}}</h1>
            <p>{{$t('sections.howToPay.description')}}</p>
            <ul>
                <li v-for="option in $t('sections.howToPay.options')">
                    <span v-html="option"></span>
                </li>
            </ul>

            <h1>{{$t('sections.toConsider.title')}}</h1>
            <p>{{$t('sections.toConsider.description')}}</p>

            <h4>{{$t('sections.claimsPolicy.title')}}</h4>
            <p>{{$t('sections.claimsPolicy.description')}}</p>

            <p v-html="$t('help')"></p>
            <p>
            <section v-if="client.salesPersonName">
                {{$t('salesPersonName')}}: <strong>{{client.salesPersonName}}</strong>
            </section>
            <section v-if="client.salesPersonPhone">
                {{$t('salesPersonPhone')}}: <strong>{{client.salesPersonPhone}}</strong>
            </section>
            <section v-if="client.salesPersonEmail">
                {{$t('salesPersonEmail')}}:
                <strong><a v-bind:href="`mailto: ${client.salesPersonEmail}`"
                        target="_blank">{{client.salesPersonEmail}}</strong>
            </section>
            </p>
        </div>
    </div>
</email-body>