"use client";

import Link from "next/link";

export default function Policy({ data }: { data: any }) {
    return (
        <div className="">
            <section className="py-5">
                <div className="mx-auto px-5 sm:px-5 lg:px-30 md:px-8 2xl:px-45">
                    <h1 className="text-3xl sm:text-4xl font-semibold text-primary">
                        {data?.title}
                    </h1>
                </div>
            </section>
            <main className="mx-auto pb-10 px-5 sm:px-5 lg:px-30 md:px-8 2xl:px-45">
                <div
                    className="
                        pb-4
                        text-primary
                        [&_a]:text-secondary

                        [&_h1]:mb-3
                        [&_h1]:text-2xl
                        [&_h1]:font-bold
                        [&_h1]:leading-tight

                        [&_h2]:mb-2.5
                        [&_h2]:text-xl
                        [&_h2]:font-bold
                        [&_h2]:leading-tight

                        [&_h3]:mb-2
                        [&_h3]:text-lg
                        [&_h3]:font-semibold
                        [&_h3]:leading-tight

                        [&_p]:mb-2.5
                        [&_p]:text-base
                        [&_p]:leading-relaxed

                        [&_ul]:list-disc
                        [&_ul]:pl-5
                        [&_ul]:mb-3
                        [&_ol]:list-decimal
                        [&_ol]:pl-5
                        [&_ol]:mb-3
                        [&_li]:mb-1
                    "
                    dangerouslySetInnerHTML={{
                        __html: data?.description || "",
                    }}
                />
            </main>
        </div>
    );
}