{% load input_field %}
<div class="question-well fact-sheets {% if derived.fact_sheet_d_error %}error{% endif %}">
    <h1>Child(ren) 19 Years or Older (Fact Sheet D)</h1>
    <p>
        Since you have previously indicated that you have a child/children 19 years of age or older for whom support
        is claimed, you will need to answer the next set of questions.
    </p>

    <div class="question-well">
        <p>
            How many child(ren) are 19 years or older for whom you are asking for support?
        </p>
        <div>
            {% input_field type="number" name="number_children_over_19_need_support" class="fact-sheet-input input-narrow positive-integer" %}
        </div>
    </div>

    <div class="question-well">
        <p>
            What would the child support amount be using the Federal Child Support Guidelines?
            <b>This information is needed for the Judge. You will be able to indicate a different child support amount in a following step.</b>
        </p>
        <div>
            {% if derived.show_fact_sheet_b or derived.show_fact_sheet_c %}
                <div class="dollar-prefix">
                    {% money_input_field id="total_spouse_paid_child_support" name="total_spouse_paid_child_support" value=derived.guideline_amounts_difference_total class="fact-sheet-input money input-narrow form-block response-textbox" readonly="" %}
                </div>
            {% else %}
                <div class="dollar-prefix">
                    {% money_input_field name="total_spouse_paid_child_support" value_src="payor_monthly_child_support_amount" class="fact-sheet-input money input-narrow form-block response-textbox" readonly="" %}
                </div>
            {% endif %}
        </div>
        {% include "partials/inline_question_determine_amount_to_pay.html" with collapse_target_id="collapse_calculate_amounts" %}
    </div>

    <div class="question-well-border-less">
        <p>
            Because you have a child(ren) 19 years or older, who may also be contributing to their own support, do you and your spouse agree that the
            monthly Guidelines table amount for child support is appropriate?
            {% if agree_to_guideline_child_support_amount_error %}{% include 'partials/required.html' with inline=True %}{% endif %}
        </p>
        <div class="btn-radio-group" data-toggle="buttons">
            <label class="btn btn-radio">
                {% input_field type="radio" name="agree_to_guideline_child_support_amount" class="fact-sheet-input" autocomplete="off" value="YES" data_target_id="enter_appropriate_amount" data_reveal_target="false" %}
                Yes
            </label>

            <label class="btn btn-radio">
                {% input_field type="radio" name="agree_to_guideline_child_support_amount" class="fact-sheet-input" autocomplete="off" value="NO" data_target_id="enter_appropriate_amount" data_reveal_target="true" %}
                No
            </label>
        </div>
        <div id="enter_appropriate_amount" hidden>
            <p>
                What would be the appropriate amount?
                {% if appropriate_spouse_paid_child_support_error %}{% include 'partials/required.html' with inline=True %}{% endif %}
            </p>

            <div class="dollar-prefix">
                {% money_input_field name="appropriate_spouse_paid_child_support" class="fact-sheet-input money form-block response-textbox" %}
            </div>
            <p>
                Please describe - Why do you think the court should approve your proposed amount?
            </p>
            <p>
                Describe the condition, means, needs, and other circumstances of the child, and the financial
                ability of
                each parent to provide support to the child. {% if suggested_child_support_error %}{% include 'partials/required.html' with inline=True %}{% endif %}
            </p>
            <div>
                {% input_field type="textarea" name="suggested_child_support" class="fact-sheet-input form-control response-textarea" maxlength="500" rows="5" %}
            </div>
        </div>
    </div>
</div>
