<style>
    .order-notification-toast {
        padding: 4px;
    }

        .order-notification-toast .message {
            font-weight: 600;
            margin-bottom: 8px;
            font-size: 14px;
        }

        .order-notification-toast .order-info {
            margin-bottom: 4px;
            font-size: 13px;
        }

        .order-notification-toast .label {
            color: #666;
            margin-right: 4px;
        }

        .order-notification-toast .order-number {
            font-weight: bold;
            color: #0066cc;
        }

        .order-notification-toast .date {
            font-weight: 500;
        }
</style>

<div class="order-notification-toast">
    <div class="message">@Message</div>
    @if (!string.IsNullOrEmpty(OrderNumber))
    {
        <div class="order-info">
            <span class="label">Rendelés:</span>
            <span class="order-number">#@OrderNumber</span>
        </div>
    }
    @if (DateOfReceipt.HasValue)
    {
        <div class="order-info">
            <span class="label">Átvétel:</span>
            <span class="date">@DateOfReceipt.Value.ToString("yyyy-MM-dd HH:mm")</span>
        </div>
    }
</div>

@code {
    [Parameter] public string Message { get; set; } = string.Empty;
    [Parameter] public string? OrderNumber { get; set; }
    [Parameter] public DateTime? DateOfReceipt { get; set; }
}