{include file="_partials/head.tpl"}

<div class="cm-container cm-cart-page">

  <nav class="cm-breadcrumbs" aria-label="Хлібні крихти">
    <a href="/">{icon name="dashboard" size="14"}</a>
    <span class="cm-breadcrumbs__sep">›</span>
    <a href="/shop">Магазин</a>
    <span class="cm-breadcrumbs__sep">›</span>
    <span class="cm-breadcrumbs__current">Кошик</span>
  </nav>

  <header class="cm-cart-page__head">
    <h1 class="cm-cart-page__title">Кошик</h1>
    <span class="cm-cart-page__count" data-cm-cart-pagecount>0 товарів</span>
  </header>

  <div class="cm-cart-layout">
    <section class="cm-cart-list" data-cm-cart-list>
      {* Заполняется JS из localStorage. Запасной empty-state ниже. *}
      <div class="cm-cart-empty" data-cm-cart-empty>
        <div class="cm-cart-empty__ico" aria-hidden="true">{icon name="cart" size="64"}</div>
        <h3>Ваш кошик порожній</h3>
        <p>Додайте товари з каталогу — вони з'являться тут.</p>
        <a href="/shop" class="cm-btn cm-btn--primary cm-btn--lg">{icon name="arrow_left" size="16"} До покупок</a>
      </div>
    </section>

    <aside class="cm-cart-summary" data-cm-cart-summary hidden>
      <div class="cm-cart-summary__inner">
        <h3 class="cm-cart-summary__title">Ваше замовлення</h3>
        <div class="cm-cart-summary__row">
          <span>Товарів</span>
          <span data-cm-cart-summary-qty>0</span>
        </div>
        <div class="cm-cart-summary__row">
          <span>Сума</span>
          <span data-cm-cart-summary-subtotal>0 ₴</span>
        </div>
        <div class="cm-cart-summary__row">
          <span>Доставка</span>
          <span class="cm-cart-summary__free">безкоштовно</span>
        </div>
        <div class="cm-cart-summary__total">
          <span>Разом</span>
          <span data-cm-cart-summary-total>0 ₴</span>
        </div>
        <a href="/checkout" class="cm-btn cm-btn--primary cm-btn--lg cm-btn--block">
          Оформити замовлення {icon name="arrow_right" size="16"}
        </a>
        <a href="/shop" class="cm-cart-summary__continue">{icon name="arrow_left" size="14"} Продовжити покупки</a>

        <ul class="cm-cart-summary__perks">
          <li>{icon name="check" size="14"} Безкоштовна доставка від 1500 ₴</li>
          <li>{icon name="check" size="14"} Гарантія на всі товари</li>
          <li>{icon name="check" size="14"} Повернення протягом 14 днів</li>
        </ul>
      </div>
    </aside>
  </div>
</div>

{include file="_partials/foot.tpl"}
