import TelegramBanner from "../components/telegramBanner";

export default function ContactInformation() {
  return (
    <section className="mx-auto max-w-5xl px-4 py-10">
      {/* Title */}
      <h1 className="mb-6 text-2xl font-semibold text-slate-900">
        Contact Information
      </h1>

      {/* Card Wrapper */}
      <div className="rounded-lg border border-slate-200 bg-white p-6 sm:p-8">
        {/* Intro Text */}
        <p className="mb-8 text-center text-slate-600">
          We are at the tip of your finger! Get in touch with us via our email
          addresses below.
        </p>

        {/* Contact Cards */}
        <div className="grid gap-6 md:grid-cols-2">
          {/* General Enquiries */}
          <div className="overflow-hidden rounded-lg border border-slate-200">
            <div className="bg-slate-50 px-4 py-3 text-sm font-semibold text-slate-700">
              For General Enquiries
            </div>
            <div className="px-4 py-6 text-sm text-slate-700">
              info@JusticeTips.com.ng
            </div>
          </div>

          {/* Ads & Article Placement */}
          <div className="overflow-hidden rounded-lg border border-slate-200">
            <div className="bg-slate-50 px-4 py-3 text-sm font-semibold text-slate-700">
              For Ads and Article Placement
            </div>
            <div className="px-4 py-6 text-sm text-slate-700">
              <p>advert@JusticeTips.com.ng</p>

              <p className="my-3 font-medium">Or</p>

              <a
                href="#"
                className="inline-flex items-center gap-2 text-sm font-medium text-blue-600 hover:underline"
              >
                Click here to Chat on Skype
              </a>
            </div>
          </div>
        </div>

        {/* Working Hours */}
        <div className="mt-10">
          <h3 className="mb-2 text-sm font-semibold text-slate-800">
            Working Hours:
          </h3>
          <p className="text-sm text-slate-600">
            Mondays to Saturdays (9am to 5pm) (WAT)
          </p>
        </div>
      </div>
      <TelegramBanner />
    </section>
  );
}