{% extends "base.html" %}
{% block title %}Добавить обучение{% endblock %}
{% block page_title %}Добавить обучение{% endblock %}

{% block content %}
<style>
.d-card select { color-scheme: dark; }
</style>
<div style="display: flex; justify-content: center;">
    <div style="width: 100%; max-width: 600px;">
        <div class="d-card">
            <div style="padding:14px 20px;font-size:15px;font-weight:600;border-bottom:1px solid rgba(255,255,255,0.05);color:#fff;">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="margin-right:8px;vertical-align:text-bottom;"><path d="M12 5v14M5 12h14"/></svg>
                Добавить обучение
            </div>
            <div style="padding:20px;">
                <form method="POST" enctype="multipart/form-data">
                    {{ form.hidden_tag() }}
                    <div style="margin-bottom: 16px;">
                        <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Название обучения</label>
                        {{ form.title(class="form-control form-control-sm") }}
                    </div>
                    <div style="margin-bottom: 16px;">
                        <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Сотрудник</label>
                        <select name="user_id" class="form-control form-control-sm" required style="background:rgba(6,11,40,0.4);border-color:rgba(255,255,255,0.1);color:#fff;">
                            {% for id, name in users %}
                            <option value="{{ id }}">{{ name }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div style="margin-bottom: 16px;">
                        <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Описание</label>
                        {{ form.description(class="form-control form-control-sm", rows=2) }}
                    </div>
                    <div style="display: flex; gap: 16px; margin-bottom: 16px;">
                        <div style="flex: 1;">
                            <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Часы</label>
                            {{ form.hours(class="form-control form-control-sm") }}
                        </div>
                        <div style="flex: 1;">
                            <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Дата</label>
                            {{ form.date(class="form-control form-control-sm", type="date") }}
                        </div>
                    </div>
                    <div style="margin-bottom: 16px;">
                        <label style="display: block; margin-bottom: 4px; font-weight: 500;font-size:13px;color:#fff;">Файл (PDF, документ)</label>
                        {{ form.file(class="form-control form-control-sm") }}
                    </div>
                    <button type="submit" class="btn-apple" style="width: 100%;">Добавить</button>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}