/* ================================================================
   WISHLIST — Moon Juice style  (biomentor / myshop)
   Картка товару — та сама .fp-card, що й на "Переглянутих товарах"
   (css/homepage.css), плюс чекбокс масового вибору поверх неї.

   ВАЖЛИВО: обгортка картки навмисно НЕ має класу "card" — у
   main.min.css є велика окрема система стилів саме для
   .lk__wishlist-cards .card (під стару розмітку: висота картинки
   160px!important, min-height/padding/box-shadow картки, свій
   .checkbox тощо) — вона конфліктує з fp-card. Обгортка зветься
   .wishlist-card, і саме так її шукає JS (common.js).
   ================================================================ */

.lk__wishlist-cards.fp-grid {
  display: grid !important;
  gap: 24px !important;
}

/* Обгортка картки: лише позиціювання для чекбокса + розмір грід-комірки.
   Свого вигляду (рамка/паддінг/висота) не має — весь вигляд дає вкладена .fp-card. */
.lk__wishlist-cards .wishlist-card {
  position: relative;
}

/* Чекбокс масового вибору — вставлений прямо у .fp-card__img-wrap (яка вже
   має position:relative), тому прибитий до лівого НИЖНЬОГО кута фото —
   значок знижки зверху-зліва, серце зверху-справа, чекбокс знизу-зліва:
   три кути, нічого не плаває посередині фото. Звичайний .checkbox (рядок 2
   main.min.css, label 60×60 з іконкою всередині) — без конфліктів, бо
   .wishlist-card не матчить старі .lk__wishlist-cards .card-селектори. */
.lk__wishlist-cards .checkbox {
  left: 12px;
  right: auto;
  top: auto;
  bottom: 12px;
}
.lk__wishlist-cards .checkbox label {
  padding: 0 0 20px 15px;
  align-items: flex-end;
  justify-content: flex-start;
}
.lk__wishlist-cards .checkbox label .icon {
  margin-right: 0;
  background-color: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}
.lk__wishlist-cards .checkbox input[type="checkbox"]:checked + label .icon {
  border-color: #1A1A1A;
  background-color: #1A1A1A;
}

@media (max-width: 480px) {
  .lk__wishlist-cards.fp-grid { gap: 16px !important; }
}
