{% extends "admin_base.html" %}
{% import "macros/admin_crud_list.html" as crud %}

{% block page_title %}Holidays{% endblock %}

{% block extra_head %}
<link rel="stylesheet" href="/plugins/employee-attendance/assets/css/attendance.css">
{% endblock %}

{% block admin_content %}
<div class="attendance-page" data-plugin="employee-attendance">
    <p class="admin-hint text-muted" style="margin-bottom:1rem;">
        Team- and designation-specific holidays for attendance rules.
        Org-wide public holidays are managed in the
        <a href="/plugins/holiday-calendar/admin">Holiday Calendar</a> plugin when installed;
        attendance logic reads those dates via <code>holiday_calendar_v_holidays</code>.
    </p>
    {{ crud::shell_open(config_url="/plugins/employee-attendance/assets/admin/holidays_list.json", mount_id="ea-holidays-list", custom_mount=true) }}
    <table class="blocks-admin-table responsive-table">
        <thead></thead>
        <tbody>
            <tr><td colspan="5" class="crud-empty-state">Loading holidays…</td></tr>
        </tbody>
    </table>
    {{ crud::shell_close() }}
</div>

<div id="ea-holiday-modal" class="crud-modal" aria-hidden="true">
    <div class="modal-content">
        <div class="modal-header">
            <h3 id="ea-holiday-modal-title">Create Holiday</h3>
            <button type="button" class="close-btn close-modal" aria-label="Close">&times;</button>
        </div>
        <div class="modal-body">
            <div id="ea-holiday-form-fields"></div>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
<script src="/plugins/employee-attendance/assets/js/holidays_list.js"></script>
{% endblock %}