import React from 'react';

function Home({ onStartFocus, onStartTutorial }) {
  return (
    <main id="page-a" className="page">
      <h1>FocusGuard</h1>
      <p>Your productivity monitor assistant.</p>

      <div style={{ display: 'flex', flexDirection: 'column', gap: '15px', alignItems: 'center', marginTop: '30px' }}>
        <button className="btn-main" onClick={onStartFocus} style={{ width: '250px' }}>
          Start Focus
        </button>

        <button className="btn-main" onClick={onStartTutorial} style={{ width: '250px' }}>
          Tutorial
        </button>
      </div>
    </main>
  );
}

export default Home;