/** Shopify CDN: Minification failed

Line 17:0 Unexpected "{"
Line 17:1 Unexpected "{"
Line 17:3 Expected identifier but found "'rufftail-smart-cart.css'"
Line 18:0 Unexpected "<"
Line 20:1 Expected identifier but found "%"
Line 21:0 Unexpected "{"
Line 21:1 Expected identifier but found "%"
Line 23:0 Unexpected "<"
Line 38:12 Unexpected "{"
Line 38:18 Expected ":"
... and 75 more hidden warnings

**/

{{ 'rufftail-smart-cart.css' | asset_url | stylesheet_tag }}
<script src="{{ 'rufftail-smart-cart.js' | asset_url }}" defer="defer"></script>

{%- assign cart_target = section.settings.unlock_threshold | times: 100 -%}
{%- assign free_delivery_target = section.settings.free_delivery_threshold | times: 100 -%}

<section
  id="RufftailSmartCart-{{ section.id }}"
  class="rufftail-smart-cart color-{{ section.settings.color_scheme }}"
  data-section-id="{{ section.id }}"
  data-money-format="{{ shop.money_format | escape }}"
  data-unlock-threshold="{{ cart_target }}"
  data-free-delivery-threshold="{{ free_delivery_target }}"
  data-delivery-fee="{{ section.settings.delivery_fee | times: 100 }}"
  data-handling-fee="{{ section.settings.handling_fee | times: 100 }}"
  data-late-fee="{{ section.settings.late_night_fee | times: 100 }}"
>
  <div class="rufftail-smart-cart__shell">
    <header class="rufftail-smart-cart__header">
      <div class="rufftail-smart-cart__header-copy">
        <h1>Cart</h1>
        <p>{{ cart.item_count }} items ready to checkout</p>
      </div>
    </header>

    <div class="rufftail-smart-cart__top-save">
      <span>Yay! You saved <strong>{{ 0 | money }}</strong> on this order</span>
    </div>

    <div class="rufftail-smart-cart__stack">
      <div class="rufftail-smart-cart__card">
        <div class="rufftail-smart-cart__card-head">
          <div>
            <h2>Your picks</h2>
            <p>Fast checkout, fresh add-ons below</p>
          </div>
        </div>

        <div class="rufftail-smart-cart__items">
          {%- if cart.item_count > 0 -%}
            {%- for item in cart.items -%}
              <article class="rufftail-cart-item">
                <div class="rufftail-cart-item__media">
                  {%- if item.image != blank -%}
                    {{ item.image | image_url: width: 220 | image_tag: class: 'rufftail-cart-item__image', loading: 'lazy', alt: item.product.title }}
                  {%- endif -%}
                </div>

                <div class="rufftail-cart-item__content">
                  <div class="rufftail-cart-item__copy">
                    <h3>{{ item.product.title }}</h3>
                    <p>
                      {%- if item.variant.title != 'Default Title' -%}
                        {{ item.variant.title }}
                      {%- else -%}
                        {{ item.product.type | default: 'Pet essential' }}
                      {%- endif -%}
                    </p>
                  </div>

                  <div class="rufftail-cart-item__foot">
                    <div class="rufftail-stepper">
                      <span>Qty {{ item.quantity }}</span>
                    </div>

                    <div class="rufftail-cart-item__pricing">
                      <strong>{{ item.final_line_price | money }}</strong>
                      {%- if item.original_line_price > item.final_line_price -%}
                        <span>{{ item.original_line_price | money }}</span>
                      {%- endif -%}
                    </div>
                  </div>
                </div>
              </article>
            {%- endfor -%}
          {%- else -%}
            <div class="rufftail-smart-cart__empty">
              <h3>Your cart is waiting</h3>
              <p>Add a few pet favourites and this quick cart will light up with deals.</p>
            </div>
          {%- endif -%}
        </div>
      </div>

      <div class="rufftail-smart-cart__card rufftail-smart-cart__summary">
        <div class="rufftail-smart-cart__card-head">
          <div>
            <h2>Bill Summary</h2>
          </div>
        </div>

        <div class="rufftail-smart-cart__rows">
          <div class="rufftail-smart-cart__row">
            <span>Item Total</span>
            <span>{{ cart.items_subtotal_price | money }}</span>
          </div>
          <div class="rufftail-smart-cart__row">
            <span>Delivery Fee</span>
            <span>{{ section.settings.delivery_fee | times: 100 | money }}</span>
          </div>
          <div class="rufftail-smart-cart__row">
            <span>Handling Fee</span>
            <span>{{ section.settings.handling_fee | times: 100 | money }}</span>
          </div>
          <div class="rufftail-smart-cart__row">
            <span>Late Night Fee</span>
            <span>{{ section.settings.late_night_fee | times: 100 | money }}</span>
          </div>
        </div>

        <div class="rufftail-smart-cart__pay">
          <span>To Pay</span>
          <strong>{{ cart.total_price | money }}</strong>
        </div>
      </div>

      <div class="rufftail-smart-cart__card rufftail-smart-cart__deal-card">
        <div class="rufftail-smart-cart__deal-head">
          <div class="rufftail-smart-cart__deal-title">
            <div>
              <h2>1 Steal Deal</h2>
              <p>Exclusive add-ons for your order</p>
            </div>
          </div>
        </div>

        <div class="rufftail-smart-cart__offer-progress">
          <div class="rufftail-smart-cart__offer-status">
            Add more to unlock your deal
          </div>
          <div class="rufftail-smart-cart__progress">
            <span style="width: 40%;"></span>
          </div>
        </div>
      </div>

      <div class="rufftail-smart-cart__card rufftail-smart-cart__progress-card">
        <div class="rufftail-smart-cart__progress-head">
          <div>
            <h2>Free delivery unlock</h2>
            <p>Free above {{ free_delivery_target | money }}</p>
          </div>
        </div>
        <div class="rufftail-smart-cart__progress rufftail-smart-cart__progress--green">
          <span style="width: 55%;"></span>
        </div>
      </div>
    </div>

    <div class="rufftail-smart-cart__sticky">
      <div class="rufftail-smart-cart__sticky-total">
        <span>To Pay</span>
        <strong>{{ cart.total_price | money }}</strong>
      </div>
      <a href="/checkout" class="rufftail-smart-cart__checkout">Proceed to Checkout</a>
    </div>
  </div>
