{%- doc -%}
  Renders the cart summary totals.
{%- enddoc -%}

<div class="cart__summary-totals">
  {% assign exchange_rate = 16000.0 %} {% comment %} SET YOUR USD RATE HERE {% endcomment %}

  {% # We need to keep this node in place to allow morphing to work properly # %}
  <div class="cart__original-total-container cart-primary-typography">
    {%- if cart.cart_level_discount_applications.size > 0 -%}
      <span class="cart__summary-item cart__original-total">
        <span class="cart__original-total-label">{{ 'content.cart_subtotal' | t }}</span>
        <span class="cart__original-total-value cart-secondary-typography">
           {% comment %} --- CUSTOM CURRENCY LOGIC START (Original Total) --- {% endcomment %}
           <span class="money" data-currency="IDR">{{- cart.original_total_price | money -}}</span>
           <span class="money" data-currency="USD" style="display:none;">
             {{ cart.original_total_price | divided_by: 100.0 | divided_by: exchange_rate | ceil | prepend: '$' }}
           </span>
           {% comment %} --- CUSTOM CURRENCY LOGIC END --- {% endcomment %}
        </span>
      </span>
      <div class="cart__summary-discounts">
        <ul
          class="discounts list-unstyled"
          role="list"
          aria-label="{{ 'content.discounts' | t }}"
        >
          {%- for discount in cart.cart_level_discount_applications -%}
            <li class="cart__summary-item cart__discount">
              <span class="cart__discount-label">
                {{- 'icon-discount.svg' | inline_asset_content -}}
                {{ discount.title | escape }}
              </span>
              <span class="cart__discount-value cart-secondary-typography"
                >-
                {% comment %} --- CUSTOM CURRENCY LOGIC START (Discount) --- {% endcomment %}
                <span class="money" data-currency="IDR">{{ discount.total_allocated_amount | money }}</span>
                <span class="money" data-currency="USD" style="display:none;">
                   {{ discount.total_allocated_amount | divided_by: 100.0 | divided_by: exchange_rate | ceil | prepend: '$' }}
                </span>
                {% comment %} --- CUSTOM CURRENCY LOGIC END --- {% endcomment %}
              </span>
            </li>
          {%- endfor -%}
        </ul>
      </div>
    {%- endif -%}
  </div>

  {% if settings.show_cart_note or settings.show_add_discount_code %}
    <div class="cart-actions">
      {% if settings.show_cart_note %}
        {% render 'cart-note' %}
      {% endif %}
      {% if settings.show_cart_note and settings.show_add_discount_code %}
        <div class="cart-actions__divider"></div>
      {% endif %}
      {% if settings.show_add_discount_code %}
        {% render 'cart-discount', section_id: section.id %}
      {% endif %}
    </div>
  {% endif %}

  {%- liquid
    if settings.currency_code_enabled_cart_total
      assign total_price = cart.total_price | money_with_currency
    else
      assign total_price = cart.total_price | money
    endif
  -%}

  <div class="cart__total-container">
    <span
      class="cart__summary-item cart__total"
      role="status"
    >
      <span class="cart__total-label cart-primary-typography">{{ 'content.cart_estimated_total' | t }}</span>
      <text-component
        ref="cartTotal"
        value="{{ total_price | strip_html }}"
        class="cart__total-value cart-secondary-typography"
        {% comment %} Used by payment_terms web component {% endcomment %}
        data-cart-subtotal
      >
        {% comment %} WWW - yasyfi multicurrency total price  {% endcomment %}
         
        <span class="money" data-currency="IDR">{{ total_price }}</span>
        <span class="money" data-currency="USD" style="display:none;">
           {{ cart.total_price | divided_by: 100.0 | divided_by: exchange_rate | ceil | prepend: '$' }}
        </span>
        {% comment %} WWW - yasyfi multicurrency {% endcomment %}

      </text-component>
    </span>
    {% if settings.show_installments %}
      <span class="cart__summary-item cart__installments">
        {% form 'cart', cart %}
          {{ form | payment_terms }}
        {% endform %}
      </span>
    {% endif %}
    <div class="cart__summary-item tax-note cart-primary-typography">
      {% render 'tax-info', has_discounts_enabled: settings.show_add_discount_code %}
    </div>
  </div>
</div>

<div class="cart__ctas">
  {% comment %} --- BUTTON SWITCHING LOGIC --- {% endcomment %}
  
  {% comment %} WWW - MULTICURRENCY CHECKOUT {% endcomment %}

  {% comment %} 1. IDR Only: Flik Button {% endcomment %}
  <div class="money" data-currency="IDR" style="width: 100%;">
      <button
        type="submit"
        id="checkout"
        class="cart__checkout-button button"
        name="checkout"
        {% if cart == empty %}
          disabled
        {% endif %}
        form="cart-form"
      >
        {{ 'content.checkout' | t }}
      </button>
  </div>
  
  {% comment %} WWW - MULTICURRENCY CHECKOUT {% endcomment %}

  {% comment %} 2. USD Only: Standard Checkout Button {% endcomment %}
  <div class="money" data-currency="USD" style="display:none; width: 100%;">
      <button
        type="submit"
        id="checkout"
        class="cart__checkout-button button"
        name="checkout"
        {% if cart == empty %}
          disabled
        {% endif %}
        form="cart-form"
      >
        {{ 'content.checkout' | t }}
      </button>
  </div>

  {% comment %} WWW - MULTICURRENCY CHECKOUT {% endcomment %}


  {% if additional_checkout_buttons and settings.show_accelerated_checkout_buttons %}
    <div class="additional-checkout-buttons additional-checkout-buttons--vertical">
      {{ content_for_additional_checkout_buttons }}
    </div>
  {% endif %}
</div>

{% stylesheet %}
  .cart-actions {
    display: flex;
    flex-direction: column;
    gap: var(--gap-sm);
    border-block: 1px solid var(--color-border);
    padding-block: var(--padding-sm);
    margin-block-start: var(--margin-3xs);
  }

  .cart-actions__divider {
    border-block-start: 1px solid var(--color-border);
  }

  .cart__summary-totals:not(:has(.cart-actions)) {
    margin-block-start: var(--margin-3xs);
    border-block-start: 1px solid var(--color-border);
    padding-block-start: var(--margin-xl);
  }

  .cart__installments {
    color: var(--color-foreground);
  }
{% endstylesheet %}