/* vim: set ts=2 sw=2 sts=2 et: */

/**
 * Copyright (c) 2001-present X-Cart Holdings LLC. All rights reserved.
 * See https://www.x-cart.com/license-agreement.html for license details.
 */

.add2cart-popup {
  --carousel-block-count: 3;
  --xc-add2cartpopup--carousel-item-button-min-width: calc(11 * var(--rhythmic-unit));
}

.add2cart-popup .item-box {
  display: grid;
  grid-template-columns: 1fr;
  grid-column-gap: calc(2 * var(--rhythmic-unit));
  grid-row-gap: var(--rhythmic-unit);
  width: 100%;
}

.add2cart-popup .added-item-message {
  display: none;
}

.add2cart-popup .item-thumbnail {
  text-align: center;
  display: flex;
  margin: 0 auto;
  background: var(--color-image-bg);
  transition: var(--mode-transition) background-color;
  align-self: flex-start;
}

.add2cart-popup .item-name {
  line-height: var(--line-height-computed);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-weight: bold;
  font-size: var(--font-size-big);
}

.add2cart-popup .item-price {
  margin-top: calc(var(--rhythmic-unit) / 2)
}

.add2cart-popup .item-buttons {
  display: grid;
  grid-gap: var(--rhythmic-unit);
  margin-top: var(--rhythmic-unit);
  grid-template-columns: repeat(auto-fill, minmax(var(--xc-add2cartpopup--carousel-item-button-min-width), 1fr));
}

.add2cart-popup .selected-attribute-values {
  margin: calc(var(--rhythmic-unit) / 2) 0 var(--rhythmic-unit) 0;
  padding: 0;
  list-style: none;
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
  color: var(--color-gray-text);
  transition: var(--mode-transition) color;
}

.add2cart-popup .item-change-attribute-values {
  display: none;
}

.add2-cart-products-block .items-list {
  margin-top: var(--sections-vspace);
}

.add2-cart-products-block .product-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
}

.add2-cart-products-block h2 {
  margin: 0 var(--page-hspace) 16px var(--page-hspace);
}

@media (min-width: 570px) {
  :root {
    --xc-add2cartpopup--item-img-width: calc(10 * var(--rhythmic-unit));
  }

  .add2cart-popup .item-box {
    grid-template-columns: var(--xc-add2cartpopup--item-img-width) 1fr;
  }

  .add2cart-popup .item-box-data {
    align-self: center;
  }

  .add2cart-popup .item-thumbnail img {
    max-width: 100%;
    height: auto;
  }
}

@media (min-width: 768px) {
  :root {
    --xc-add2cartpopup--item-img-width: max-content;
  }

  .add2cart-popup {
    --carousel-block-width: 200px;
  }
}

@media (min-width: 1200px) {
  .add2-cart-products-block h2 {
    margin-left: 0;
    margin-right: 0;
  }
}