/* ============================================================
   المركز العراقي لتوثيق الجرائم
   LTR support layer — English / French / other left-to-right languages
   ------------------------------------------------------------
   الموقع مبني أساساً باتجاه RTL. هذا الملف يُفعَّل فقط عندما يكون
   <html dir="ltr">، ويعكس الخصائص الاتجاهية "الفيزيائية" التي لا
   تنقلب تلقائياً مع تغيير الاتجاه (المحاذاة، مواضع absolute، الزوايا).
   لا يحتوي هذا الملف على أي ترجمة — تغيير الاتجاه فقط.

   ملاحظة: معظم التخطيط مبني بـ flexbox فينقلب تلقائياً عند تبديل dir،
   لذلك نكتفي هنا بتصحيح الخصائص الفيزيائية غير المنعكسة تلقائياً.
   ============================================================ */

html[dir="ltr"] { direction: ltr; }
html[dir="ltr"] .slide-overlay{
  background: linear-gradient(-80deg, rgba(42,62,5,.05) 0%, rgba(30,30,30,.35) 45%, rgba(30,30,30,.82) 100%);
}
html[dir="ltr"] .hero-controls{
  right: auto;
  left: 70px;
}
/* ---------- محاذاة النصوص (تنقلب من اليمين إلى اليسار) ---------- */
html[dir="ltr"] .lang-menu a,
html[dir="ltr"] .slide-content,
html[dir="ltr"] .pm-stat-card,
html[dir="ltr"] .mag-content,
html[dir="ltr"] .enc-content,
html[dir="ltr"] .vfolder__label {
  text-align: left;
}
html[dir="ltr"] .cem-panel-close{
  left: auto;
  right: -4px;
}
html[dir="ltr"] .pubs.is-in .pubs-card{
  direction: ltr;
}

html[dir="ltr"] .enc-cards{
  direction: ltr;
}
html[dir="ltr"] .link-arrow,
html[dir="ltr"] .enc-link svg,
html[dir="ltr"] .vlib-cta svg,
html[dir="ltr"] .pm-file__cta svg,
html[dir="ltr"] .doc-link-arrow,
html[dir="ltr"] .arrow{
  transform: scaleX(-1) !important;
}


html[dir="ltr"] .sec-cta:hover .link-arrow,
html[dir="ltr"] .enc-link svg:hover,
html[dir="ltr"] .vlib-cta svg:hover,
html[dir="ltr"] .doc-link-arrow:hover{
  transform: scaleX(-1) translateX(-6px);
}
/* حقول القيَم كانت محاذاة لليسار في RTL → تصبح لليمين في LTR (انعكاس مرآتي) */
html[dir="ltr"] .vfolder__value {
  text-align: right;
}

/* ---------- قوائم التنقل المنسدلة (تُحاذى من الجهة المقابلة) ---------- */
html[dir="ltr"] .dropdown {
  right: auto;
  left: 0;
  transform-origin: top left;
}

/* شريط اللغة: في الموبايل كان يُثبَّت على اليمين → يُثبَّت على اليسار */
@media (max-width: 560px) {
  html[dir="ltr"] .lang-menu {
    left: 0;
    right: auto;
  }
}

/* ---------- الملصق العمودي في بطاقات الموسوعات ---------- */
html[dir="ltr"] .enc-label {
  right: auto;
  left: 1.1rem;
}

/* ---------- زر العودة إلى الأعلى (ينتقل إلى الزاوية المقابلة) ---------- */
html[dir="ltr"] .btt-btn {
  left: auto;
  right: clamp(18px, 3vw, 32px);
}

/* ============================================================
   منصة ذاكرة الأَلم — عكس تخطيط الهيرو وكومة الأرشيف في LTR
   ============================================================ */
html[dir="ltr"] .pm-file__num{
  left: auto;
  right: 16px;
}


/* توزيع عنصري الهيرو: الهامش الفاصل ينتقل إلى الجهة المقابلة
   (كان margin-right:100px مصمّماً لـ RTL) */
