<!-- Модальное окно для синхронизации с Recommerce -->
<div class="modal fade" id="recommerceSyncModal" tabindex="-1" aria-labelledby="recommerceSyncModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="recommerceSyncModalLabel">
                    <i class="bi bi-arrow-repeat"></i> Синхронизация с Recommerce
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-info mb-4">
                    <i class="bi bi-info-circle"></i> <strong>Выбрано товаров:</strong> <span id="recommerceSyncCount">0</span>
                </div>

                <!-- Основные данные -->
                <div class="card mb-3">
                    <div class="card-header py-2 d-flex justify-content-between align-items-center">
                        <strong><i class="bi bi-box-seam"></i> Основные данные</strong>
                        <button type="button" class="btn btn-sm btn-link p-0" id="toggleBasicFields">Выбрать все</button>
                    </div>
                    <div class="card-body">
                        <div class="row g-2">
                            <div class="col-6">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="price" id="syncPrice" checked>
                                    <label class="form-check-label" for="syncPrice">
                                        <i class="bi bi-tag"></i> Цены
                                    </label>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="count" id="syncStock">
                                    <label class="form-check-label" for="syncStock">
                                        <i class="bi bi-stack"></i> Остатки
                                    </label>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="content" id="syncContent">
                                    <label class="form-check-label" for="syncContent">
                                        <i class="bi bi-card-text"></i> Название и описание
                                    </label>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="images" id="syncImages">
                                    <label class="form-check-label" for="syncImages">
                                        <i class="bi bi-images"></i> Изображения
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Маркетинговые флаги -->
                <div class="card mb-3">
                    <div class="card-header py-2 d-flex justify-content-between align-items-center">
                        <strong><i class="bi bi-megaphone"></i> Маркетинговые флаги</strong>
                        <button type="button" class="btn btn-sm btn-link p-0" id="toggleMarketingFields">Выбрать все</button>
                    </div>
                    <div class="card-body">
                        <div class="alert alert-secondary mb-3 py-2 small">
                            <i class="bi bi-lightbulb"></i>
                            <strong>Как это работает:</strong> здесь вы <em>выбираете какие флаги синхронизировать</em>, а не устанавливаете их.
                            Выбранные флаги будут отправлены в Recommerce с <em>текущими значениями</em> из системы.
                            На удалённом сайте установятся <strong>точно такие же значения</strong>, какие сейчас стоят у товара.
                        </div>
                        <div class="row g-2">
                            <div class="col-6 col-md-4">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="is_new" id="syncIsNew">
                                    <label class="form-check-label" for="syncIsNew">
                                        <span class="badge bg-warning text-dark me-1"><i class="bi bi-stars"></i></span> Новинки
                                    </label>
                                </div>
                            </div>
                            <div class="col-6 col-md-4">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="is_popular" id="syncIsPopular">
                                    <label class="form-check-label" for="syncIsPopular">
                                        <span class="badge bg-danger me-1"><i class="bi bi-fire"></i></span> Популярные
                                    </label>
                                </div>
                            </div>
                            <div class="col-6 col-md-4">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="is_special" id="syncIsSpecial">
                                    <label class="form-check-label" for="syncIsSpecial">
                                        <span class="badge bg-success me-1"><i class="bi bi-percent"></i></span> Спецпредложения
                                    </label>
                                    <div class="form-text text-muted small">Также авто при скидке</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Дополнительно -->
                <div class="card">
                    <div class="card-body py-2">
                        <div class="form-check form-switch mb-0">
                            <input class="form-check-input" type="checkbox" id="syncCreateNew">
                            <label class="form-check-label" for="syncCreateNew">
                                <strong>Создавать товары, если не найдены в Recommerce</strong>
                            </label>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
                <button type="button" class="btn btn-primary" id="startRecommerceSyncBtn">
                    <i class="bi bi-play-fill"></i> Запустить синхронизацию
                </button>
            </div>
        </div>
    </div>
</div>
