@extends('mails.qataloog-template-en')

@section('content')

    <tr>
        <td class="hero-image">
            <img src="https://qataloog.s3.us-west-2.amazonaws.com/email+1.png" alt="" width="600" style="max-width: 100%;">
        </td>
    </tr>

    <tr>
        <td style="padding:5px 10px; ">
          <table width="100%">
              <tr>
                <td>
                  <p style="font-size: 13px; font-family: Nunito Sans;">Hi {{ $user->name ?? ''}},</p>
                  <p style="line-height: 20px; font-size: 13px; font-family: Nunito Sans;" >
                    Click the button below to verify your email.
                  </p>
                </td>
              </tr>
          </table>
        </td>
    </tr>

    <tr>
        <td style="padding: 5px 20px; ">
          <table width="100%" >
            <a href="{{ $url }}" style="color:#000; font-size: 15px; font-weight: 600; text-decoration: none; cursor: pointer; font-family: Nunito Sans; background-color:#ED702E; border-radius: 4px; padding: 4px; color: #ffffff; padding: 2px 10px 2px 10px;">Verify Email</a>
          </table>
        </td>
    </tr>

    @if ($password)
        <tr>
            <td style="padding: 5px 10px; ">
              <table width="100%" >
                <td>
                    <p style="line-height: 20px; font-size: 13px;"> Your password is: <b>{{ $password }}</b>.</p>
                </td>
              </table>
            </td>
        </tr>
    @endif

    <tr>
        <td style="padding: 5px 10px 15px;">
          <table width="100%">
            <p style="font-size: 13px;">Using the Mobile App? Use the OTP below</p>
            <p style="font-weight: 600; display: inline; margin-right: 5px;">OTP Code:</p><span>{{ $otp }}</span>
          </table>
        </td>
    </tr>

@endsection