{% load i18n %}
{% load static %}
<div class="col-xl-4 col-md-12">
    <h2>{% trans "scheduler_month_title" %}</h2>
    <h6 class="mb-3">{% trans "scheduler_select_holiday" %}</h6>
    <div class="mb-4" id="calendar"></div>
    <div class="calendar-legend mb-5">
        <div class="d-flex align-items-center mb-3">
            <div class="work-legend">15</div>
            <div>
                &nbsp; — {% trans "scheduler_browser_work_day" %}
            </div>
        </div>
        <div class="d-flex align-items-center mb-3">
            <div class="weekend-legend">15</div>
            <div>
                &nbsp; — {% trans "scheduler_holiday" %}
            </div>
        </div>
        <div class="d-flex align-items-center">
            <div class="current-legend">15</div>
            <div>
                &nbsp; — {% trans "scheduler_today" %}
            </div>
        </div>
    </div>
    <div class="modal fade show" id="calendarModal" style="background: rgba(67,67,67,0.68)" >
        <div class="modal-dialog" id="calendar">
            <div class="modal-content" style="max-width: 600px">
                <div class="modal-header">
                    <h3 class="mb-0">Изменение применится на весь указанный год!</h3>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"
                             @click="closeModal"
                            aria-label="Закрыть"></button>
                </div>
                <div class="modal-body d-flex justify-content-between">
                    <button type="submit" class="btn btn-primary" data-bs-dismiss="modal"
                            @click="acceptMultiSet()">{% trans "modal_yes" %}
                    </button>
                    <button type="button" class="btn btn-secondary" @click="closeModal"
                            data-bs-dismiss="modal">{% trans "modal_no" %}</button>
                </div>
            </div>
        </div>
    </div>
</div>