</section>

{% schema %}
{
  "name": "Rufftail Smart Cart",
  "tag": "section",
  "class": "section section-rufftail-smart-cart",
  "settings": [
    {
      "type": "color_scheme",
      "id": "color_scheme",
      "label": "Color scheme",
      "default": "background-1"
    },
    {
      "type": "checkbox",
      "id": "show_wishlist",
      "label": "Show wishlist icon",
      "default": true
    },
    {
      "type": "range",
      "id": "unlock_threshold",
      "min": 500,
      "max": 5000,
      "step": 100,
      "label": "1 deal unlock threshold",
      "default": 800
    },
    {
      "type": "range",
      "id": "free_delivery_threshold",
      "min": 500,
      "max": 5000,
      "step": 100,
      "label": "Free delivery threshold",
      "default": 1000
    },
    {
      "type": "range",
      "id": "delivery_fee",
      "min": 0,
      "max": 300,
      "step": 5,
      "label": "Delivery fee",
      "default": 50
    },
    {
      "type": "range",
      "id": "handling_fee",
      "min": 0,
      "max": 100,
      "step": 5,
      "label": "Handling fee",
      "default": 10
    },
    {
      "type": "range",
      "id": "late_night_fee",
      "min": 0,
      "max": 100,
      "step": 5,
      "label": "Late night fee",
      "default": 20
    },
    {
      "type": "text",
      "id": "delivery_title",
      "label": "Delivery promise title",
      "default": "1-Hour Delivery in Pune"
    },
    {
      "type": "text",
      "id": "delivery_subtext",
      "label": "Delivery promise subtitle",
      "default": "Fast delivery based on your location"
    },
    {
      "type": "text",
      "id": "delivery_helper",
      "label": "Delivery helper text",
      "default": "Exact ETA based on address"
    },
    {
      "type": "checkbox",
      "id": "show_notes",
      "label": "Show tip and instructions card",
      "default": false
    }
  ],
  "blocks": [
    {
      "type": "unlock_offer",
      "name": "1 deal product",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "Offer product"
        },
        {
          "type": "text",
          "id": "label",
          "label": "Label",
          "default": "Exclusive add-on"
        },
        {
          "type": "range",
          "id": "unlock_price",
          "min": 1,
          "max": 25,
          "step": 1,
          "label": "Shown unlock price",
          "default": 1
        }
      ]
    },
    {
      "type": "upsell_product",
      "name": "You may like",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "Product"
        }
      ]
    },
    {
      "type": "bundle_product",
      "name": "Bought together",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "Product"
        }
      ]
    },
    {
      "type": "addon_product",
      "name": "Quick add-on",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "Product"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Rufftail Smart Cart"
    }
  ]
}
{% endschema %}