{{-- Side cart: slides in from the right. Filled by public/js/cart-drawer.js from the browser cart. --}}
<div class="cd-overlay" id="cdOverlay" hidden></div>
<aside class="cd" id="cartDrawer" aria-hidden="true" aria-label="Your cart" tabindex="-1"
       data-cart-url="{{ route('cart') }}" data-checkout-url="{{ route('checkout') }}" data-shop-url="{{ route('collection') }}">
  <div class="cd-head">
    <h3>Your Cart</h3>
    <span class="cd-count" id="cdCount"></span>
    <button type="button" class="cd-close" id="cdClose" aria-label="Close cart"><svg viewBox="0 0 24 24"><path d="M6 6l12 12M18 6L6 18"/></svg></button>
  </div>

  <div class="cd-cols"><span>Product</span><span>Qty.</span><span>Action</span></div>
  <div class="cd-body" id="cdBody"></div>

  <div class="cd-foot" id="cdFoot">
    <div class="cd-sub"><span>Subtotal :</span><b id="cdSub"></b></div>
    <div class="cd-btns">
      <a href="{{ route('cart') }}" class="btn">View cart</a>
      <a href="{{ route('checkout') }}" class="btn">Checkout</a>
    </div>
  </div>
</aside>