@extends('emails.layouts.email')

@section('title', 'Payment Reminder - ' . $booking->booking_number)
@section('header_title', '⏰ Payment Reminder')

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

<div class="info-box warning">
    <p>
        <strong>⚠️ Action Required!</strong> Your booking payment is due soon. Please complete your payment to confirm your reservation.
    </p>
</div>

<p class="message">
    We noticed that your payment for booking <strong>{{ $booking->booking_number }}</strong> is still pending.
    To secure your reservation, please complete the payment before the due date.
</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-pending">Pending Payment</span>
    </div>

    <div class="booking-details">
        <div class="booking-detail-row">
            <span class="booking-detail-label">Check-in Date</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">Check-out Date</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>
</div>

<div class="price-summary" style="background-color: #fef3c7; padding: 20px; border-radius: 8px; margin: 20px 0;">
    <table width="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td style="font-size: 16px; color: #92400e;">Amount Due</td>
            <td style="font-size: 24px; font-weight: 700; color: #92400e; text-align: right;">{{ $booking->currency }} {{ number_format($booking->balance_due ?? $booking->total_amount, 0, ',', '.') }}</td>
        </tr>
        <tr>
            <td colspan="2" style="padding-top: 12px; font-size: 14px; color: #b45309;">
                <strong>Payment Due:</strong> {{ $booking->payment_due_date ? $booking->payment_due_date->format('d M Y, H:i') : 'Soon' }}
            </td>
        </tr>
    </table>
</div>

<div class="info-box danger" style="margin-top: 20px;">
    <p>
        <strong>⚠️ Important:</strong> If payment is not received by the due date, your booking may be automatically cancelled.
    </p>
</div>

<div style="text-align: center; margin-top: 30px;">
    <p style="color: #718096; font-size: 14px;">
        If you have already made the payment, please disregard this email.<br>
        For any questions, please contact us directly.
    </p>
</div>
@endsection