import type { ServicePageContent } from "@/lib/site-content";

/**
 * Regras ou datas de fonte oficial (`official`), com o link de cada fonte para o visitante conferir. O link abre fora
 * do site, em outra aba; sem `official`, nada aparece.
 */
export function ServiceOfficial({
  official,
}: {
  official: ServicePageContent["official"];
}) {
  if (!official) return null;

  return (
    <section className="ds-section" aria-labelledby="fonte-oficial">
      <div className="ds-section-shell">
        <h2 id="fonte-oficial" className="ds-card-title !mt-0">
          {official.title}
        </h2>
        <ul className="ds-list max-w-[80ch] space-y-sp-2">
          {official.items.map((item) => (
            <li key={item}>{item}</li>
          ))}
        </ul>
        <ul className="mt-sp-4 flex flex-col">
          {official.links.map((link) => (
            <li key={link.href}>
              <a
                href={link.href}
                target="_blank"
                rel="noopener noreferrer"
                className="inline-flex min-h-11 items-center text-[15px] underline underline-offset-4"
              >
                {link.label}
              </a>
            </li>
          ))}
        </ul>
      </div>
    </section>
  );
}