/* ══ تحصين الموبايل ضد التمرير الأفقي ══
 *
 * أي عنصر واحد أعرض من الشاشة بيخلي الصفحة كلها تتزحلق أفقيًا، والعميل
 * يلاقي المحتوى مقصوص من الجنب. القواعد دي بتمنع ده من جذره بدل ما
 * نطارد كل عنصر على حدة.
 *
 * بيتحمّل آخر ملف عشان يغلب أي قاعدة قبله.
 */

html, body { max-width: 100%; overflow-x: hidden; }

/* عناصر الشبكة والفلكس بتاخد min-width:auto افتراضيًا، فمحتوى طويل
   (اسم منتج، رقم OEM) بيوسّع العمود ويكسر الصفحة. */
.ct > a, .trust > *, .why > div, .wy > div,
.mfeed > *, .fg > *, .ofrs > *, .cols > div,
.finder > *, .ps-f > *, .cta > *, .two > *, .sb > * { min-width: 0; }

/* الوسائط مابتعدّيش حدود حاويتها أبدًا */
img, svg, video, iframe { max-width: 100%; height: auto; }
.im img, .av img, .vn-l img { height: 100%; }

/* النصوص الطويلة بلا مسافات (أرقام OEM، روابط) تتكسر بدل ما تمدّ الصفحة */
h1, h2, h3, p, small, b, .l, dd, li, summary { overflow-wrap: anywhere; }

/* الأشرطة الأفقية بتتزحلق جوّه نفسها، مش بتمدّ الصفحة */
.hrl, .hs, .vr { max-width: 100%; }

/* شريط الشراء الثابت والشريط السفلي: مايزيدوش عن عرض الشاشة */
.sb, .bn, .tst { max-width: min(520px, 100vw); }

/* الجداول لو اتحطت في المحتوى */
table { display: block; max-width: 100%; overflow-x: auto; }
