/* =========================================
   MOBILE: NAV TOGGLE POSITION BY LANGUAGE
   RTL => left
   LTR => right
========================================= */

@media (max-width: 768px){

  /* تأكد الهيدر يوزّع العناصر بشكل واضح */
  .top-header .header-inner{
    display: flex;
    align-items: center;
    gap: 12px;
  }

  /* خلي الشعار في الوسط على الجوال */
  .top-header .logo{
    margin-inline: auto;
  }

  /* أعطِ زر القائمة حجم ثابت */
  .top-header .nav-toggle{
    flex: 0 0 auto;
  }

  /* EN: زر القائمة يمين */
  html[dir="ltr"] .top-header .nav-toggle{
    order: 3;
    margin-left: auto;
    margin-right: 0;
  }

  /* AR: زر القائمة يسار */
  html[dir="rtl"] .top-header .nav-toggle{
    order: 1;
    margin-right: auto;
    margin-left: 0;
  }

  /* الشعار دائماً بالوسط */
  html[dir="ltr"] .top-header .logo,
  html[dir="rtl"] .top-header .logo{
    order: 2;
  }
}