/* ==========================================================================
   Конструктор ClothPrint — 15.09.2026
   ========================================================================== */

/* Кнопка «Создать дизайн» у варианта, которого нет в программе. Тройной
   класс: тема грузится после нас и при равном весе победила бы. */
.aa-clothprint-off.aa-clothprint-off.aa-clothprint-off {
  display: none !important;
}

/* Корзина: макет из конструктора вместо «Добавлено N шт» и ссылок на
   печатные файлы. Размеры в пикселях: у темы 1rem = 10px.

   Блок «Ваш дизайн» — отдельной строкой под товаром, миниатюры в ряд.
   В общей строке он забирал 110–130 px, и на экранах от 1440 px, где тема
   увеличивает фото товара до 160 px, названию оставалось 97 px: слово
   «Двусторонняя» уезжало под плашку размера (владелец, 15.09.2026).

   У темы для колонки файлов `width: 130px`, а ниже 1290 px ещё и
   `max-width: 110px` — снимаем, иначе миниатюры не помещаются в ряд.
   `:has` — чтобы остальные позиции корзины не трогать. */
.order-cart-cols .cart-product:has(.aa-clothprint-cart) > .views-field-field-user-files {
  order: 10;
  flex: 1 1 100%;
  width: auto;
  max-width: none;
}

/* Название позиции не сжимается до нечитаемого — у ЛЮБОЙ позиции корзины.
   Колонке товара задано `min-width: 0` (andre-anri-buttons.css), и от
   1440 px, где фото 160 px, у обычной футболки с приложенным фото название
   так же уезжало под размер. С полом в 300 px соседние колонки (цена)
   переносятся на следующую строку вместо наложения. Ниже 1024 px тема
   раскладывает строку иначе, там это не нужно. */
@media (min-width: 1024px) {
  .order-cart-cols .cart-product > .views-field-purchased-entity {
    min-width: 300px;
  }
}

/* Под фото товара, а не под флажком выбора: 24 px флажок + 18 px зазор.
   Только в широкой раскладке: ниже 1024 px фото стоит слева отдельно, и
   строка уже сдвинута отступом темы. */
@media (min-width: 1024px) {
  .order-cart-cols .cart-product:has(.aa-clothprint-cart) > .views-field-field-user-files {
    padding-left: 42px;
  }
}

/* Корзина на планшете и в суженном окне (768–1023 px) — у ЛЮБОЙ позиции.
   Тема ниже 1024 px ставит поля строки в столбик
   (`.cart-product { flex-direction: column }`), и базовая ширина колонки
   товара (220 px) превращалась в высоту: под названием зияла пустота,
   строка вырастала до 580 px, всё стояло по центру (владелец, 15.09.2026).
   Для телефона (до 767 px) это уже исправлено в andre-anri-buttons.css,
   здесь — тот же ряд с переносом для промежуточной ширины: название
   первой строкой, размер, количество и цена второй, макет третьей.
   Фото и флажок тема ставит абсолютно, отступы строки — её же. */
@media (min-width: 768px) and (max-width: 1023px) {
  .order-cart-cols .cart-product {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
  }

  .order-cart-cols .cart-product > .views-field-purchased-entity {
    flex: 1 1 100%;
    min-width: 0;
  }

  .order-cart-cols .cart-product > .views-field-total-price__number {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    margin-left: auto;
  }
}

.aa-clothprint-cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}

.aa-clothprint-cart__head {
  font-size: 14px;
  line-height: 1.3;
  opacity: 0.8;
}

.aa-clothprint-cart__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.aa-clothprint-cart__item {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 92px;
}

/* Миниатюра лежит на цвете ткани: белый принт на белом фоне корзины иначе
   был бы не виден.

   Правило темы `.cart-product img` рассчитано на фото товара: толстая
   синяя рамка, `min-width: 100px`, а ниже 1024 px ещё и
   `position: absolute` — на телефоне миниатюры уезжали поверх фото товара.
   Перебиваем весом (тема грузится после нас), рамку делаем такой же
   аккуратной, как у фото товара в корзине. */
.order-cart-cols .cart-product .aa-clothprint-cart__item img {
  position: static;
  top: auto;
  left: auto;
  display: block;
  width: 92px;
  min-width: 0;
  max-width: none;
  height: 92px;
  object-fit: contain;
  padding: 6px;
  border: 1px solid rgba(86, 160, 255, 0.3);
  border-radius: 14px;
  background: var(--aa-fabric, #2b3140);
}

@media (max-width: 767px) {
  .order-cart-cols .cart-product .aa-clothprint-cart__item {
    width: 72px;
  }

  .order-cart-cols .cart-product .aa-clothprint-cart__item img {
    width: 72px;
    height: 72px;
  }
}

.aa-clothprint-cart__item figcaption {
  font-size: 13px;
  line-height: 1.2;
  text-align: center;
}