{{--
    Apology Banner Molecule - Atomic Composable v2.0
    Professional apology message for ticket corrections/resends

    Note: All design tokens auto-injected via View Composer

    Usage:
    @component('emails.molecules.apology-banner', [
        'customerName' => 'John Doe',
        'eventName' => 'Mohamed Abdo New Years Celebration 2025',
        'colors' => $colors  // Auto-injected but pass through
    ])
    @endcomponent
--}}
@php
$customerName = $customerName ?? 'Valued Customer';
$eventName = $eventName ?? 'the event';
@endphp

@component('emails.organisms.alert-box', [
    'variant' => 'warning',
    'title' => 'Updated Ticket Information',
    'colors' => $colors
])
    <p style="margin: 0 0 {{ $spacing['3'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        Dear {{ $customerName }},
    </p>

    <p style="margin: 0 0 {{ $spacing['3'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        We're writing to provide you with updated ticket information.
    </p>

    <p style="margin: 0 0 {{ $spacing['3'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        We recently identified a technical issue that affected the date display in some confirmation emails for <strong>{{ $eventName }}</strong>. Your tickets and booking are completely valid and your seats are confirmed.
    </p>

    <p style="margin: 0 0 {{ $spacing['3'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        This email contains your corrected ticket information with the accurate event date and time. Please use these tickets for entry.
    </p>

    <p style="margin: 0 0 {{ $spacing['3'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        We sincerely apologize for any confusion this may have caused.
    </p>

    <p style="margin: 0 0 {{ $spacing['2'] }}; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        <strong>Both tickets will work as if they are the same - so please only bring one.</strong><br>
        We look forward to welcoming you.
    </p>

    <p style="margin: 0; font-family: {{ $typography['font-family'] }}; font-size: {{ $typography['sizes']['sm'] }}; line-height: {{ $typography['line-heights']['relaxed'] }}; color: {{ $colors['neutral-700'] }};">
        Kind regards,<br>
        <strong>Global Gala Team</strong>
    </p>
@endcomponent