@extends('emails.layouts.email')

@section('title', 'Booking Cancelled - ' . $booking->booking_number)
@section('header_title', 'Booking Cancelled')

@section('content')
<p class="greeting">Dear {{ $guest->first_name }} {{ $guest->last_name }},</p>

<div class="info-box danger">
    <p>
        <strong>Booking Cancelled</strong><br>
        Your booking <strong>{{ $booking->booking_number }}</strong> has been cancelled.
    </p>
</div>

<p class="message">
    We're sorry to inform you that your booking at <strong>{{ $property->name }}</strong> has been cancelled.
    @if($booking->cancellation_reason)
    <br><br><strong>Reason:</strong> {{ $booking->cancellation_reason }}
    @endif
</p>

<div class="booking-card">
    <div class="booking-card-header">
        <div class="booking-number">
            Booking Number<br>
            <strong>{{ $booking->booking_number }}</strong>
        </div>
        <span class="booking-status status-cancelled">Cancelled</span>
    </div>

    <div class="booking-details">
        <div class="booking-detail-row">
            <span class="booking-detail-label">Original Check-in</span>
            <span class="booking-detail-value">{{ \Carbon\Carbon::parse($rooms->first()->checkin_date)->format('l, d M Y') }}</span>
        </div>
        <div class="booking-detail-row">
            <span class="booking-detail-label">Original Check-out</span>
            <span class="booking-detail-value">{{ \Carbon\Carbon::parse($rooms->first()->checkout_date)->format('l, d M Y') }}</span>
        </div>
        <div class="booking-detail-row">
            <span class="booking-detail-label">Room</span>
            <span class="booking-detail-value">{{ $rooms->first()->roomType->name ?? 'Room' }}</span>
        </div>
        <div class="booking-detail-row">
            <span class="booking-detail-label">Cancelled On</span>
            <span class="booking-detail-value">{{ $booking->cancelled_at ? $booking->cancelled_at->format('d M Y, H:i') : now()->format('d M Y, H:i') }}</span>
        </div>
    </div>
</div>

@if($booking->paid_amount > 0)
<div class="info-box" style="margin-top: 20px;">
    <p>
        <strong>💰 Refund Information</strong><br>
        If you have made any payment, our team will process your refund according to our cancellation policy.
        Please allow 5-14 business days for the refund to be processed.
    </p>
</div>
@endif

<div style="text-align: center; margin-top: 30px; padding: 20px; background-color: #f8fafc; border-radius: 8px;">
    <p style="color: #4a5568; font-size: 16px; margin-bottom: 16px;">
        <strong>We hope to see you soon!</strong>
    </p>
    <p style="color: #718096; font-size: 14px;">
        If you'd like to make a new reservation, please visit our website or contact us directly.
    </p>
</div>

<div style="text-align: center; margin-top: 20px;">
    <p style="color: #718096; font-size: 14px;">
        If you have any questions about this cancellation, please don't hesitate to contact us.
    </p>
</div>
@endsection