/* ============================================================
   Lista-oldal — HANDOFF redesign (a redesign.css tokenjeivel)
   ============================================================ */

/* ----- Rendezés-sáv ----- */
.rd-sortbar{ display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--rd-bd); border-radius:16px; padding:10px 16px; margin:0 0 24px; box-shadow:0 18px 40px -38px rgba(20,50,58,.5); flex-wrap:wrap; }
.rd-sortbar .rd-sort-label{ font-size:11.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--rd-mut3); }
.rd-sortbar .listByBox.rd-sort-pills{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; float:none; }
.rd-sort-pill{ padding:9px 16px; border-radius:999px; font-size:14px; font-weight:700; color:var(--rd-ink2) !important; background:transparent !important; border:none !important; transition:all .15s; text-decoration:none; }
.rd-sort-pill:hover{ background:var(--rd-accent-light) !important; color:var(--rd-accent-dark) !important; }
.rd-sort-pill.active{ background:var(--rd-accent) !important; color:#fff !important; box-shadow:0 8px 18px -8px var(--rd-accent); }
.rd-sort-pill .fa{ font-size:12px; }

/* ----- Csillagok (maszkolt SVG, mint az adatlapon) ----- */
.itemsList .comment_stars{ display:inline-flex; gap:1px; }
.itemsList .comment_stars .star{
  width:15px; height:15px; display:inline-block; background:var(--rd-star-empty);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2.5l2.9 6 6.6.9-4.8 4.6 1.2 6.5L12 18.6 6.1 21.5l1.2-6.5L2.5 9.4l6.6-.9z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2.5l2.9 6 6.6.9-4.8 4.6 1.2 6.5L12 18.6 6.1 21.5l1.2-6.5L2.5 9.4l6.6-.9z'/></svg>") center/contain no-repeat;
}
.itemsList .comment_stars .star.selected{ background:var(--rd-star); }

/* ----- Termék-grid ----- */
.itemsListPage{ display:grid !important; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:760px){ .itemsListPage{ grid-template-columns:repeat(2,1fr); gap:14px; } }
@media (max-width:430px){ .itemsListPage{ grid-template-columns:1fr; } }

/* ----- Kártya ----- */
.rd-list-card{ display:flex !important; flex-direction:column; background:#fff; border:1px solid var(--rd-bd); border-radius:18px; overflow:hidden; box-shadow:0 24px 50px -42px rgba(20,50,58,.5); transition:transform .18s ease, box-shadow .18s ease; text-align:left !important; width:auto !important; margin:0 !important; padding:0 !important; height:100%; }
.rd-list-card:hover{ transform:translateY(-4px); box-shadow:0 30px 56px -38px rgba(20,50,58,.55); }

/* kép */
.rd-list-pic{ position:relative; background:linear-gradient(165deg,#FBFCFC,#F2F7F6); padding:16px; }
.rd-list-imglink{ display:flex; align-items:center; justify-content:center; min-height:200px; }
.rd-list-pic .itemListImg{ max-width:100%; max-height:220px; width:auto; height:auto; object-fit:contain; mix-blend-mode:multiply; }

/* badge-ek a képen */
.rd-list-badges{ position:absolute; top:11px; left:11px; right:11px; z-index:2; display:flex; flex-direction:row; flex-wrap:wrap; gap:5px; align-items:flex-start; }
.rd-list-badges .rd-badge{ font-size:9.5px; font-weight:800; padding:3px 8px; border-radius:999px; letter-spacing:.02em; line-height:1.3; white-space:nowrap; text-transform:uppercase; }
.rd-badge-new{ background:var(--rd-accent); color:#fff; }
.rd-badge-sale{ background:#E0506B; color:#fff; }
.rd-badge-attr{ background:var(--rd-ink); color:#fff; }

/* body */
.rd-list-body{ padding:16px 18px 18px; display:flex; flex-direction:column; flex:1; }
.rd-list-rating{ display:flex; align-items:center; gap:7px; margin:0 0 8px !important; }
.rd-list-count{ font-size:12.5px; color:var(--rd-mut3); font-weight:600; }
.rd-list-name{ margin:0 0 10px !important; padding:0 !important; border:none !important; }
.rd-list-name a{ font-family:var(--rd-serif); font-size:19px; font-weight:700; color:var(--rd-accent-dark) !important; line-height:1.25; text-decoration:none; }
.rd-list-name a:hover{ color:var(--rd-accent) !important; }
.rd-list-price{ margin:0 0 10px !important; padding:0 !important; }
.rd-list-price .price{ font-size:24px; font-weight:800; color:var(--rd-ink); }
.rd-list-price .oldprice{ font-size:14px; color:var(--rd-mut3); text-decoration:line-through; font-weight:600; margin-right:8px; }
.rd-list-price .salePrice{ color:#E0506B; }
.rd-list-stock{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:#1B9E5A; margin:0 0 14px; }
.rd-list-stock.noStock{ color:#b26a00; }
.rd-list-dot{ width:8px; height:8px; border-radius:50%; background:#1B9E5A; box-shadow:0 0 0 3px rgba(27,158,90,.16); flex-shrink:0; }
.rd-list-dot-out{ background:#b26a00; box-shadow:0 0 0 3px rgba(178,106,0,.16); }
.rd-list-details{ margin-top:auto; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border:1.5px solid var(--rd-accent); border-radius:12px; color:var(--rd-accent-dark) !important; font-weight:800; font-size:14px; transition:all .15s; text-decoration:none; }
.rd-list-details:hover{ background:var(--rd-accent); color:#fff !important; }
.rd-list-details svg{ transition:transform .15s; }
.rd-list-details:hover svg{ transform:translateX(3px); }

/* Kor-attribútum badge rózsaszín (újszülött/3 éves kortól) */
.rd-badge-age{ background:#E0729A; color:#fff; }

/* Szűrő gomb (mobil) — finomított (agrianna-stílus) */
.rd-filter-btn{ background:#fff !important; color:var(--rd-ink2) !important; border:1.5px solid var(--rd-bd3) !important; border-radius:12px !important; font-weight:700 !important; padding:12px 18px !important; box-shadow:none !important; }
.rd-filter-btn:hover, .rd-filter-btn:active{ background:var(--rd-accent-light) !important; border-color:var(--rd-accent-30) !important; color:var(--rd-accent-dark) !important; }
.rd-filter-btn .fa{ color:var(--rd-accent) !important; margin-right:6px; }

/* Szűrő gomb: szöveg láthatóvá (font-size öröklés-fix #137) */
.rd-filter-btn{ font-size:15px !important; display:flex !important; align-items:center; justify-content:center; gap:8px; }
