@extends('layouts.email')

@section('title', 'Colaboración aceptada')

@section('content')

    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-bottom: 30px;">
        <tr>
            <td style="padding: 0px;">

                <h1 style="color: #243c34; font-size: 24px; line-height: 28px; margin: 0 0 20px 0; font-family: Arial, sans-serif; font-weight: 600;">
                    Hola {{ $recipientName }},
                </h1>

                <p style="color: #243c34; font-size: 16px; line-height: 26px; margin: 0 0 18px 0; font-family: Arial, sans-serif;">
                    Confirmamos que has aceptado la solicitud de colaboración de:
                </p>

                <!-- Separador -->
                <!-- Detalles de la colaboración -->
                <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-bottom: 20px;">
                    <tr>
                        <td style="padding: 15px; background-color: #f8f9fa; border-radius: 8px;">
                            <p style="color: #243c34; font-size: 16px; line-height: 24px; margin: 0 0 10px 0; font-family: Arial, sans-serif; font-weight: 600;">
                                👤 {{ $influencerFullName }} – {{ '@' . $instagramUser }}
                            </p>

                            @if($hasCalendarType && !empty($dateText))
                                <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 8px 0; font-family: Arial, sans-serif;">
                                    {{ $clientName }}
                                </p>

                                @if(!empty($address))
                                    <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 8px 0; font-family: Arial, sans-serif;">
                                        📍 Dirección: {{ $address }}
                                    </p>
                                @endif

                                <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 8px 0; font-family: Arial, sans-serif;">
                                    📅 Fecha de la reserva: {{ $dateText }}
                                </p>

                                @if(!empty($guests))
                                    <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 8px 0; font-family: Arial, sans-serif;">
                                        👥 Nº de personas: {{ $guests }}
                                    </p>
                                @endif

                                @if(!empty($observations))
                                    <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 0 0; font-family: Arial, sans-serif;">
                                        📝 Observaciones del influencer: "{{ $observations }}"
                                    </p>
                                @endif
                            @else
                                <p style="color: #243c34; font-size: 14px; line-height: 20px; margin: 0 0 0 0; font-family: Arial, sans-serif;">
                                    {{ $clientName }}
                                </p>
                            @endif
                        </td>
                    </tr>
                </table>

                <p style="color: #243c34; font-size: 16px; line-height: 26px; margin: 0 0 10px 0; font-family: Arial, sans-serif;">
                    Recuerda que puedes revisar todos los detalles de la colaboración desde tu perfil en la app o accediendo directamente al enlace:
                </p>

                @if(!empty($collabLink))
                    <div style="text-align: left; margin: 10px 0 25px;">
                        <a href="{{ $collabLink }}" target="_blank" style="display: inline-block; background-color: #c8dccd; color: #335d53; padding: 12px 24px; text-decoration: none; border-radius: 99px; font-weight: 600; font-family: Arial, sans-serif; cursor: pointer;">
                            🔗 Ver colaboración
                        </a>
                    </div>
                @endif

                <p style="color: #243c34; font-size: 16px; line-height: 26px; margin: 0 0 10px 0; font-family: Arial, sans-serif;">
                    💬 Si hay algún cambio o necesitas comunicar algo al influencer, puedes hacerlo desde el chat habilitado en la app dentro del detalle de la colaboración.
                </p>

                <p style="color: #243c34; font-size: 16px; line-height: 26px; margin: 10px 0 18px 0; font-family: Arial, sans-serif;">
                    Gracias por seguir colaborando con <strong style="color: #243c34;">Nomade</strong>.
                </p>

                <p style="color: #243c34; font-size: 16px; font-weight: 400; margin: 0 0 10px 0; font-family: Arial, sans-serif;">
                    El equipo de <strong style="color: #243c34;">Nomade Revolution</strong>
                </p>

                <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top: 30px;">
                    <tr>
                        <p style="color: #7f8c8d; font-size: 13px; margin: 0; font-style: italic; font-family: Arial, sans-serif;">
                            (Este es un email automático, por favor no respondas a este correo)
                        </p>
                    </tr>
                </table>

            </td>
        </tr>
    </table>

@endsection