/* ================================================================
   iranboschcenter.com — کروسل محصول
   یک ردیف، اسکرول لمسی، کارت‌های هم‌قد و هم‌عرض
   ================================================================ */

.pcar { max-width: var(--home-max, 1320px); margin: 2.25rem auto; padding: 0 var(--home-pad, 1rem); }

.pcar__box {
    background: #fff;
    border: 1px solid #eceef1;
    border-radius: 1.35rem;
    padding: 1.15rem 1.15rem 1.35rem;
    box-shadow: 0 4px 20px rgba(11, 27, 43, .05);
}

.pcar__head {
    display: flex; align-items: center; justify-content: space-between; gap: .75rem;
    margin-bottom: 1rem;
}
.pcar__title {
    margin: 0; font-size: 1.05rem; font-weight: 800; color: #0b1b2b;
    position: relative; padding-inline-start: .7rem;
}
.pcar__title::before {
    content: ''; position: absolute; inset-inline-start: 0; top: .18em; bottom: .18em;
    width: 4px; border-radius: 4px; background: var(--color-primary, #e20015);
}
.pcar__tools { display: flex; align-items: center; gap: .5rem; }
.pcar__all {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .78rem; font-weight: 700; color: #64748b; white-space: nowrap;
}
.pcar__all svg { width: 14px; height: 14px; }
.pcar__all:hover { color: var(--color-primary, #e20015); }

.pcar__nav { display: flex; gap: .35rem; }
.pcar__nav.is-hidden { visibility: hidden; }
.pcar__btn {
    width: 32px; height: 32px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid #e6e8ec; border-radius: 50%;
    background: #fff; color: #55637a; cursor: pointer;
    transition: background .15s, color .15s, border-color .15s, opacity .15s;
}
.pcar__btn svg { width: 15px; height: 15px; }
.pcar__btn:hover:not(:disabled) {
    background: var(--color-primary, #e20015); color: #fff; border-color: transparent;
}
.pcar__btn:disabled { opacity: .3; cursor: default; }

/* ---------------- ریل ---------------- */
.pcar__rail {
    display: flex;
    align-items: stretch;               /* کارت‌ها هم‌قد شوند */
    gap: .8rem;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: .15rem .15rem .4rem;       /* جا برای سایه کارت‌ها */
}
.pcar__rail::-webkit-scrollbar { display: none; }
/* is-dragging فقط بعد از عبور از آستانه‌ی درگ اضافه می‌شود (public/js/carousel.js)،
   وگرنه pointer-events: none جلوی رسیدنِ click به کارت را می‌گرفت و لینک‌ها
   با کلیک باز نمی‌شدند. */
.pcar__rail.is-dragging { cursor: grabbing; scroll-behavior: auto; }
.pcar__rail.is-dragging * { pointer-events: none; }
/* روی لمس اصلاً درگِ دستی نداریم؛ اسکرول بومی کار می‌کند */
@media (hover: none) { .pcar__rail.is-dragging * { pointer-events: auto; } }

.pcar__rail > .pcard {
    flex: 0 0 auto;
    width: 158px;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    /* در ریل افقی، تنبل‌سازی رندر باعث پرش ارتفاع می‌شود */
    content-visibility: visible;
    contain-intrinsic-size: auto;
}
@media (min-width: 480px)  { .pcar__rail > .pcard { width: 176px; } }
@media (min-width: 768px)  { .pcar__rail > .pcard { width: 196px; } }
@media (min-width: 1200px) { .pcar__rail { gap: 1rem; } .pcar__rail > .pcard { width: 214px; } }

/* ---------------- نظم کارت داخل ریل ----------------
   بدون این‌ها ارتفاع نام و تعداد بج‌ها هر کارت را به اندازه‌ای متفاوت
   می‌کشید و ردیف به‌هم‌ریخته دیده می‌شد. */
.pcar__rail > .pcard .pcard__body {
    display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0;
}
/* عنوان کامل. min-height می‌ماند تا عنوان‌های کوتاه هم‌چنان جای دو خط را
   بگیرند و کارت‌های یک ردیف هم‌تراز بمانند؛ عنوان بلندتر آزادانه رشد
   می‌کند به‌جای اینکه بریده شود. */
.pcar__rail > .pcard .pcard__name {
    display: block; overflow-wrap: anywhere;
    min-height: 2.9em; line-height: 1.45;
}
/* flex-wrap: nowrap بج‌ها را در یک ردیف می‌چپاند و text-overflow آن‌ها را
   به «…۱۴» و «ساخ…» تبدیل می‌کرد. حالا بج‌ها عرض طبیعی خودشان را دارند و
   هرچه در ردیف اول جا نشود، به‌جای له شدن، بریده می‌شود. */
.pcar__rail > .pcard .pcard__specs {
    max-height: 1.85rem; overflow: hidden;   /* فقط ردیف اول */
    flex-wrap: wrap;
}
.pcar__rail > .pcard .pcard__specs li { flex: 0 0 auto; }
.pcar__rail > .pcard .pcard__price { margin-top: auto; }
.pcar__rail > .pcard .pcard__img-wrap { aspect-ratio: 1 / 1; }
.pcar__rail > .pcard .pcard__img { width: 100%; height: 100%; object-fit: contain; }

@media (max-width: 700px) {
    .pcar { padding: 0 .75rem; }
    .pcar__box { padding: 1rem .85rem 1.15rem; border-radius: 1.1rem; }
    .pcar__nav { display: none; }          /* موبایل با انگشت اسکرول می‌شود */
    .pcar__title { font-size: .95rem; }
}