/* پیشنهادهای مرتبط زیر مطالب — کارت تخت دیزاین‌سیستم (بردر #EBF0F5، شعاع ۱۲، بدون سایه)
   روی اسلایدر Splide تم؛ همان ابعاد ۲۹۶/۲۴ بقیه‌ی اسلایدرهای سایت. */
.irb-rel {
    margin: 40px 0 0;
}
.irb-rel + .irb-rel,
.irb-rel + .irb-rel__entities {
    margin-top: 32px;
}
/* گرید: ردیف اول سربرگ + پیکان‌ها، ردیف دوم ترک. پیکان‌ها باید فرزند مستقیم .splide بمانند */
.irb-rel__slider {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 16px;
    row-gap: 16px;
}
/* جای صریح: Splide پیکان‌های ساخته‌ی خودش را اولین فرزند ریشه درج می‌کند و بدون این،
   جای‌گذاری خودکار گرید سربرگ را به ستون دوم می‌راند */
.irb-rel__slider > .irb-rel__head {
    grid-row: 1;
    grid-column: 1;
}
.irb-rel__slider > .splide__arrows {
    grid-row: 1;
    grid-column: 2;
    display: flex;
    align-items: center;
    gap: 8px;
}
.irb-rel__slider > .splide__track {
    grid-row: 2;
    grid-column: 1 / -1;
}
.irb-rel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    min-width: 0;
}
.irb-rel h2.irb-rel__title {
    margin: 0;
    color: #0f172a;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 22px;
    line-height: 32px;
    font-weight: 400;
    font-variation-settings: "wght" 700, "KSHD" 100;
}
.irb-rel .irb-rel__more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    font-size: 14px;
    line-height: 22px;
    text-decoration: none;
    white-space: nowrap;
}
.irb-rel .irb-rel__more:hover {
    color: #185adb;
}
/* تم `.splide .splide__arrows .splide__arrow` را با (0,3,0) و !important می‌نویسد
   (min-width/height 48، بردر خاکستری، disabled نامرئی) — این‌ها عمداً (0,4,0)اند تا ببرند */
.irb-rel .splide .splide__arrows .splide__arrow {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    width: 32px;
    height: 32px;
    padding: 0;
    transform: none;
    border: 1px solid #EBF0F5 !important;
    border-radius: 999px;
    background: #fff !important;
    color: #475569;
    opacity: 1;
}
.irb-rel .splide .splide__arrows .splide__arrow:hover:not(:disabled) {
    border-color: #185adb !important;
    color: #185adb;
}
/* غیرفعال محو می‌ماند نه ناپدید: جای ثابت، بدون پرش چیدمان هنگام اسکرول */
.irb-rel .splide .splide__arrows .splide__arrow:disabled {
    opacity: .35;
    cursor: default;
    pointer-events: none;
}
/* آیکن، پیکانِ توپرِ خود Splide است (تم fill: #C6D0DF می‌دهد) — با رنگ دکمه هم‌رنگش می‌کنیم */
.irb-rel .splide .splide__arrows .splide__arrow svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}
/* تم `.splide .splide__arrows .splide__arrow svg` را با `transform: scaleX(1) !important`
   صاف می‌کند و چرخشِ RTL خود Splide را می‌کُشد (منتظر کلاس .flip است). پس با !important و
   ویژگی بالاتر برمی‌گردانیم: در راست‌به‌چپ «بعدی» باید به چپ اشاره کند */
.irb-rel .splide .splide__arrows .splide__arrow--next svg {
    transform: scaleX(-1) !important;
}
.irb-rel__slider .splide__list {
    margin: 0;
    padding: 0;
    list-style: none;
}
/* height:auto روی اسلاید + height:100% روی کارت = کارت‌های هم‌قد در یک ردیف */
.irb-rel__slider .splide__slide {
    height: auto;
}
.irb-rel__card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0;
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 12px;
    overflow: hidden;
}
.irb-rel__thumb {
    display: block;
    aspect-ratio: 16 / 9;
    background: #f1f5f9;
}
/* تم روی img[height] ارتفاع را unset می‌کند؛ این‌جا (0,2,1) می‌برد */
.irb-rel__card .irb-rel__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
}
.irb-rel__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px 14px;
}
.irb-rel__card .irb-rel__heading {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #0f172a;
    font-size: 15px;
    line-height: 24px;
    font-variation-settings: "wght" 600, "KSHD" 100;
    text-decoration: none;
}
.irb-rel__card .irb-rel__heading:hover {
    color: #185adb;
}
.irb-rel__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin-top: auto;
    color: #64748b;
    font-size: 12px;
    line-height: 20px;
}
.irb-rel__meta time {
    white-space: nowrap;
}
.irb-rel__chip {
    display: inline-block;
    max-width: 100%;
    padding: 0 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* بلوک نهادهای مشابه همین قاب را می‌گیرد ولی کارتش مال خودش است.
   ⚠️ چون ظرف حالا <section> است، قاعده‌ی تم `.pdp-page__main-part section a img`
   (پس‌زمینه‌ی #f1f5f9 + شعاع ۱۰، و در موبایل `width:100%; height:136px`) روی لوگوها
   می‌افتاد و پشتشان خاکستری می‌شد. این‌ها (0,3,1) هستند و آن (0,1,3) را می‌برند. */
.irb-rel.related-institution .related-institution__img-slider {
    width: 100%;
    align-items: center;
}
.irb-rel.related-institution .related-institution__img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 64px;
}
.irb-rel.related-institution .related-institution__img a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.irb-rel.related-institution .related-institution__img img {
    width: 128px;
    height: 64px;
    max-width: 100%;
    margin-inline: auto;
    object-fit: contain;
    background: transparent;
    border-radius: 0;
}
/* نهادهای مطلب: ردیف چیپ‌های لوگودار */
.irb-rel__entities {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: 32px 0 0;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 12px;
}
.irb-rel__entities-label {
    color: #64748b;
    font-size: 13px;
    line-height: 20px;
}
.irb-rel__entities .irb-rel__entity {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px 6px 10px;
    border: 1px solid #EBF0F5;
    border-radius: 999px;
    color: #0f172a;
    font-size: 13px;
    line-height: 20px;
    text-decoration: none;
}
.irb-rel__entities .irb-rel__entity:hover {
    border-color: #185adb;
    color: #185adb;
}
.irb-rel__entity .irb-rel__logo {
    width: auto;
    height: 20px;
    max-width: 56px;
    object-fit: contain;
}
.irb-rel__entity-type,
.irb-rel__entity-rate {
    color: #64748b;
    font-size: 12px;
}
@media (max-width: 767px) {
    .irb-rel {
        margin-top: 32px;
    }
    .irb-rel h2.irb-rel__title {
        font-size: 20px;
        line-height: 28px;
    }
    .irb-rel__head {
        gap: 8px;
    }
    /* پیکان روی موبایل جا نمی‌گیرد و لازم هم نیست — کشیدن با انگشت کار می‌کند */
    .irb-rel__slider > .splide__arrows {
        display: none;
    }
    .irb-rel__card .irb-rel__heading {
        font-size: 14px;
        line-height: 22px;
    }
    .irb-rel__entities {
        margin-top: 24px;
    }
}