import type { Metadata } from "next";
import { apiSafe, type Meta } from "@/lib/api";
import { MapSection } from "@/components/map-section";
import { Card } from "@/components/ui";

export const metadata: Metadata = { title: "Carte électorale du Québec 2026 — 127 circonscriptions", description: "Carte interactive des 127 circonscriptions : projection, probabilité, marge, variation depuis 2022 et résultats en direct le 5 octobre." };
export const revalidate = 60;

export default async function Page() {
  const meta = await apiSafe<Meta>("/api/meta");
  const live = meta ? meta.mode !== "forecast" : false;
  return (
    <div className="space-y-6">
      <div>
        <div className="eyebrow eyebrow-accent">Carte · 127 circonscriptions · limites officielles 2026</div>
        <h1 className="display text-[40px] md:text-[56px] mt-3">Carte électorale</h1>
        <p className="text-ink-2 mt-3 max-w-2xl text-[15px] leading-relaxed">Géométrie officielle d&apos;Élections Québec (simplifiée pour le web). Avant le scrutin, aucune circonscription n&apos;est « gagnée » : l&apos;opacité traduit la probabilité. Molette ou pincement pour zoomer ; cliquez pour ouvrir la fiche.</p>
      </div>
      <Card pad={false} className="p-3 md:p-4"><MapSection height={680} live={live} /></Card>
      <p className="text-[12px] text-ink-3 break-words">Source de la géométrie : <span className="break-all">donnees.electionsquebec.qc.ca/autres/provincial/circonscriptions_electorales_sans_eau_2026.json</span>. Encarts : Montréal–Laval et Québec–Lévis.</p>
    </div>
  );
}