import Link from "next/link";
import { GUIDES } from "@/lib/guides";

const MAX = 2;

/**
 * Zeigt die Ratgeber, die dieses Tool in ihren relatedTools führen.
 * Gegenrichtung zum Tool-Link im Ratgeber – für kontextbezogenes internes Linking.
 */
export default function RelatedGuides({ toolSlug }: { toolSlug: string }) {
  const matching = GUIDES.filter((guide) =>
    guide.relatedTools.includes(toolSlug),
  ).slice(0, MAX);

  if (matching.length === 0) return null;

  return (
    <article className="p-6 sm:p-7 bg-paper/90 rounded-2xl border border-line shadow-soft">
      <h2 className="font-display text-xl font-semibold text-ink mb-3">
        Passende Ratgeber
      </h2>
      <ul className="space-y-4">
        {matching.map((guide) => (
          <li key={guide.slug}>
            <Link
              href={`/ratgeber/${guide.slug}`}
              className="font-medium text-[#c97d60] hover:underline underline-offset-2 transition-colors"
            >
              {guide.title}
            </Link>
            <p className="mt-1 text-sm leading-relaxed text-ink-soft">
              {guide.excerpt}
            </p>
          </li>
        ))}
      </ul>
    </article>
  );
}