{% load i18n %}

<div class="card mb-3">
    <div class="table-responsive">
        <div class="card-body bg-secondary rounded">
            <header class="card-header bg-primary rounded-top">
                <h3 class="me-3">{% translate "Factories" %}</h3>
            </header>
            <table class="table table-striped table-hover" id="factory-table">
                <thead>
                    <tr>
                        <th>{% translate "Facility" %}</th>
                        <th>{% translate "Input" %}</th>
                        <th>{% translate "Output" %}</th>
                        <th>{% translate "Active" %}</th>
                    </tr>
                </thead>
                <tbody class="modal-facility-table-body">
                    <!-- Facility -->
                </tbody>
            </table>
        </div>
    </div>
</div>