<style>
        table {<br />
            width: 100%;<br />
            border-collapse: collapse;<br />
            margin-top: 20px;<br />
        }<br />
        th, td {<br />
            border: 1px solid #ccc;<br />
            padding: 8px;<br />
            text-align: left;<br />
        }<br />
        th {<br />
            background-color: #f4f4f4;<br />
        }<br />
        input[type="text"], select {<br />
            width: 100%;<br />
            box-sizing: border-box;<br />
        }<br />
    </style>
<h1>Enter Athlete Data</h1>
<form id="dataForm"><input id="csvFileInput" accept=".csv" type="file" />
<table>
<thead>
<tr>
<th>BIP</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>FIS Code</th>
<th>Licence Code</th>
<th>Licence Type</th>
<th>Klub</th>
<th>Country</th>
<th>Date of Birth</th>
<th>Category</th>
<th>Actions</th>
</tr>
</thead>
<tbody><!-- Rows will be dynamically added --></tbody>
</table>
<button type="button">Add Row</button>
<button type="submit">Submit</button>

</form><!-- Status message for the AJAX submission -->