<div class="page-heading compact">
    <div>
        <span>Модул 1</span>
        <h1>Подай сигнал</h1>
        <p>Системата подготвя официален текст, избира институция и създава доказателство за изпращане.</p>
    </div>
</div>

<section class="two-column">
    <article class="panel">
        <form class="stack-form js-report-form" action="/reports" method="post" enctype="multipart/form-data">
            <?= csrf_field() ?>
            <div class="form-grid">
                <label>Категория
                    <select name="category" required>
                        <?php foreach ($categories as $category): ?>
                            <option><?= e($category) ?></option>
                        <?php endforeach; ?>
                    </select>
                </label>
                <label>Проблем
                    <input name="problem" value="Дупка на пътя" required>
                </label>
            </div>

            <label>Адрес / местоположение
                <input name="address" value="ул. Иван Вазов 15, Пловдив" required>
            </label>

            <div class="form-grid">
                <label>Община
                    <input name="municipality" value="Пловдив" required>
                </label>
                <label>Институция
                    <select name="institution">
                        <?php foreach ($institutions as $institution): ?>
                            <option><?= e($institution['name']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </label>
            </div>

            <label>Описание
                <textarea name="description" required>Голяма дупка на пътното платно, която създава опасност за автомобили и пешеходци.</textarea>
            </label>

            <label>Снимки
                <input type="file" name="photos[]" multiple accept="image/*">
            </label>

            <div class="delivery-box">
                <div>
                    <strong>Изпращане към институция</strong>
                    <p>За най-силно доказателство използвай ССЕВ или официалния портал и въведи входящ номер след подаване.</p>
                </div>
                <label class="check-row">
                    <input type="checkbox" name="send_to_institution" value="1" checked>
                    <span>Изпрати/подготви за изпращане към институцията</span>
                </label>
                <div class="delivery-options">
                    <label>
                        <input type="radio" name="delivery_channel" value="email" checked>
                        <span>Email към официален адрес</span>
                    </label>
                    <label>
                        <input type="radio" name="delivery_channel" value="edelivery">
                        <span>ССЕВ / официален портал</span>
                    </label>
                </div>
            </div>

            <div class="gps-row">
                <button class="btn btn-outline-secondary" type="button" data-gps><i class="bi bi-crosshair"></i> Добави GPS</button>
                <span data-gps-output>GPS не е добавен</span>
            </div>

            <div class="action-row">
                <button class="btn btn-success" type="submit"><i class="bi bi-send"></i> Подай сигнал</button>
                <button class="btn btn-outline-dark" type="button" data-ai-polish><i class="bi bi-stars"></i> AI подобри текста</button>
            </div>
        </form>
    </article>

    <aside class="panel">
        <div class="panel-head">
            <h2>Готов документ</h2>
            <span class="status-pill success">HTML / PDF / DOCX ready</span>
        </div>
        <div class="document-preview js-document-output">Попълни формата и натисни „Подай сигнал“. Документът ще се появи тук.</div>

        <div class="delivery-proof js-delivery-proof">
            <h3>Доказателство за доставка</h3>
            <p>След подаване тук ще се покажат каналът, статусът, message-id или следваща стъпка за ССЕВ/портал.</p>
        </div>

        <div class="download-row">
            <button class="btn btn-outline-dark" type="button"><i class="bi bi-eye"></i> Прегледай</button>
            <button class="btn btn-success" type="button"><i class="bi bi-filetype-pdf"></i> PDF</button>
            <button class="btn btn-outline-dark" type="button"><i class="bi bi-filetype-docx"></i> DOCX</button>
        </div>
    </aside>
</section>
