{{--
    Bloc « Aides déduites » (CMG Pajemploi + crédit d'impôt 50 %, barre de répartition,
    légende) suivi de la carte « Coût réel après CMG et crédit d'impôt ».

    Extrait tel quel de contracts/_form.blade.php pour être partagé entre la simulation de
    contrat (vue parent) et la modale « détail du mois » du dashboard parent, afin que les
    deux restent identiques au pixel près.

    Chaque valeur dynamique est passée en expression Alpine ; les valeurs par défaut
    reproduisent exactement le composant de simulation de contrat, donc l'inclusion depuis
    _form.blade.php ne change rien au rendu. La modale surcharge ces expressions pour lire
    un objet `detail.aids` pré-calculé côté PHP et fournit les mêmes helpers JS (`money`,
    `formattedPercent`) dans son `x-data`.
--}}
@php
    // La vue parent (modale « détail du mois ») réutilise ce bloc SANS le crédit d'impôt :
    // il est déclaré l'année suivante, donc il n'entre pas dans l'estimation du reste à
    // charge du mois. La simulation de contrat, elle, le garde ($showTaxCredit par défaut).
    $showTaxCredit = $showTaxCredit ?? true;
    $panelId = $panelId ?? 'cmg_detail_panel';
    $detailOpenExpr = $detailOpenExpr ?? 'showCmgDetail';
    $toggleDetailExpr = $toggleDetailExpr ?? 'toggleCmgDetail()';
    $moneyFn = $moneyFn ?? 'money';
    $formattedPercentFn = $formattedPercentFn ?? 'formattedPercent';
    $estimatedCmgExpr = $estimatedCmgExpr ?? "money(displayAmount(cmg.estimatedCmg)) + ' ' + periodSuffix()";
    $cmgDetailExpr = $cmgDetailExpr ?? 'cmg.detail';
    $effortRatePercentExpr = $effortRatePercentExpr ?? 'cmgEffortRatePercent()';
    $formulaComputedExpr = $formulaComputedExpr ?? 'cmgFormulaComputed()';
    $taxCreditExpr = $taxCreditExpr ?? "money(displayAmount(monthlyTaxCredit())) + ' ' + periodSuffix()";
    $taxCreditAnnualExpr = $taxCreditAnnualExpr ?? "'soit − ' + money(cmg.taxCreditAnnual) + ' /an'";
    $cmgPercentExpr = $cmgPercentExpr ?? 'cmgPercent()';
    $taxCreditPercentExpr = $taxCreditPercentExpr ?? 'taxCreditPercent()';
    $remainderPercentExpr = $remainderPercentExpr ?? 'remainderPercent()';
    $realCostExpr = $realCostExpr ?? 'money(displayAmount(cmg.realCostAfterTaxCredit))';
    $periodSuffixExpr = $periodSuffixExpr ?? 'periodSuffix()';
@endphp

