const { useState: useStateA, useEffect: useEffectA, useRef: useRefA } = React;

// Toast helper
function ToastHost() {
  const [msg, setMsg] = useStateA(null);
  useEffectA(() => {
    window.__toast = (m) => {
      setMsg(m);
      setTimeout(() => setMsg(null), 4000);
    };
  }, []);
  return (
    <div className={`toast ${msg ? 'show' : ''}`}>
      <Icon name="check" size={16} color="#bfedd1" stroke={2.6}/>
      {msg}
    </div>
  );
}

function App() {
  const onBookClick = () => {
    const el = document.getElementById('reserver');
    if (el) window.scrollTo({ top: el.offsetTop - 60, behavior: 'smooth' });
  };
  return (
    <>
      <Nav onBookClick={onBookClick} />
      <Hero onBookClick={onBookClick} />
      <Services onBookClick={onBookClick} />
      <Methode />
      <Tarifs />
      <Booking />
      <About />
      <FAQ />
      <Contact />
      <Footer />
      <ToastHost />
    </>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);