index.html

<!DOCTYPE html>
<html lang="en">
<head>
	<title>Tomato Timer</title>
	<link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>🍅 Tomato Timer ⏰</h1>
        <div id="timer-display">
            <span id="time-left">25:00</span>
        </div>
        <div id="buttons">
            <button id="study-btn">Study</button>
            <button id="break-btn">Break</button>
            <button id="start-stop-btn" style="display: none;">Start/Stop</button>
        </div>
        <div id="session-count">
            <p>Study Sessions: <span id="study-count">0</span></p>
            <p>Break Sessions: <span id="break-count">0</span></p>
        </div>
        <div id="theme-selector" style="display: none;">
            <button id="light-theme">Light</button>
            <button id="dark-theme">Dark</button>
        </div>
    </div>
</body>
</html>