/* ==========================================================
   النسخة الإنجليزية (/en/): الاتجاه من اليسار لليمين.
   style.css و network.css مكتوبة للعربي، وأغلبها يستخدم inline-start/end فينعكس لوحده.
   هنا بس الأشياء المكتوبة لليمين أو لليسار بالاسم، معكوسة. تتحمّل بعد الملفين في صفحات ‎/en/ فقط.
   أيقونة السهم (#i-arrow) في صفحات ‎/en/ مرسومة لليمين أصلاً.
   ========================================================== */

/* الخط: نفس خطوط الموقع (فيها حروف لاتينية)، والأسطر أقصر شوي لأن الإنجليزي أقصر من العربي */
html[lang="en"] body { line-height: 1.75; }
html[lang="en"] .eyebrow, html[lang="en"] .kicker { letter-spacing: .02em; }

/* الهيدر: كلمات القائمة الإنجليزية أطول من العربية، فالقائمة تصير زر ☰ (مثل الجوال) لين 1240px،
   وفوقها سطر واحد أضيق شوي. نفس الحد في net.js (قفل القائمة لما تكبر الشاشة) */
@media (min-width: 961px) and (max-width: 1240px) {
  html[lang="en"] .header-inner { gap: .75rem; }
  html[lang="en"] .nav-toggle { display: flex; }
  html[lang="en"] .nav {
    position: fixed; inset: var(--header-h) 0 0 0; z-index: 49; margin: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 1rem max(16px, calc((100% - var(--container)) / 2)) 2rem; background: var(--bg); overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity .25s, transform .25s, visibility .25s;
  }
  html[lang="en"] .nav.open { opacity: 1; visibility: visible; transform: none; }
  html[lang="en"] .nav a:not(.btn) { padding: 1rem .25rem; font-size: 1.15rem; color: var(--text); border-bottom: 1px solid var(--line); }
  html[lang="en"] .nav-cta { margin-top: 1.5rem; padding: .95rem 1.5rem; font-size: 1.05rem; }
  html[lang="en"] .nav .nav-account:not(.btn) { justify-content: center; margin-top: .75rem; padding: .55rem 1rem; border: 1px solid var(--line-strong); font-size: 1.05rem; }
  html[lang="en"] .nav-account-text, html[lang="en"] .nav-opt { display: inline; }
  html[lang="en"] .lang-switch { margin-inline-start: auto; }
}
@media (min-width: 1241px) {
  html[lang="en"] .header-inner { gap: 1rem; }
  html[lang="en"] .nav { gap: .75rem; }
  html[lang="en"] .nav a:not(.btn) { font-size: .84rem; }
  html[lang="en"] .nav-cta { padding: .55rem 1rem; font-size: .86rem; }
}

/* الواجهة: الشارات والنجوم حول الماسة */
[dir="ltr"] .sparkle.s1 { left: auto; right: 26%; }
[dir="ltr"] .sparkle.s2 { right: auto; left: 18%; }
[dir="ltr"] .sparkle.s3 { left: auto; right: 34%; }
[dir="ltr"] .chip-1 { right: auto; left: -2%; }
[dir="ltr"] .chip-2 { left: auto; right: 0; }
[dir="ltr"] .chip-3 { right: auto; left: 8%; }
@media (max-width: 600px) {
  [dir="ltr"] .chip-1 { right: auto; left: 0; }
  /* «I’m an influencer and want to join for free» أطول من الجوال: الزر ينزل سطرين بدل ما ينقص */
  [dir="ltr"] .hero-actions .btn, [dir="ltr"] .inf-actions .btn, [dir="ltr"] .pay-more .btn { white-space: normal; text-align: center; }
}

/* عرض «كيف نعمل»: شريط المراحل يمتلي من اليسار، وسهم «تخطَّ العرض» لتحت */
[dir="ltr"] .op-rail-fill { transform-origin: left center; }
[dir="ltr"] .op-skip .ico { transform: rotate(90deg); }
/* الجوال: اسم الجمهور جنب الكرة مساحته ضيقة، والإنجليزي أطول من العربي، فنكتفي بالعنوان بخط أصغر */
[dir="ltr"] .op.op-tall .op-aud strong { font-size: .98em; }
[dir="ltr"] .op.op-tall .op-aud small { display: none; }
[dir="ltr"] .op-tall .op-checks span:first-child { left: auto; right: calc(100% + .7em); }
[dir="ltr"] .op-tall .op-checks span:last-child { right: auto; left: calc(100% + .7em); }
[dir="ltr"] .op-tall.reach-2 .op-inf.is-picked .op-avatar::after, [dir="ltr"] .op-compact.reach-2 .op-inf.is-picked .op-avatar::after,
[dir="ltr"] .op-tall.reach-2[data-mode="influencer"] .op-card-icon::after, [dir="ltr"] .op-compact.reach-2[data-mode="influencer"] .op-card-icon::after { left: auto; right: -.25em; }

/* الروابط بسهم */
[dir="ltr"] .link-arrow:hover .ico { transform: translateX(4px); }

/* التواصل والنموذج */
[dir="ltr"] .contact-list strong,
[dir="ltr"] .field input[dir="ltr"],
[dir="ltr"] .dd-trigger,
[dir="ltr"] .net-who-text bdi { text-align: left; }
[dir="ltr"] .field select { padding-left: 1rem; padding-right: 2.5rem; background-position: right 1rem center; }
[dir="ltr"] .switch::after { right: auto; left: 3px; }
[dir="ltr"] .platform-switch input:checked + .switch::after { transform: translateX(20px); }
[dir="ltr"] .dd-panel { right: auto; left: 0; }
[dir="ltr"] .dd.flip .dd-panel { left: auto; right: 0; }
[dir="ltr"] .auth-pw input { padding-left: 1rem; padding-right: 4.6rem; }
[dir="ltr"] .auth-pw-toggle { left: auto; right: .45rem; }

/* الفوتر: سطر عربي صغير بدل السطر الإنجليزي اللي في النسخة العربية */
[dir="ltr"] .footer-en { text-align: right; }

/* زر الواتساب العائم في الزاوية اليمين (المعتاد في المواقع الإنجليزية) */
[dir="ltr"] .wa-float { left: auto; right: 20px; }

/* صفحات الشبكة (network.css) */
[dir="ltr"] .net-dialog-close { left: auto; right: .9rem; }
[dir="ltr"] .net-dialog-head { padding-left: 0; padding-right: 2.5rem; }
[dir="ltr"] .ad-toggle small,
[dir="ltr"] .acc-user-text bdi,
[dir="ltr"] .acc-handle { text-align: left; }
[dir="ltr"] .ad-switch::after { right: auto; left: 2px; }
[dir="ltr"] .ad-toggle input:checked ~ .ad-switch::after { transform: translateX(18px); }
[dir="ltr"] .adm-text { border-right: 0; border-left: 3px solid var(--gold-3); }
[dir="ltr"] .how-steps > li::before { right: auto; left: 26px; }
@media (max-width: 900px) {
  [dir="ltr"] .how-link span:first-child { text-align: right; }
  [dir="ltr"] .how-link span:last-child { text-align: left; }
}
@media (max-width: 600px) {
  [dir="ltr"] .how-steps > li::before { right: auto; left: 20px; }
}