/* Карточка товара v2 (28.09.2026) — layouts/pages/product_v2.php, по макету владельца. Стиль сайта: #b74923, скругление 5px, Onest.
   Обычная цена коричневая (как на странице товара), со скидкой — красная, старая — чёрная зачёркнутая.
   Строка скидки не выходит за карточку: на узкой карточке сумма прячется, остаётся процент (container query). */
.card.cv2 {
    box-sizing: border-box; height: auto; min-height: 100%; padding: 10px; gap: 6px; border: 1px solid #efeae6; border-radius: 5px; background: #fff;
    container-type: inline-size; transition: box-shadow .2s;
}
@media (hover: hover) { .card.cv2:hover { box-shadow: 0 6px 18px rgba(28, 26, 25, .12); } }
.card.cv2 .card__img-wrap { height: auto; aspect-ratio: 1 / 1; min-height: 0; padding: 0; border-radius: 4px; overflow: hidden; }
.card.cv2 .card__img-wrap > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.card.cv2 .card__img-wrap img.card__img { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.card.cv2 .card__img-wrap .owl-wrapper-outer, .card.cv2 .card__img-wrap .owl-item, .card.cv2 .card__img-wrap .owl-item > a { height: 100%; }
.card.cv2 .card__img-wrap .owl-item > a { display: flex; align-items: center; justify-content: center; }
.cv2-badges { position: absolute; left: 18px; top: 18px; z-index: 3; display: flex; flex-direction: column; gap: 5px; align-items: flex-start; pointer-events: none; }
.cv2-badge { background: #d7322b; color: #fff; font-size: 12.5px; font-weight: 700; line-height: 1.3; padding: 3px 9px; border-radius: 5px; white-space: nowrap; }
.cv2-badge--top { background: #1f7a3a; }
.card.cv2 .cv2-heart { position: absolute; right: 12px; top: 12px; z-index: 3; width: 34px; height: 34px; border-radius: 50%; border: 0;
    background: rgba(255, 255, 255, .92); color: #8a817b; display: grid; place-items: center; padding: 0; cursor: pointer; }
.card.cv2 .cv2-heart.button__like_active { color: #b74923; }
.card.cv2 .cv2-heart.button__like_active path { fill: #b74923; }
@media (hover: hover) { .card.cv2 .cv2-heart:hover { color: #b74923; } }
.cv2-title { font-size: 14.5px; line-height: 1.3; color: #1c1a19; text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; margin-top: 2px; }
.cv2-title em { font-style: normal; color: #b74923; font-weight: 600; }
@media (hover: hover) { .cv2-title:hover { color: #b74923; } }
.cv2-facts { font-size: 12.5px; color: #6b625d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.cv2-rate { font-size: 12px; color: #5e5854; display: flex; align-items: center; gap: 6px; min-height: 18px; white-space: nowrap; overflow: hidden; }
.cv2-rate i { font-style: normal; background: #e53935; color: #fff; font-weight: 700; padding: 0 5px; border-radius: 3px; font-size: 11.5px; line-height: 16px; }
.cv2-drow { display: flex; align-items: center; gap: 6px; min-height: 22px; white-space: nowrap; overflow: hidden; }
.cv2-drow s { font-size: 13.5px; color: #1c1a19; }
.cv2-pct { background: #d7322b; color: #fff; font-weight: 800; font-size: 12.5px; padding: 2px 7px; border-radius: 5px 0 0 5px; }
.cv2-sum { border: 1.5px solid #d7322b; color: #d7322b; font-weight: 700; font-size: 12.5px; padding: 1px 7px; border-radius: 0 5px 5px 0; margin-left: -6px; }
.cv2-pr { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.cv2-pr b { font-size: 21px; font-weight: 800; color: #b74923; font-variant-numeric: tabular-nums; line-height: 1.15; white-space: nowrap; }
.cv2-pr b small { font-size: 13px; font-weight: 600; }
.card.cv2--sale .cv2-pr b { color: #d7322b; }
.cv2-sku { font-size: 11.5px; color: #8a817b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.card.cv2 .card__shop { padding: 0; margin-top: auto; padding-top: 4px; }
.card.cv2 .cv2-btn { width: 100%; min-width: 0; height: 40px; border-radius: 5px; background: #b74923; color: #fff; font-size: 14px; font-weight: 600;
    display: flex; align-items: center; justify-content: center; gap: 6px; border: 0; cursor: pointer; }
.card.cv2 .cv2-btn svg { position: static; width: 18px; height: 18px; }
.card.cv2 .cv2-btn svg path, .card.cv2 .cv2-btn svg circle { fill: none; }
.card.cv2 .cv2-btn svg circle { fill: currentColor; }
.card.cv2 .cv2-btn--order { background: #fff; color: #5e5854; border: 1px solid #d8cfc9; }
@media (hover: hover) {
    .card.cv2 .cv2-btn:hover { background: #9c3d1c; color: #fff; }
    .card.cv2 .cv2-btn--order:hover { background: #fff; border-color: #b74923; color: #b74923; }
}
.card.cv2 .cv2-btn:focus-visible, .card.cv2 .cv2-heart:focus-visible { outline: 2px solid #b74923; outline-offset: 2px; }
/* узкая карточка */
@container (max-width: 205px) { .cv2-sum { display: none; } .cv2-pct { border-radius: 5px; } }
@container (max-width: 190px) {
    .cv2-title { font-size: 13.5px; }
    .cv2-pr b { font-size: 18px; }
    .cv2-sku { display: none; }
    .cv2-drow s { font-size: 12px; }
    .card.cv2 .cv2-btn { height: 36px; font-size: 13px; }
    .cv2-drow { min-height: 20px; }
}
/* телефон: карточка не выше ячейки сетки (раньше отступы 10+10 px добавлялись к высоте и кнопка уходила под следующий ряд) */
@media (max-width: 600px) {
    .card.cv2 { padding: 8px; gap: 4px; }
    .card.cv2 .card__shop { padding-top: 2px; }
    .cv2-badges { left: 14px; top: 14px; }
    .card.cv2 .cv2-heart { right: 8px; top: 8px; }
}