/* =====================================================================
   1416 — Home Page "Best Sellers" carousel. Configurable module
   (rp_bestsellers): admin-picked products shown 5 at a time in a
   scroll-snap carousel with prev/next arrows. Loaded via addStyle().
   ===================================================================== */
.rp-bs { --red:#db0f16; --red-dark:#b50c12; --ink:#1c1c1c; --muted:#8a8a8a;
  --line:#e7e4df; --cream:#efe9e0; --cols:5; --gap:18px;
  font-family:'Outfit',sans-serif; margin:30px 0; }
.rp-bs * { box-sizing:border-box; }

/* header */
.rp-bs__head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 0 22px; }
.rp-bs__eyebrow { display:block; font-size:12.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--red); margin:0 0 6px; }
.rp-bs__eyebrow::before { content:"\2014\00a0\00a0"; }
.rp-bs__title { margin:0; font-size:30px; font-weight:800; letter-spacing:-.02em; color:var(--ink); }

.rp-bs__nav { display:flex; gap:10px; flex:0 0 auto; }
.rp-bs__arrow { width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--ink);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:background .15s, border-color .15s, color .15s; }
.rp-bs__arrow:hover { background:var(--red); border-color:var(--red); color:#fff; }
.rp-bs__arrow svg { width:20px; height:20px; }

/* carousel */
.rp-bs__viewport { overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.rp-bs__viewport::-webkit-scrollbar { display:none; }
.rp-bs__track { list-style:none; margin:0; padding:4px 0; display:flex; gap:var(--gap); }

.rp-bs__card { flex:0 0 calc((100% - (var(--gap) * (var(--cols) - 1))) / var(--cols)); scroll-snap-align:start;
  display:flex; flex-direction:column; border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden; }

/* media */
.rp-bs__media { position:relative; background:var(--cream); padding:18px; }
.rp-bs__badge { position:absolute; top:12px; left:12px; z-index:2; font-size:12px; font-weight:700; line-height:1;
  padding:6px 9px; border-radius:6px; color:#fff; }
.rp-bs__badge--disc { background:var(--red); }
.rp-bs__badge--new  { background:#1c1c1c; letter-spacing:.06em; }
.rp-bs__thumb { display:flex; align-items:center; justify-content:center; height:160px; }
.rp-bs__thumb img { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; }

/* body */
.rp-bs__body { display:flex; flex-direction:column; padding:16px 16px 18px; flex:1 1 auto; }
.rp-bs__type { font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 7px; }
.rp-bs__name { font-size:14px; font-weight:700; line-height:1.35; color:var(--ink); text-decoration:none; min-height:2.7em;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rp-bs__name:hover { color:var(--red); }

.rp-bs__footer { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-top:auto; padding-top:14px; }
.rp-bs__price-row { display:flex; align-items:baseline; gap:8px; }
.rp-bs__price-now { font-size:19px; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
.rp-bs__price-was { font-size:13px; color:var(--muted); text-decoration:line-through; }
.rp-bs__price-tax { display:block; font-size:11px; color:var(--muted); margin-top:2px; }

/* actions */
.rp-bs__actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.rp-bs__icon { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:9px; cursor:pointer;
  border:1px solid var(--line); background:#fff; color:var(--ink); transition:background .15s, color .15s, border-color .15s, transform .12s; }
.rp-bs__icon svg { width:19px; height:19px; }
.rp-bs__icon:hover { transform:translateY(-1px); }
.rp-bs__wish:hover { color:var(--red); border-color:var(--red); }
.rp-bs__cart { background:var(--red); border-color:var(--red); color:#fff; }
.rp-bs__cart:hover { background:var(--red-dark); border-color:var(--red-dark); }

/* responsive: 5 -> 4 -> 3 -> 2 -> ~1.4 per view */
@media (max-width:1200px){ .rp-bs { --cols:4; } }
@media (max-width:900px){ .rp-bs { --cols:3; } .rp-bs__title { font-size:26px; } }
@media (max-width:640px){ .rp-bs { --cols:2; } }
@media (max-width:440px){ .rp-bs { --cols:1.35; } }