/* ==================================================
   RPP SYSTEM LINKS – MOBILE FIX (نسخه قوی‌تر)
   هدف:
   - فقط موبایل
   - 4 آیتم در هر نما
   - اسکرول افقی
   - خنثی‌سازی کامل Helium / Bootstrap
   ================================================== */

@media (max-width: 767px) {

    /* ==================================================
     CONTAINER
     --------------------------------------------------
     اطمینان از اینکه هیچ کانتینری
     عرض یا overflow را محدود نکند
     ================================================== */
.platform-content,
.he-content-top.moduletable.rpp-system-links {
    width: 100% !important;     /* عرض کامل */
    max-width: 100% !important;/* حذف محدودیت عرض */
    margin: 0 !important;      /* حذف margin قالب */
    padding: 0 !important;     /* حذف padding قالب */
    overflow: visible !important;/* جلوگیری از برش محتوا */
    }

      /* UL – ردیف افقی با اسکرول */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav {

    display: flex !important;                 /* اجبار به Flex (غیرفعال‌سازی Grid/Block) */
    flex-wrap: nowrap !important;             /* جلوگیری از رفتن آیتم‌ها به ردیف دوم */
    flex-direction: row !important;           /* چیدمان افقی آیتم‌ها */

    overflow-x: auto !important;              /* فعال‌سازی اسکرول افقی */
    overflow-y: hidden !important;            /* حذف اسکرول عمودی */

    width: 100% !important;                   /* اشغال کل عرض والد */
    max-width: 100% !important;               /* جلوگیری از محدود شدن عرض */

    margin: 0 !important;                     /* حذف margin پیش‌فرض ul */
    padding: 0 !important;                    /* حذف padding پیش‌فرض ul */
    gap: 0 !important;                        /* حذف فاصله بین آیتم‌های flex */

    justify-content: flex-start !important;   /* جلوگیری از space-between */
    align-items: stretch !important;          /* کشیده شدن آیتم‌ها در ارتفاع */

    -webkit-overflow-scrolling: touch;        /* اسکرول نرم در iOS */
    scroll-behavior: smooth;                  /* اسکرول نرم */

    list-style: none !important;              /* حذف bullet لیست */
    }

    /* ==================================================
     LI – هر آیتم (قفل 4تایی)
     --------------------------------------------------
     این بخش قفل 3تایی Helium را می‌شکند
     ================================================== */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav>li,
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav>li.nav-item {
    flex: 0 0 28% !important;    /* عرض هر آیتم (۴تایی نمایشی) */
    min-width: 28% !important;    /* جلوگیری از کوچک‌تر شدن */
    max-width: 28% !important;    /* جلوگیری از بزرگ‌تر شدن */
    width: 28% !important;    /* تثبیت عرض آیتم */

    flex-grow: 0 !important;    /* خنثی‌سازی flex-grow قالب */
    flex-shrink: 0 !important;    /* جلوگیری از جمع‌شدن آیتم */

    margin: 0 !important;    /* حذف فاصله بیرونی */
    padding: 0 !important;    /* حذف فاصله داخلی */
    border: none !important;    /* حذف حاشیه احتمالی */
    gap: 0 !important;    /* حذف فاصله بین آیتم‌ها */
    box-sizing: border-box !important;    /* محاسبه صحیح عرض */
    float: none !important;    /* حذف floatهای قدیمی */
    display: block !important;    /* نمایش پایدار آیتم */
}

    /* ==================================================
     LINK (A)
     --------------------------------------------------
     حذف باکس نامرئی اطراف آیکون
     ================================================== */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav>li>a {
    display: flex !important;    /* استفاده از Flex */
    flex-direction: column !important;    /* چینش عمودی محتوا */
    align-items: center !important;    /* وسط‌چین افقی */
    justify-content: flex-start !important;    /* چسبیدن محتوا به بالا */

    width: 100% !important;    /* پرکردن عرض آیتم */
    height: 100% !important;    /* پرکردن ارتفاع آیتم */
    min-width: 0 !important;    /* حذف حداقل عرض پیش‌فرض */

    margin: 0 !important;    /* حذف margin */
    padding: 1px 1px !important;    /* فاصله بسیار کم داخلی */
    box-sizing: border-box !important;    /* محاسبه صحیح اندازه */

    text-decoration: none !important;    /* حذف زیرخط لینک */
    border: none !important;    /* حذف کادر احتمالی */
    background: none !important;    /* حذف بک‌گراند */
}

    /* ==================================================
     IMAGE
     --------------------------------------------------
     اندازه ثابت + حفظ نسبت تصویر
     ================================================== */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav img {
    width: 65px !important;    /* عرض ثابت تصویر */
    height: 65px !important;    /* ارتفاع ثابت تصویر */
    max-width: 65px !important;    /* جلوگیری از بزرگ‌تر شدن */
    max-height: 65px !important;    /* جلوگیری از بزرگ‌تر شدن */

    display: block !important;    /* حذف فاصله inline تصویر */
    margin: 0 auto 0px auto !important;    /* وسط‌چین + فاصله خیلی کم پایین */
    padding: 0 !important;    /* حذف padding تصویر */

    object-fit: contain !important;    /* حفظ نسبت تصویر (بدون کشیدگی) */

    border: none !important;    /* حذف کادر احتمالی */
    box-shadow: none !important;    /* حذف سایه احتمالی */
}

    /* ==================================================
     TEXT / TITLE
     --------------------------------------------------
     دو خطی + جمع‌وجور
     ================================================== */
    .moduletable.rpp-system-links ul.mod-menu.mod-list.nav span,
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav span.image-title {
    display: block !important;   /* نمایش بلاکی متن */
    width: 100% !important;      /* اشغال کامل عرض آیتم */

    font-size: 10px !important;  /* اندازه فونت متن */
    line-height: 1.1 !important; /* فاصله خطوط فشرده */

    white-space: normal !important;/* اجازه شکستن متن */
    word-wrap: break-word !important;/* شکستن کلمات بلند */

    margin: 0 !important;        /* حذف فاصله بیرونی */
    padding: 2px 1px !important;   /* فاصله افقی کم از طرفین */

    text-align: center !important;/* وسط‌چین متن */

    overflow: hidden !important; /* مخفی‌کردن متن اضافه */
    text-overflow: ellipsis !important;/* سه‌نقطه در انتها */

    display: -webkit-box !important;/* فعال‌سازی محدودیت خط */
    -webkit-line-clamp: 2 !important;/* محدود به ۲ خط */
    -webkit-box-orient: vertical !important;/* جهت عمودی باکس */
}


    /* ==================================================
     حذف pseudo-element های قالب
     ================================================== */
    .moduletable.rpp-system-links ul.mod-menu.mod-list.nav>li::before,
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav>li::after {
    display: none !important;    /* حذف pseudo-element های قالب */
    content: none !important;    /* جلوگیری از تولید محتوای اضافی */
}

    /* ==================================================
     خنثی‌سازی استایل‌های Bootstrap nav
     ================================================== */
.moduletable.rpp-system-links ul.nav>li {
    position: static !important; /* حذف position خاص nav قالب */
}
/* مخفی‌کردن نوار اسکرول افقی (خودِ اسکرول فعال می‌ماند) */

/* Chrome / Edge / Safari */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav::-webkit-scrollbar {
    display: none;    /* مخفی‌کردن کامل نوار اسکرول */
}

/* Firefox */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav {
    scrollbar-width: none;    /* مخفی‌کردن نوار اسکرول */
}

/* IE / Edge قدیمی */
.moduletable.rpp-system-links ul.mod-menu.mod-list.nav {
    -ms-overflow-style: none;    /* مخفی‌کردن نوار اسکرول */
}