@component('emails.layouts.html', ['subject' => trans('messages.Reservation_update', [], 'en')])

{{-- Greeting --}}
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: {{ theme_color('text.primary') }}; margin: 0 0 15px 0; padding: 0; line-height: 1.5;">
    {{ __('Hello') }} {{ $reacter->full_name  ?? $reacter->name }},
</p>

{{-- Main message --}}
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: {{ theme_color('text.primary') }}; margin: 0 0 20px 0; padding: 0; line-height: 1.5;">
    {{ __(':organizer has sent you an update about :event:', ['organizer' => $organizer->name, 'event' => $post->translations->first()->title]) }}
</p>

{{-- Custom Message Panel --}}
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 0 0 20px 0; border-collapse: collapse;">
    <tr>
        <td style="padding: 20px; border-left: 4px solid {{ theme_color('text.secondary') }}; font-family: Arial, Helvetica, sans-serif; font-size: 15px; color: {{ theme_color('text.secondary') }}; line-height: 1.6; background-color: {{ theme_color('text.surface') }} ">
            {{ $customMessage }}
        </td>
    </tr>
</table>

@if($post->meeting)
{{-- Event Details --}}
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: {{ theme_color('text.primary') }}; margin: 10px 0 10px 0; padding: 0; line-height: 1.5;">
    {{ __('Event Details:') }}
</p>

<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 0 0 20px 0; border-collapse: collapse;">
    @if($post->meeting->venue)
    <tr>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }}; border-bottom: 1px solid #e5e7eb;">
            <strong>{{ __('Location:') }}</strong>
        </td>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }}; border-bottom: 1px solid #e5e7eb;">
            {{ $post->meeting->venue }}
        </td>
    </tr>
    @endif
    @if($post->meeting->address)
    <tr>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }}; border-bottom: 1px solid #e5e7eb;">
            <strong>{{ __('Address:') }}</strong>
        </td>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }}; border-bottom: 1px solid #e5e7eb;">
            {{ $post->meeting->address }}
        </td>
    </tr>
    @endif
    @if($post->meeting->from)
    <tr>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }};">
            <strong>{{ __('Date & Time:') }}</strong>
        </td>
        <td style="padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: {{ theme_color('text.primary') }};">
            {{ \Illuminate\Support\Carbon::parse($post->meeting->from)->isoFormat('dddd D MMMM YYYY, H:mm') }}
        </td>
    </tr>
    @endif
</table>
@endif

{{-- View details message --}}
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: {{ theme_color('text.primary') }}; margin: 0 0 20px 0; padding: 0; line-height: 1.5;">
    {{ __('View the full event details:') }}
</p>

{{-- Button --}}
<table role="presentation" class="mobile-button" cellpadding="0" cellspacing="0" border="0" align="center" style="margin: 10px auto 20px auto;">
    <tr>
        <td align="center" style="border-radius: 6px; background-color: {{ theme_color('brand') }};">
            <!--[if mso]>
            <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="{{ $buttonUrl }}" style="height:40px;v-text-anchor:middle;width:160px;" arcsize="15%" stroke="f" fillcolor="{{ theme_color('brand') }}">
            <w:anchorlock/>
            <center>
            <![endif]-->
            <a href="{{ $buttonUrl }}" style="background-color: {{ theme_color('brand') }}; border-radius: 6px; color: #ffffff; display: block; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; line-height: 40px; text-align: center; text-decoration: none; width: 160px; -webkit-text-size-adjust: none; mso-hide: all;">
                {{ __('View Event') }}
            </a>
            <!--[if mso]>
            </center>
            </v:roundrect>
            <![endif]-->
        </td>
    </tr>
</table>

{{-- Closing --}}
<p style="font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: {{ theme_color('text.primary') }}; margin: 30px 0 30px 0; padding: 0; line-height: 1.5;">
    {{ timebank_config('mail.platform_sign_off_signature.' . app()->getLocale()) ?? timebank_config('mail.platform_sign_off_signature.en', 'See you around!') }}
</p>

@endcomponent
