<style>
    body {
        font-family: Arial, sans-serif;
        background: #f4f6f9;
        padding: 30px;
    }

    .container {
        max-width: 650px;
        margin: auto;
        background: #fff;
        padding: 25px;
        border-radius: 10px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }

    .page-header {
        margin-bottom: 20px;
        padding: 15px 20px;
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
        border-radius: 10px;
        text-align: center;
    }

    .page-header h1 {
        margin: 0;
        font-size: 24px;
    }

    .page-header p {
        margin: 5px 0 0;
        font-size: 14px;
        opacity: 0.9;
    }

    .form-group {
        margin-bottom: 15px;
    }

    label {
        display: block;
        font-weight: bold;
        margin-bottom: 5px;
    }

    input,
    textarea {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 6px;
        outline: none;
    }

    input:focus,
    textarea:focus {
        border-color: #007bff;
    }

    .row {
        display: flex;
        gap: 10px;
    }

    .row .form-group {
        flex: 1;
    }

    button {
        padding: 10px 12px;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        font-size: 14px;
    }

    .btn-primary {
        background: #007bff;
        color: white;
        width: 100%;
        margin-top: 10px;
    }

    .btn-primary:hover {
        background: #0056b3;
    }
</style>
<% if (typeof error_msg !=='undefined' && error_msg) { %>

    <div class="alert alert-danger">
        <%= error_msg %>
    </div>

    <% } %>


        <% if (typeof success_msg !=='undefined' && success_msg) { %>
            <div class="alert alert-success">
                <%= success_msg %>
            </div>
            <% } %>
                <div class="container">

                    <div class="page-header">
                        <h1>Update Batch</h1>
                           <p>Update the details of the batch</p>
                    </div>

                    <form action="<%= ROUTES.ADMIN_BATCHES_UPDATE.replace(':id', batch._id) %>" method="POST">

                        <!-- Title -->
                        <div class="form-group">
                            <label>Batch Title</label>
                            <input type="text" name="title" value="<%= batch.title %>" placeholder="Enter Batch Title" required maxlength="100">
                        </div>
                        <!-- Status -->
                        <div class="mb-3">
                            <label for="status" class="form-label fw-semibold">Batch Status</label>

                            <select id="status" name="status" class="form-select shadow-sm" required>
                                <option value="">Select Status</option>
                                <option value="Active" <%=batch.status==="Active" ? "selected" : "" %>>🟢 Active</option>
                                <option value="Inactive" <%=batch.status==="Inactive" ? "selected" : "" %>>🔴 Inactive</option>
                            </select>
                        </div>

                        <button type="submit" class="btn-primary">Update Batch</button>

                    </form>

                </div>