{# Modals bons cadeaux (crédit + annulation), pilotées par ds-admin-bons.js.
   Le toggle réutilise le style gcc-toggle : charger ds-v2-pages.css sur la page. #}

{# ============ Modifier le crédit disponible ============ #}
<div class="adm-modal-overlay" data-sol-modal hidden>
    <div class="adm-modal adm-modal--wide">

        <div data-sol-view="edit">
            <h3 class="adm-modal-title">Modifier le crédit disponible</h3>
            <p class="adm-modal-text">Bon <strong class="adm-mono" data-sol-code></strong> — encaissement ou correction au comptoir.</p>

            <div class="gcc-toggle" role="tablist" aria-label="Type d'opération" data-sol-toggle>
                <span class="gcc-toggle-thumb" aria-hidden="true"></span>
                <button type="button" role="tab" class="gcc-toggle-opt is-active" data-sol-mode="operation" aria-selected="true">
                    Débit / Crédit
                </button>
                <button type="button" role="tab" class="gcc-toggle-opt" data-sol-mode="nouveau" aria-selected="false">
                    Nouveau montant
                </button>
            </div>

            <div class="adm-sol-grid">
                <div>
                    <div class="adm-sol-input">
                        <button type="button" class="adm-sol-sign" data-sol-sign title="Basculer débit / crédit">−</button>
                        <span class="adm-sol-dash" data-sol-dash aria-hidden="true"></span>
                        <input type="text" class="adm-sol-amount" data-sol-amount inputmode="numeric"
                               placeholder="00,00" autocomplete="off" spellcheck="false" aria-label="Montant en euros">
                        <span class="adm-sol-euro" aria-hidden="true">€</span>
                    </div>
                    <p class="adm-field-help" data-sol-help>Saisie type terminal : les centimes d'abord — tapez 7500 pour 75,00&nbsp;€.</p>
                    <p class="adm-sol-warn" data-sol-warn hidden></p>
                </div>
                <div class="adm-sol-recap">
                    <div class="adm-sol-row"><span>Crédit actuel</span><strong data-sol-actuel>—</strong></div>
                    <div class="adm-sol-row" data-sol-operation-row><span>Opération</span><strong data-sol-operation>—</strong></div>
                    <div class="adm-sol-row is-total"><span>Nouveau montant sur la carte</span><strong data-sol-nouveau>—</strong></div>
                </div>
            </div>

            <div class="adm-modal-actions" style="margin-top:18px;">
                <button type="button" class="adm-btn adm-btn--ghost adm-btn--sm" data-sol-cancel>Annuler</button>
                <button type="button" class="adm-btn adm-btn--sm" data-sol-submit disabled>Valider</button>
            </div>
        </div>

        <div data-sol-view="confirm" hidden>
            <h3 class="adm-modal-title">Valider la modification&nbsp;?</h3>
            <p class="adm-modal-text" data-sol-confirm-text></p>
            <div class="adm-modal-actions">
                <button type="button" class="adm-btn adm-btn--ghost adm-btn--sm" data-sol-confirm-cancel>Annuler les modifications</button>
                <button type="button" class="adm-btn adm-btn--sm" data-sol-confirm-ok>Valider ma modification</button>
            </div>
        </div>

    </div>
</div>

{# ============ Annuler le bon cadeau ============ #}
<div class="adm-modal-overlay" data-cancel-modal hidden>
    <div class="adm-modal">
        <h3 class="adm-modal-title">Annuler le bon cadeau&nbsp;?</h3>
        <p class="adm-modal-text" data-cancel-text></p>
        <label style="font-size:0.8rem;font-weight:600;color:var(--v2-ink-soft);" for="adm-cancel-note">Note interne (facultatif)</label>
        <textarea id="adm-cancel-note" class="adm-cancel-note" data-cancel-note maxlength="300"
                  placeholder="Ex. remboursé en boutique le …"></textarea>
        <div class="adm-modal-actions">
            <button type="button" class="adm-btn adm-btn--ghost adm-btn--sm" data-cancel-close>Retour</button>
            <button type="button" class="adm-btn adm-btn--danger adm-btn--sm" data-cancel-ok>Annuler le bon</button>
        </div>
    </div>
</div>