{{--
    Welcome Back Email - Account Setup Invitation
    Sent to previous customers to create account on new system

    Note: $colors automatically injected via View Composer
--}}
@component('emails.layouts.base', [
    'title' => 'Welcome Back to Show Prima',
    'previewText' => 'Create your account on our new platform',
    'colors' => $colors,
    'showUnsubscribe' => $showUnsubscribe ?? false,
    'unsubscribeUrl' => $unsubscribeUrl ?? null
])

@component('emails.atoms.h1', ['colors' => $colors])
    Welcome Back to Show Prima
@endcomponent

@component('emails.atoms.text', ['colors' => $colors])
    @if($userName)
        Hello {{ $userName }},
    @else
        Hello,
    @endif
@endcomponent

@component('emails.atoms.text', ['colors' => $colors])
    We're excited to welcome you back! We've upgraded to a brand new ticketing platform, and we'd love for you to create your account to enjoy all the benefits.
@endcomponent

@include('emails.atoms.spacer', ['height' => '20px'])

{{-- Benefits Section --}}
@component('emails.organisms.alert-box', [
    'variant' => 'info',
    'title' => 'Why Create an Account?',
    'colors' => $colors
])
    <ul style="margin: 10px 0; padding-left: 20px; color: {{ $colors['neutral-700'] }};">
        <li style="margin-bottom: 8px;"><strong>View your order history</strong> – Access all your past bookings in one place</li>
        <li style="margin-bottom: 8px;"><strong>Faster checkout</strong> – Save time with pre-filled details</li>
        <li style="margin-bottom: 8px;"><strong>Event updates</strong> – Get notified about upcoming shows</li>
        <li style="margin-bottom: 8px;"><strong>Exclusive offers</strong> – Early access to special events and promotions</li>
    </ul>
@endcomponent

@include('emails.atoms.spacer', ['height' => '24px'])

@component('emails.atoms.text', ['colors' => $colors])
    Setting up your account is quick and easy – just click the button below to get started:
@endcomponent

@include('emails.atoms.spacer', ['height' => '20px'])

@component('emails.molecules.button', [
    'href' => $setupUrl,
    'variant' => 'primary',
    'size' => 'large',
    'colors' => $colors
])
    Create My Account
@endcomponent

@include('emails.atoms.spacer', ['height' => '20px'])

@component('emails.atoms.text', ['colors' => $colors])
    Or copy and paste this link into your browser:
@endcomponent

@component('emails.atoms.small', ['colors' => $colors])
    <span style="color: {{ $colors['primary-600'] }}; word-break: break-all; font-family: 'Courier New', monospace;">{{ $setupUrl }}</span>
@endcomponent

@include('emails.atoms.spacer', ['height' => '24px'])

{{-- Important Information --}}
@component('emails.organisms.alert-box', [
    'variant' => 'warning',
    'title' => 'Important',
    'colors' => $colors
])
    <p style="margin: 8px 0; color: {{ $colors['neutral-700'] }};">
        This invitation link will <strong>expire on {{ $expiryDate }}</strong> ({{ $daysUntilExpiry }} day{{ $daysUntilExpiry !== 1 ? 's' : '' }} from now).
    </p>
    <p style="margin: 8px 0; color: {{ $colors['neutral-700'] }};">
        Your email address: <strong>{{ $email }}</strong>
    </p>
@endcomponent

@include('emails.atoms.spacer', ['height' => '20px'])

{{-- Security Note --}}
@component('emails.atoms.text', ['colors' => $colors])
    When you create your account, you'll choose a secure password. This is a completely new system, so your previous login credentials will not work.
@endcomponent

@include('emails.atoms.spacer', ['height' => '16px'])

@component('emails.atoms.text', ['colors' => $colors])
    <strong>Not interested?</strong> No worries! You can continue booking as a guest without creating an account, or simply ignore this email.
@endcomponent

@include('emails.atoms.spacer', ['height' => '20px'])

{{-- Support --}}
@component('emails.atoms.text', ['colors' => $colors])
    If you have any questions or need assistance, our support team is here to help at <a href="mailto:info@globalgala.com" style="color: {{ $colors['primary-600'] }}; text-decoration: none;">info@globalgala.com</a>.
@endcomponent

@component('emails.atoms.text', ['colors' => $colors])
    We look forward to seeing you at our next event!
@endcomponent

@include('emails.atoms.spacer', ['height' => '8px'])

@component('emails.atoms.text', ['colors' => $colors])
    Warm regards,<br>
    <strong>The Show Prima Team</strong>
@endcomponent

@include('emails.atoms.spacer', ['height' => '24px'])

{{-- Footer Note --}}
@component('emails.atoms.small', ['colors' => $colors])
    <strong>Security note:</strong> This link is unique to your email address and can only be used once. Never share this link with anyone.
@endcomponent

{{-- Email Open Tracking Pixel (2025-10-28) --}}
@if(isset($trackingPixelUrl))
    <img src="{{ $trackingPixelUrl }}" width="1" height="1" style="display:none;" alt="">
@endif

@endcomponent