<div class="contract-sim-section">
    <small class="contract-sim-section-title contract-sim-section-title--green">Aides déduites</small>
    <div class="contract-sim-line contract-sim-line--inline contract-sim-line--deduction">
        <span class="contract-sim-line-label-toggle">
            <span>CMG Pajemploi</span>
            <button type="button" class="contract-cmg-detail-toggle" x-on:click="{{ $toggleDetailExpr }}" x-bind:class="{ 'is-open': {{ $detailOpenExpr }} }" x-bind:aria-expanded="{{ $detailOpenExpr }}" aria-controls="{{ $panelId }}" aria-label="Afficher le détail du calcul de la CMG">
                <i class="ph-duotone ph-caret-down" aria-hidden="true"></i>
            </button>
        </span>
        <span class="contract-sim-leader" aria-hidden="true"></span>
        <strong x-text="'− ' + {{ $estimatedCmgExpr }}"></strong>
    </div>
    <div class="contract-cmg-detail-panel" id="{{ $panelId }}" x-show="{{ $detailOpenExpr }}" x-cloak>
        <template x-if="{{ $cmgDetailExpr }}">
            <div class="contract-cmg-detail-lines">
                <div class="contract-cmg-detail-row">
                    <span>Coût mensuel de la garde</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $moneyFn }}({{ $cmgDetailExpr }}.eligible_cost)"></strong>
                </div>
                <div class="contract-cmg-detail-row">
                    <span>Coût horaire de référence</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $moneyFn }}({{ $cmgDetailExpr }}.reference_hourly_cost) + '/h'"></strong>
                </div>
                <div class="contract-cmg-detail-row">
                    <span>Revenu mensuel de la famille</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $moneyFn }}({{ $cmgDetailExpr }}.resources_used)"></strong>
                </div>
                <div class="contract-cmg-detail-row">
                    <span>Taux d’effort applicable</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $effortRatePercentExpr }} + ' %'"></strong>
                </div>

                <p class="contract-cmg-detail-formula">CMG = coût mensuel de la garde × (1 − (revenu mensuel de la famille × taux d’effort applicable ÷ coût horaire de référence))</p>
                <p class="contract-cmg-detail-formula contract-cmg-detail-formula--filled" x-text="{{ $formulaComputedExpr }}"></p>

                <div class="contract-cmg-detail-divider" role="separator"></div>

                <span class="contract-cmg-detail-subtitle">Seuils et plafonds</span>
                <div class="contract-cmg-detail-row">
                    <span>Coût horaire de garde net</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $moneyFn }}({{ $cmgDetailExpr }}.minimum_hourly_cost) + ' / ' + {{ $moneyFn }}({{ $cmgDetailExpr }}.maximum_hourly_cost)"></strong>
                </div>
                <div class="contract-cmg-detail-row">
                    <span>Revenus mensuels</span>
                    <span class="contract-sim-leader" aria-hidden="true"></span>
                    <strong x-text="{{ $moneyFn }}({{ $cmgDetailExpr }}.minimum_monthly_resources) + ' / ' + {{ $moneyFn }}({{ $cmgDetailExpr }}.maximum_monthly_resources)"></strong>
                </div>
            </div>
        </template>
        <template x-if="!{{ $cmgDetailExpr }}">
            <p class="contract-cmg-detail-empty">Le détail du calcul s’affichera une fois toutes les informations disponibles.</p>
        </template>
    </div>
    @if ($showTaxCredit)
        <div class="contract-sim-line contract-sim-line--inline contract-sim-line--deduction">
            <span>Crédit d’impôt 50&nbsp;%</span>
            <span class="contract-sim-leader" aria-hidden="true"></span>
            <strong x-text="'− ' + {{ $taxCreditExpr }}"></strong>
            <small class="contract-sim-line-annual" x-text="{{ $taxCreditAnnualExpr }}"></small>
        </div>
    @endif
    <div class="contract-sim-bar" role="img" aria-label="{{ $showTaxCredit ? 'Répartition entre CMG, crédit d’impôt et reste à charge' : 'Répartition entre CMG et reste à charge' }}">
        <span class="contract-sim-bar-cmg" x-bind:style="'width: ' + {{ $cmgPercentExpr }} + '%'"></span>
        @if ($showTaxCredit)
            <span class="contract-sim-bar-credit" x-bind:style="'width: ' + {{ $taxCreditPercentExpr }} + '%'"></span>
        @endif
        <span class="contract-sim-bar-remainder" x-bind:style="'width: ' + {{ $remainderPercentExpr }} + '%'"></span>
    </div>
    <div class="contract-sim-legend">
        <small><i class="contract-sim-legend-cmg"></i><span x-text="'CMG ' + {{ $formattedPercentFn }}({{ $cmgPercentExpr }}) + '%'"></span></small>
        @if ($showTaxCredit)
            <small><i class="contract-sim-legend-credit"></i><span x-text="'Crédit d’impôt ' + {{ $formattedPercentFn }}({{ $taxCreditPercentExpr }}) + '%'"></span></small>
        @endif
        <small><i class="contract-sim-legend-remainder"></i><span x-text="'Reste ' + {{ $formattedPercentFn }}({{ $remainderPercentExpr }}) + '%'"></span></small>
    </div>
</div>

<div class="contract-sim-cost-real">
    <span class="contract-sim-cost-real-label">Estimation du coût après aides</span>
    <div class="contract-sim-cost-real-row">
        <div>
            <strong x-text="{{ $realCostExpr }}"></strong>
            <small x-text="{{ $periodSuffixExpr }}"></small>
        </div>
    </div>
</div>