<!-- Confirmation Modal -->
<div id="confirm-modal" class="modal" role="dialog" aria-modal="true" aria-labelledby="confirm-modal-title">
    <div class="modal-content" style="max-width: 450px;">
        <div class="modal-header">
            <h2 id="confirm-modal-title" data-i18n="confirm.title">Confirm Action</h2>
            <button class="modal-close-btn" onclick="closeConfirmModal(false)" title="Close" data-i18n-aria-label="aria.close">&#x2715;</button>
        </div>
        <div class="modal-body">
            <p id="confirm-message" class="modal-description"></p>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" id="confirm-no-btn" onclick="closeConfirmModal(false)" data-i18n="confirm.no">No</button>
            <button class="btn btn-danger" id="confirm-yes-btn" onclick="closeConfirmModal(true)" data-i18n="confirm.yes">Yes</button>
        </div>
    </div>
</div>
