/* Активное состояние избранного на карточках и PDP */
.pcard__wish.is-active,
.pcard__icon.is-active,
[data-favourite].is-active {
  color: #d92740;
}

.pcard__wish.is-active svg,
.pcard__icon.is-active svg,
[data-favourite].is-active svg {
  fill: currentColor;
  stroke: currentColor;
}

.product-summary__tools [data-favourite].is-active {
  color: #d92740;
}

/* Страница избранного */
.favourites-shell {
  box-sizing: border-box;
  width: 100%;
}

.favourites-page,
.favourites-empty {
  max-width: 1280px;
  margin: 0 auto;
  padding: 28px 20px 76px;
  color: var(--bo-ink);
  font-family: Montserrat, Arial, sans-serif;
  box-sizing: border-box;
}

.favourites-page *,
.favourites-empty * {
  box-sizing: border-box;
}

.favourites-page__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 28px;
}

.favourites-page h1,
.favourites-empty h1 {
  margin: 0;
  font-size: clamp(34px, 4vw, 50px);
  line-height: 1.05;
  letter-spacing: -0.04em;
  font-weight: 800;
}

.favourites-page__head p,
.favourites-empty p {
  margin: 0;
  color: var(--bo-muted, #687178);
  font-size: 15px;
}

.favourites-empty {
  display: grid;
  align-content: start;
  gap: 16px;
}

.favourites-empty .site-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 8px;
  background: var(--bo-yellow, #ffc700);
  color: var(--bo-ink, #21282b);
  font-weight: 700;
  text-decoration: none;
}

.favourites-empty .site-btn:hover {
  background: #edb900;
}

.favourites-page__loading {
  color: var(--bo-muted, #687178);
  padding: 24px 0;
}

.favourites-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.favourites-card {
  position: relative;
}

@media (max-width: 1100px) {
  .favourites-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  .favourites-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}

@media (max-width: 420px) {
  .favourites-grid {
    grid-template-columns: 1fr;
  }
}
