<?php
/**
 * Modal: Confirm Extra Credit Use (Sprint B.4.2 — Caso A)
 *
 * Lightweight confirmation modal triggered before a production starts
 * when the user's monthly quota is exhausted but they still have addon
 * (extras) balance. Asks the user to confirm consuming 1 extra credit
 * before the production runs — extras cost real money, silent debit
 * would feel like a "gotcha".
 *
 * Distinct from the B.3 buy modal:
 *   - B.3 = "comprar"  (multi-state, package grid, Stripe checkout)
 *   - B.4 = "consumir" (single confirmation, no purchase, instant action)
 *
 * Triggered by window.costudioConfirmExtra(extrasRemaining) which
 * returns a Promise resolving true (continue) or false (cancel).
 *
 * The remaining-count number is filled by JS on open — server-rendered
 * placeholder uses {extras_remaining} as a marker the JS replaces.
 *
 * @since 3.4.0
 */

defined( 'ABSPATH' ) || exit;
?>
<div id="fos-confirm-extra-modal"
     class="fos-modal"
     style="display:none"
     role="dialog"
     aria-modal="true"
     aria-labelledby="fos-confirm-extra-title">

    <div class="fos-modal__box fos-modal__box--confirm">

        <div class="fos-modal__header">
            <div class="fos-modal__title" id="fos-confirm-extra-title">
                ⚡ <?php esc_html_e( 'Use 1 extra credit?', 'contentosapp-studio' ); ?>
            </div>
            <button type="button"
                    class="fos-modal__close"
                    id="fos-confirm-extra-close"
                    aria-label="<?php esc_attr_e( 'Close', 'contentosapp-studio' ); ?>">&times;</button>
        </div>

        <div class="fos-modal__body">
            <div class="fos-confirm-extra__body">
                <p class="fos-confirm-extra__msg">
                    <?php esc_html_e( 'Your ContentOS Auto monthly quota is full. This managed-service production will use 1 of your extra credits.', 'contentosapp-studio' ); ?>
                </p>
                <?php // JS populates with current extras balance after deducting this 1 credit. ?>
                <p class="fos-confirm-extra__remaining" id="fos-confirm-extra-remaining"></p>
            </div>
        </div>

        <div class="fos-modal__footer fos-confirm-extra__footer">
            <button type="button" class="fos-btn fos-btn--ghost" id="fos-confirm-extra-cancel">
                <?php esc_html_e( 'Cancel', 'contentosapp-studio' ); ?>
            </button>
            <button type="button" class="fos-btn fos-btn--primary" id="fos-confirm-extra-confirm">
                <?php esc_html_e( 'Continue and produce', 'contentosapp-studio' ); ?>
            </button>
        </div>

    </div>
</div>
