{% set cart = guest.cart_get %}
<div class="accordion-item">
    <h2 class="accordion-header">
        <button class="accordion-button {% if not request.checkout %}collapsed{%endif%}" type="button" data-bs-toggle="collapse" data-bs-target="#checkout" aria-expanded="false" aria-controls="checkout">
            <svg class="svg-icon me-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,18A2,2 0 0,1 19,20A2,2 0 0,1 17,22C15.89,22 15,21.1 15,20C15,18.89 15.89,18 17,18M1,2H4.27L5.21,4H20A1,1 0 0,1 21,5C21,5.17 20.95,5.34 20.88,5.5L17.3,11.97C16.96,12.58 16.3,13 15.55,13H8.1L7.2,14.63L7.17,14.75A0.25,0.25 0 0,0 7.42,15H19V17H7C5.89,17 5,16.1 5,15C5,14.65 5.09,14.32 5.24,14.04L6.6,11.59L3,4H1V2M7,18A2,2 0 0,1 9,20A2,2 0 0,1 7,22C5.89,22 5,21.1 5,20C5,18.89 5.89,18 7,18M16,11L18.78,6H6.14L8.5,11H16Z" /></svg>
            <span>{{ 'Cart'|trans }}</span>&nbsp;<span class="badge bg-success">{{ cart.items | length }}</span>
        </button>
    </h2>
    {% if cart.items %}
    <div id="checkout" class="accordion-collapse collapse {% if request.checkout and client %}show{%endif%}" data-bs-parent="#orderManager">
        <div class="accordion-body">
            <div class="accordion-inner" id="checkout-inner">
                <table class="table table-striped table-bordered table-sm">
                    <thead>
                    <tr>
                        <th>{{ 'Product'|trans }}</th>
                        <th>{{ 'Price'|trans }}</th>
                        <th style="width: 3%; text-align: center"></th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for i, item in cart.items %}
                        <tr>
                            <td>
                                {{ item.title }}
                                {% if item.quantity > 1 %}
                                    x {{ item.quantity }}
                                {% endif %}

                                {% if item.period %}
                                    ({{ item.period | period_title }})
                                {% endif %}
                            </td>
                            <td>
                                {% if item.discount_price %}
                                    <del>{{ item.total | money_convert }}</del>
                                    <strong class="text-success">{{ (item.total-item.discount_price) | money_convert }}</strong>


                                {% else %}
                                    {{ (item.total) | money_convert }}
                                {% endif %}
                            </td>
                            <td><button data-cart-item-id="{{ item.id }}" class="btn btn-dark btn-sm remove-cart-item" title="{{ 'Remove item'|trans }}"><strong><i class="awe-remove"></i></strong></button></td>
                        </tr>

                        {% if request.show_custom_form_values %}
                            <tr>
                                <td>
                                    {% if item.form_id and guest.extension_is_on({"mod":"formbuilder"}) %}
                                        {% set form = guest.formbuilder_get({"id": item.form_id}) %}
                                        {# debug form #}
                                        <div class="well">
                                            <dl class="row">
                                                {% for field, value in item %}
                                                    {% for form_field in form.fields %}
                                                        {% if value is not empty %}
                                                            {% if form_field.name == field%}
                                                                <dt>
                                                                    {{form_field.label}}
                                                                </dt>
                                                                <dd>
                                                                    {% if form_field.type == "checkbox"%}
                                                                        {% for selection in value %}
                                                                            {% for field_key,field_value in form_field.options%}
                                                                                {% if field_value == selection %}
                                                                                    {{ field_key }}
                                                                                {% endif %}
                                                                            {% endfor %}
                                                                        {% endfor%}
                                                                    {% elseif form_field.type == "select" or form_field.type == "radio" %}
                                                                        {% for field_key,field_value in form_field.options%}
                                                                            {% if field_value == value %}
                                                                                {{ field_key }}
                                                                            {% endif %}
                                                                        {% endfor %}
                                                                    {% else %}
                                                                        {{value}}
                                                                    {% endif %}
                                                                </dd>
                                                            {% endif %}
                                                        {% endif %}
                                                    {% endfor %}
                                                {% endfor %}
                                            </dl>
                                        </div>
                                    {% endif %}
                                </td>
                                <td></td>
                            </tr>
                        {% endif %}

                        {% if item.setup_price != 0 %}
                            <tr>
                                <td>{{ item.title }} {{ 'setup'|trans }}</td>
                                <td>
                                    {% if item.discount_setup %}
                                    <del>{{ item.setup_price | money_convert }}</del>
                                    {{ (item.setup_price - item.discount_setup) | money_convert }}
                                    {% else %}
                                    {{ item.setup_price | money_convert }}</td>
                                {% endif %}
                            </tr>
                        {% endif %}

                    {% endfor %}
                    </tbody>
                </table>

                <div class="row-fluid">
                    <div class="span6">
                        {% if not cart.promocode %}
                            <a href="#" id="show-promo-field">{{ 'Have a coupon code?'|trans }}</a>
                        {% endif %}

                        <form action="{{ 'api/guest/cart/apply_promo'|link }}" method="post" class="api-form well" data-api-msg="{{ 'Promo code was applied for your order'|trans }}"
                            data-api-reload="1" {% if not cart.promocode %}style="display:none"{% endif %} id="apply-promo">
                            <input type="hidden" name="CSRFToken" value="{{ CSRFToken }}"/>
                            <div class="control-group">
                                <div class="form-controls">
                                    <div class="input-append">
                                        <input class="span8" type="text" name="promocode" id="promocode" value="{{ request.promocode|default(cart.promocode) }}" {% if promo.required %}required="required"{% endif %} placeholder="{{ 'Enter code'|trans }}">
                                        {% if cart.promocode %}
                                            <a class="btn btn-warning btn-sm mb-1 api-link" href="{{ 'api/guest/cart/remove_promo'|link({ 'CSRFToken': CSRFToken }) }}" type="button" data-api-reload="1">{{ 'Remove'|trans }}</a>
                                        {% else %}
                                            <button class="btn btn-primary btn-sm mb-1" type="submit">{{ 'Apply'|trans }}</button>
                                        {% endif %}
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>

                    <div class="span6">
                        <table class="table table-bordered table-striped">

                            {% if cart.discount >0 %}
                                <tr>
                                    <td><strong>{{ 'Subtotal:'|trans }}</strong></td>
                                    <td><strong>{{ (cart.subtotal)| money_convert }}</strong></td>
                                </tr>
                                <tr>
                                    <td><strong>{{ 'Discount:'|trans }}</strong></td>
                                    <td><strong>- {{ cart.discount | money_convert }}</strong></td>
                                </tr>
                            {% endif %}

                            {% set tax_amount = 0 %}
                            {% if client.client_is_taxable %}
                                {% set tax_rate = client.invoice_get_tax_rate %}
                                {% set tax_amount = cart.total * tax_rate / 100 %}
                                <tr>
                                    <td><strong>{{ 'VAT'|trans }} ({{ tax_rate }}%) :</strong></td>
                                    <td><strong>{{ tax_amount | money_convert }}</strong></td>
                                </tr>
                            {% endif %}
                            <tr>
                                <td><strong>{{ 'Total:'|trans }}</strong></td>
                                <td><strong>{{ (cart.total + tax_amount) | money_convert }}</strong></td>
                            </tr>

                        </table>

                        <form class="api-form" method="post" action="{{ 'api/client/cart/checkout'|link }}" data-api-jsonp="onOrderCheckout">
                            <input type="hidden" name="CSRFToken" value="{{ CSRFToken }}"/>
                            <fieldset>
                                {% set enough_in_balance = client.client_balance_get_total >= cart.total %}
                                {% if cart.total and not enough_in_balance %}
                                    <div class="control-group">
                                        {% for gtw in guest.invoice_gateways %}
                                            {% if cart.currency.code in gtw.accepted_currencies %}
                                                <label class="radio" for="{{gtw.id}}">
                                                    <input type="radio" name="gateway_id" id={{gtw.id}} value="{{gtw.id}}" {{ loop.first ? 'checked' : '' }}/>
                                                    {{ 'Pay by'|trans }} {{ gtw.title }}
                                                </label>
                                            {% endif %}
                                        {% endfor %}
                                    </div>
                                {% endif %}
                                <div class="control-group">
                                    <div class="controls mt-3">
                                        {% if enough_in_balance %}
                                            <p>{{ 'Total amount will be deducted from account balance'|trans }}</p>
                                        {% endif %}
                                        {% if settings.checkout_tos == 'explicit' %}
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault" required>
                                                <label class="form-check-label" for="flexCheckDefault">
                                                    {# TODO: Make this translatable once support for placeholders is implemented #}
                                                    <span>I agree to the <a href="{{ '/tos'|link }}" target="_blank">{{ 'terms of service'|trans }}</a> and <a href="{{ '/privacy-policy'|link }}" target="_blank">{{ 'privacy policy'|trans }}</a>.</span>
                                                </label>
                                            </div>
                                        {% endif %}
                                        <button id="checkoutButton" class="btn btn-primary btn-large" type="submit" {% if not client %} hidden="true" {% endif %}>{{ 'Checkout'|trans }}</button>
                                        <p id="loginMessage" {% if client %} hidden="true" {% endif %}>{{ 'You must first login / create an account before you can checkout.'|trans }}</p>
                                    </div>
                                </div>
                            </fieldset>
                            {% if settings.checkout_tos == 'implicit' %}
                                {# TODO: Make this translatable once support for placeholders is implemented #}
                                <span class="text-muted">By completing your order, you agree to our <a href="{{ '/tos'|link }}" target="_blank">{{ 'terms of service'|trans }}</a> and <a href="{{ '/privacy-policy'|link }}" target="_blank">{{ 'privacy policy'|trans }}</a>.</span>
                            {% endif %}
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% endif %}
</div>

<script type="text/javascript">
    $('.remove-cart-item').on('click', function(e) {
        e.preventDefault();

        var btn = $(this);

        if (confirm("{{ 'Are you sure you want to remove this item from cart?'|trans }}")) {
            var item_id = $(btn).attr('data-cart-item-id');

            bb.post("guest/cart/remove_item", { id: item_id, CSRFToken: "{{ CSRFToken }}" }, function(r) {
                FOSSBilling.message("{{ 'Item was removed from cart'|trans }}");
                location.reload(false);
            });
        }
    });
</script>
