/* =========================================================
   YPonton — каталожная карточка товара .shop-item (бренд-стиль)
   Область: архивы магазина/категорий/тегов, поиск, лента «Релевантные
   товары» под статьёй, related/upsell на карточке товара, главная.
   CSS-first: разметку content-product*.php НЕ трогаем.
   Токены бренда: navy #11233f, orange #f78e1f, border #e6eaf0, soft #f7f9fc,
   шрифты Onest (заголовки/кнопки) + Manrope (цена).
   ========================================================= */

/* ---------- карточка-рамка (видимая карточка = .shop-item-inner) ---------- */
.shop-item{ padding:0 14px !important; margin-bottom:28px !important; }
.shop-item .shop-item-inner{
  display:flex !important; flex-direction:column;
  height:100%;
  background:#fff;
  border:1px solid #e6eaf0 !important;
  border-radius:16px !important;
  padding:16px !important;
  box-shadow:0 1px 2px rgba(17,35,63,.03);
  transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.shop-item .shop-item-inner:hover{
  border-color:transparent !important;
  box-shadow:0 18px 44px rgba(17,35,63,.12);
  transform:translateY(-4px);
}

/* ---------- изображение (родное соотношение, без искажения) ---------- */
.shop-item .shop-item__image{
  position:relative;
  border-radius:12px;
  overflow:hidden;
  margin:0 0 16px !important;
  aspect-ratio:1 / 1;
  display:flex; align-items:center; justify-content:center;
  padding:14px;
}
.shop-item .shop-item__image img{
  width:100% !important; height:100% !important;
  object-fit:contain !important;
}

/* ---------- заголовок ---------- */
.shop-item .shop-item__title{ margin:0 0 10px !important; min-height:44px; }
.shop-item .shop-item__title a{
  font-family:'Onest', system-ui, sans-serif !important;
  font-weight:700 !important;
  font-size:16px !important;
  line-height:1.35 !important;
  color:#11233f !important;
  text-decoration:none !important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden;
  transition:color .15s ease;
}
.shop-item .shop-item__title a:hover{ color:#e07e12 !important; }

/* ---------- цена (прижата к низу для выравнивания рядов) ---------- */
.shop-item .shop-item__price{ margin:auto 0 0 !important; padding-top:6px; }
.shop-item .shop-item__price .price{ color:#11233f; }
.shop-item .shop-item__price .price .amount,
.shop-item .shop-item__price .woocommerce-Price-amount{
  font-family:'Manrope', system-ui, sans-serif !important;
  font-weight:800 !important;
  font-size:20px !important;
  color:#11233f !important;
}
.shop-item .shop-item__price .woocommerce-Price-currencySymbol{ font-weight:700; margin-left:2px; }
/* «от» у вариативных/диапазонных цен — приглушить */
.shop-item .shop-item__price .price del{ opacity:.5; font-weight:600; font-size:15px; }
.shop-item .shop-item__price .price ins{ text-decoration:none; }
/* Скидка в блоках, где цена обёрнута в .wpp-pr-wrap (похожие / недавно просмотренные
   на странице товара): штатная тем-диагональ `.price > del::after` не срабатывает,
   т.к. del — не прямой ребёнок .price. Повторяем чёткую красную диагональ тут.
   На архивах/категориях/скидках del — прямой ребёнок → диагональ даёт тема (не дублируем). */
.shop-item .shop-item__price .price .wpp-pr-wrap del{ position:relative; text-decoration:none; opacity:1; }
.shop-item .shop-item__price .price .wpp-pr-wrap del .woocommerce-Price-amount,
.shop-item .shop-item__price .price .wpp-pr-wrap del .amount{
  color:#8a93a2 !important; font-size:15px !important; font-weight:600 !important;
}
.shop-item .shop-item__price .price .wpp-pr-wrap del::after{
  content:""; position:absolute; left:-.12em; right:-.12em; top:50%; height:0;
  border-bottom:2px solid #f43c33; transform:rotate(-7deg); pointer-events:none;
}

/* ---------- кнопка «В корзину» (появляется на hover поверх фото) ---------- */
.shop-item .shop-item__buttons a.button,
.shop-item .shop-item__buttons .add_to_cart_button,
.shop-item .shop-item__buttons button{
  background:#f78e1f !important;
  color:#fff !important;
  border:0 !important;
  border-radius:10px !important;
  font-family:'Onest', system-ui, sans-serif !important;
  font-weight:700 !important;
  font-size:14px !important;
  padding:11px 20px !important;
  box-shadow:0 10px 24px rgba(247,142,31,.34) !important;
  transition:background .15s ease, transform .15s ease !important;
}
.shop-item .shop-item__buttons a.button:hover,
.shop-item .shop-item__buttons .add_to_cart_button:hover,
.shop-item .shop-item__buttons button:hover{
  background:#e07e12 !important; transform:translateY(-1px);
}
/* добавлено-в-корзину/loading — не ломать поведение AJAX */
.shop-item .shop-item__buttons .added_to_cart{ display:none !important; }

/* ---------- иконки (избранное / быстрый просмотр / сравнение) — скрыты ---------- */
.shop-item .shop-item__icons{ display:none !important; }

/* ---------- бейдж «Популярный товар» и пр. ---------- */
.shop-item .shop-item__badges{ z-index:3; }

/* ---------- нет в наличии ---------- */
.shop-item .shop-item__outofstock{
  font-family:'Onest', system-ui, sans-serif;
  font-weight:600; font-size:13px;
}

/* ---------- адаптив ---------- */
@media (max-width:768px){
  .shop-item{ padding:0 8px !important; margin-bottom:20px !important; }
  .shop-item .shop-item-inner{ padding:13px !important; border-radius:14px !important; }
  .shop-item .shop-item__title{ min-height:40px; }
  .shop-item .shop-item__title a{ font-size:15px !important; }
  .shop-item .shop-item__price .price .amount,
  .shop-item .shop-item__price .woocommerce-Price-amount{ font-size:18px !important; }
}
@media (max-width:480px){
  .shop-item .shop-item-inner{ padding:11px !important; }
  .shop-item .shop-item__image{ margin-bottom:12px !important; padding:10px; }
}