/* ПайПайПласт — пропозиції до товарів (02.10.2026, ppp-reco.php).
   Товари, яких немає: сіре фото, приглушені назва й ціна, позначка
   «Немає в наявності» — і завжди в кінці ряду чи списку. Блок «Ви нещодавно
   переглядали» — той самий ряд .prow, що й «Доп. товари» / «Аналоги»
   (на телефоні — гортається пальцем). Лише наші кольори й шрифти;
   body.ppp — щоб перебити Astra. */

/* ---------- компактні картки рядів: немає в наявності ---------- */
body.ppp .mcard{position:relative}
body.ppp .mcard.is-out:hover{border-color:var(--steel)}
body.ppp .mcard.is-out .mcard__img img{filter:grayscale(1);opacity:.5;transition:opacity .18s}
body.ppp .mcard.is-out:hover .mcard__img img{opacity:.75}
body.ppp .mcard.is-out .mcard__t{color:var(--secondary)}
body.ppp .mcard.is-out .mcard__p,
body.ppp .mcard.is-out .mcard__p *{color:var(--secondary)}
body.ppp .mcard__flag{position:absolute;top:18px;left:18px;width:max-content;max-width:calc(100% - 36px);
  font-family:var(--f-m);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.3;
  padding:5px 9px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line);color:var(--secondary);
  pointer-events:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- картки каталогу й пошуку: немає в наявності ----------
   (у списках вони вже в кінці — posts_clauses у ppp-catalog.php) */
body.ppp .pcard--out{opacity:1}
body.ppp .pcard--out:hover{border-color:var(--steel)}
body.ppp .pcard--out .pcard__media img{filter:grayscale(1);opacity:.5;transition:opacity .18s}
body.ppp .pcard--out:hover .pcard__media img{opacity:.75}
body.ppp .pcard--out .pcard__title a{color:var(--secondary)}
body.ppp .pcard--out .pcard__price,
body.ppp .pcard--out .pcard__price *{color:var(--secondary)}
body.ppp .pcard--out .pcard__badge{filter:grayscale(1);opacity:.75}

/* ---------- «Ви нещодавно переглядали» ---------- */
body.ppp .prow--seen[hidden]{display:none!important}
body.ppp .prow--seen{margin:40px 0 28px;padding-top:28px;border-top:1px solid var(--line)}
body.ppp .prow__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px}
body.ppp .prow .prow__head .prow__h{margin:0;min-width:0}
body.ppp .prow--seen .prow__clear,
body.ppp .prow--seen .prow__clear:hover,
body.ppp .prow--seen .prow__clear:focus{flex:0 0 auto;min-height:40px;padding:0 4px;margin:0;border:0;border-radius:8px;
  background:none;box-shadow:none;font-family:var(--f-t);font-size:14px;font-weight:500;line-height:1;
  color:var(--secondary);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
body.ppp .prow--seen .prow__clear:hover{color:var(--flame)}
body.ppp .prow--seen .prow__clear:focus-visible{outline:2px solid var(--flame);outline-offset:2px}

/* кошик: окремий рядок під товарами й підсумком, на всю ширину */
body.ppp.woocommerce-cart .woocommerce > .prow--seen{grid-column:1 / -1;margin:40px 0 0}
/* 404: під темним блоком, на світлому тлі */
body.ppp .ppp-seen-404{padding-bottom:12px}
body.ppp .ppp-seen-404 .prow--seen{border-top:0;margin-top:36px;padding-top:0}

@media (max-width:900px){
  body.ppp .prow--seen{margin-top:28px;padding-top:22px}
  body.ppp.woocommerce-cart .woocommerce > .prow--seen{margin-top:32px}
}
@media (max-width:480px){
  body.ppp .mcard__flag{top:16px;left:16px;max-width:calc(100% - 32px);font-size:9.5px;padding:4px 8px}
}

/* кошик: блок «нещодавно» — у самому кінці сітки кошика, а не між кроками й товарами (02.10.2026) */
body.ppp.woocommerce-cart .woocommerce > .prow--cart{grid-column:1 / -1;grid-row:9;margin-top:28px}