html[dir="ltr"] .pm-archive {
  margin-right: 0;
  margin-left: 100px;
}

/* كومة البطاقات: المرساة تنتقل من اليمين إلى اليسار حتى تتفرّد نحو اليمين.
   الإحداثيات الأفقية (translateX) تُعكَس من داخل pain-memory.js حسب الاتجاه. */
html[dir="ltr"] .pm-file {
  right: auto;
  left: 0;
  transform-origin: left center;
}

/* ميلان البطاقة غير النشطة عند المرور يميل بالاتجاه المعاكس */
html[dir="ltr"] .pm-file:not(.is-active):hover .pm-file__inner {
  transform: rotate(3deg);
}


/* ============================================================
   السلايدرات (stats / docs / books) في وضع LTR
   ------------------------------------------------------------
   أقسام docs و books عليها direction:rtl ثابتة في style.css، وهذا
   يجعل Swiper يبدأ باتجاه RTL. بما أن هذا الملف يُحمَّل في <head>
   قبل تهيئة Swiper، فإن قلب الاتجاه هنا يجعل Swiper يبدأ LTR تلقائياً
   دون تعطيل أي وظيفة (السحب/الأسهم/النقاط تعمل كما هي).
   ============================================================ */

/* اتجاه الأقسام إلى LTR حتى ينبني مسار Swiper من اليسار إلى اليمين */
html[dir="ltr"] .docs,
html[dir="ltr"] .books {
  direction: ltr;
}

/* --- تبديل جهتَي السهمين (السابق ↔ التالي) --- */
html[dir="ltr"] .docs-prev { right: auto; left: 2px; }
html[dir="ltr"] .docs-next { left: auto; right: 2px; }

html[dir="ltr"] .books-prev { right: auto; left: -6px; }
html[dir="ltr"] .books-next { left: auto; right: -6px; }

html[dir="ltr"] .pm-stats-arrow--prev { right: auto; left: -12px; }
html[dir="ltr"] .pm-stats-arrow--next { left: auto; right: -12px; }

/* اتجاه نبضة الـ hover في أسهم الإحصاءات تُعكَس */
html[dir="ltr"] .pm-stats-arrow--prev:hover { transform: translateY(-50%) translateX(-4px); }
html[dir="ltr"] .pm-stats-arrow--next:hover { transform: translateY(-50%) translateX(4px); }

/* قلب اتجاه أيقونة السهم (chevron) أفقياً لتشير للجهة الصحيحة في LTR */
html[dir="ltr"] .docs-arrow svg,
html[dir="ltr"] .books-arrow svg,
html[dir="ltr"] .pm-stats-arrow svg {
  transform: scaleX(-1);
}

/* ---------- الهيدر بالإنكليزي فقط (كلا الموقعين) ----------
   English menu names are longer than the Arabic ones and ran to two lines, one name stacked on another (user decision
   2026-10-26: English only, both sites; the Arabic header stays as it was). Above 1375px (below it the menu is the
   burger's): the header and the dark bar above it widen together from 1400px to 1680px, every name keeps to one
   line, and the type and logos come down a little; tighter again under 1520px, where the room is shortest.
   ltr.css loads last on both sites; .pm-subnav doubles the bar's selector over pain-memory.css's own rule. */
@media (min-width: 1376px) {
  html[lang="en"] .header-inner,
  html[lang="en"] .pm-subnav .pm-subnav__inner { max-width: 1680px; }
  html[lang="en"] .brand-group { gap: 12px; }
  html[lang="en"] .brand-logo { height: 50px; }
  html[lang="en"] .brand-text img { height: 40px; }
  html[lang="en"] .main-nav ul { gap: 2px; }
  html[lang="en"] .main-nav a { white-space: nowrap; font-size: 14px; padding: 8px 10px; }
  html[lang="en"] .main-nav a::after { right: 10px; left: 10px; }
}
@media (min-width: 1376px) and (max-width: 1519px) {
  html[lang="en"] .main-nav a { font-size: 13.5px; padding: 8px; }
  html[lang="en"] .main-nav a::after { right: 8px; left: 8px; }
}
