@extends('mails/template')

@section('header')
    @include('mails/partials/header')
@endsection

@section('title')
    <span>Welcome {{ $user->full_name }} to Urban Canopee,</span>
@endsection

@section('subtitle')
    <span>Your account has been successfully created on our platform. / Votre compte a bien été créé sur notre plateforme.</span>
@endsection

@section('content')

    <!-- English Content -->
    <div style="font-size: 14px; color: #4b4a4a; line-height: 140%; word-wrap: break-word;">
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            You can now log into your account by clicking the button below with the following credentials:
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575; margin: 20px 0 10px 0">
            Email: {{ $user->email }}
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575; margin: 10px 0 20px 0">
            Password: {{ $password }}
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            You can change your password once logged in.
        </p>
    </div>

    <!-- French Content -->
    <div style="font-size: 14px; color: #4b4a4a; line-height: 140%; word-wrap: break-word; margin-top: 20px; border-top: 1px solid #ddd; padding-top: 20px;">
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            Vous pouvez maintenant vous connecter à votre compte en cliquant sur le bouton ci-dessous avec les informations suivantes :
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575; margin: 20px 0 10px 0">
            Email : {{ $user->email }}
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575; margin: 10px 0 20px 0">
            Mot de passe : {{ $password }}
        </p>
        <p style="font-size: 14px; line-height: 16.8px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            Vous pouvez changer votre mot de passe une fois connecté.
        </p>
    </div>

@endsection

@section('actions')
    <a href="https://app.urbancanopee.com" target="_blank"
       class="v-button"
       style="box-sizing: border-box; display: inline-block; text-decoration: none; -webkit-text-size-adjust: none; text-align: center; color: #000000; background-color: #5CAF7D; border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; width:auto; max-width:100%; overflow-wrap: break-word; word-break: break-word; word-wrap:break-word; mso-border-alt: none; font-size: 14px;">
        <span style="display:block; padding:10px 30px; line-height:120%;">
            <span style="font-size: 16px; line-height: 19.2px; font-family:Helvetica, Arial, sans-serif; color:#ffffff">
                Log in / Se connecter
            </span>
        </span>
    </a>
@endsection

@section('actions_message')
    <div style="font-size: 16px; color: #ffffff; line-height: 140%; text-align: center; word-wrap: break-word;">
        <p style="font-size: 16px; line-height: 22.4px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            Thank you for your trust. / Merci de votre confiance.
        </p>
    </div>
@endsection

@section('footer')
    @include('mails/partials/footer')
@endsection