@extends('mails/template')

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

@section('title')
    <span>{{$product->name}}</span>
@endsection

@section('content')

    <!-- English Content -->
    <div style="font-size: 16px; color: #4b4a4a; line-height: 140%; text-align: left; word-wrap: break-word;">
        <p style="font-size: 16px; line-height: 18px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            Hello,
            <br><br>
            You have received a new message from the Urban Canopee team regarding:
            <strong>{{$product?->name}}</strong>.
            <br><br>
            The water level is low, please refill the water reservoir as soon as possible.
            <br>
            You can track the progress by logging into your account using the button below.
        </p>
    </div>

    <!-- French Content -->
    <div style="font-size: 16px; color: #4b4a4a; line-height: 140%; text-align: left; word-wrap: break-word; margin-top: 20px; border-top: 1px solid #ddd; padding-top: 20px;">
        <p style="font-size: 16px; line-height: 18px; font-family:Helvetica, Arial, sans-serif; color:#757575">
            Bonjour,
            <br><br>
            Vous avez reçu un nouveau message de la part de l'équipe Urban Canopee concernant :
            <strong>{{$product?->name}}</strong>.
            <br><br>
            Le niveau d'eau est faible, merci de remplir la réserve d’eau très prochainement.
            <br>
            Vous pouvez dès à présent suivre l'évolution en vous connectant à votre compte en cliquant sur le bouton ci-dessous.
        </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('footer')
    @include('mails/partials/footer')
@endsection