'use client';
import { FC } from 'react';
import Image from 'next/image';

interface EndSceneProps {
  language: 'fr' | 'en' | 'es';
  setNextScene: () => void;
}

const EndScene: FC<EndSceneProps> = ({
  language,
  setNextScene,
}) => {
  return (
    <div className="relative w-screen h-screen">
      {/* Image de fond */}
      <Image
        src="https://ik.imagekit.io/z0tzxea0wgx/MistralGameJam/court_M-RO6txqB.png?updatedAt=1737835884433"
        alt="Background"
        fill
        className="object-cover"
        priority
      />

      {/* Contenu avec overlay noir */}
      <div className="absolute inset-0 bg-black/70">
        <div className="flex flex-col items-center justify-center h-full p-8">
          <div className="bg-black/60 border border-black border-8 p-6 w-[80%] text-center">
            <h1 className="text-4xl text-white roboto-slab mb-8">
              {language === 'fr'
                ? 'Fin du procès'
                : language === 'en'
                ? 'End of trial'
                : 'Fin del juicio'
              }
            </h1>
            <button
              onClick={setNextScene}
              className="px-8 py-4 text-xl font-bold text-white bg-sky-500 hover:bg-blue-700 transition-colors roboto-slab"
            >
              {language === 'fr' ? 'Rejouer' : language === 'en' ? 'Play again' : 'Jugar de nuevo'}
            </button>
          </div>
        </div>
      </div>
    </div>
  );
};

export default EndScene;