// pages/message.js

import { useRouter } from 'next/router';
import Layout from "../components/layout";

export default function MessagePage() {
    const router = useRouter();
    const messageStyles = {
        error: "text-red-500",
        warning: "text-yellow-500",
        info: "text-blue-500",
    };
    const { message, type = messageStyles.info, caption } = router.query;

    return (
        <Layout>
            <div className="flex items-center justify-center min-h-screen">
                <div className="text-center">
                    <h1 className={`text-2xl font-bold mb-4 ${messageStyles[type]}`}>{caption || 'Информация'}</h1>
                    <p className="mb-6">
                        {message || 'Така ще получавате различни съобщения.'}
                    </p>
                </div>
            </div>
        </Layout>
    );
}