<!DOCTYPE html>    
<html>    
<head>    
    <title>Select Train and Test Number</title>    
    <style>    
        body {    
            display: flex;    
            flex-direction: column;    
            align-items: center;    
            justify-content: center;    
            height: 100vh;    
            font-size: 20px;    
        }    
        input[type=number], input[type=submit] {    
            width: 200px;    
            height: 40px;    
            margin: 10px 0;    
            font-size: 20px;    
        }    
    </style>    
    <script type="text/javascript">  
        function checkInput(input) {  
            var otherInput = input.id === "train" ? "test" : "train";  
            document.getElementById(otherInput).disabled = input.value !== "";  
        }  
    </script>  
</head>    
<body>    
    <h1>Select Train and Test Number</h1>    
    <form method="POST" action="{{ url_for('select_number') }}">    
        <label for="train">Train Number (0-74):</label><br>    
        <input type="number" id="train" name="train" min="0" max="74" oninput="checkInput(this)"><br>    
        <label for="test">Test Number (0-49):</label><br>    
        <input type="number" id="test" name="test" min="0" max="49" oninput="checkInput(this)"><br>    
        <input type="submit" value="Submit">    
    </form>    
</body>    
</html>    
