/**
 * 🎯 حل احترافي نظيف للهيدر
 * Professional Clean Header Solution
 */

/* ===== Desktop header layout (>=992px) ===== */
@media (min-width:992px){
    /* إخفاء زر الهامبرغر على الدِيسكْتوب نهائياً */
    .header-trigger-wrapper,
    .header-trigger,
    .header-trigger-wrapper *,
    .d-lg-none{display:none !important;}
  
    /* الحاوية الرئيسية للهيدر السفلي */
    .header-bottom-area{
      display:flex !important;
      align-items:center !important;
      gap:24px !important;
    }
  
    /* اللوجو يبقى يسار */
    .header-bottom .logo{flex:0 0 220px !important;}
  
      /* القائــمة في المنتصف - محسنة لـ 6 أقسام */
  .header-bottom .menu{
    position:static !important;
    left:auto !important; transform:none !important; top:auto !important;
    display:flex !important; flex:1 1 auto !important;
    justify-content:center !important; align-items:center !important;
    gap:16px !important; white-space:nowrap !important; margin:0 !important; padding:0 !important;
    background:none !important; box-shadow:none !important; border-radius:0 !important;
    opacity:1 !important; visibility:visible !important; z-index:auto !important;
  }
  .header-bottom .menu li{list-style:none !important; margin:0 !important;}
  .header-bottom .menu li a{
    display:block !important; padding:10px 14px !important; border-radius:6px !important;
    font-weight:600 !important; text-decoration:none !important;
    color:#333 !important; transition:all 0.3s ease !important;
    font-size:14px !important; /* خط أصغر قليلاً */
  }
    .header-bottom .menu li a:hover,
    .header-bottom .menu li a.active{
      background:rgba(255,140,0,.08) !important; color:#ff8c00 !important;
      transform:translateY(-2px) !important;
    }
  
    /* يمين الهيدر: Login + Register + اللغة */
    .header-actions,
    .header-bottom-area > div:last-child,
    .header-bottom-area .d-lg-flex{
      margin-left:auto !important;
      display:flex !important; align-items:center !important; gap:12px !important;
      flex:0 0 auto !important;
      justify-content: flex-end !important;
    }
  
    /* سليكتور اللغة - سلوك طبيعي للإنجليزية */
    .custom--dropdown {
      margin-left: auto !important;
      order: 99 !important;
    }
  
    /* حماية قوية - الهيدر يبقى بنفس الشكل في جميع اللغات */
    .header-bottom-area {
      direction: ltr !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      height: 70px !important;
      padding: 0 15px !important;
    }
  
    /* منع أي تأثير RTL على عناصر الهيدر */
    .header-bottom-area,
    .header-bottom-area *,
    .header-bottom-area .logo,
    .header-bottom-area .menu,
    .header-bottom-area .d-lg-flex,
    .header-bottom-area .custom--dropdown {
      direction: ltr !important;
      text-align: left !important;
    }
  
    /* ترتيب ثابت للعناصر - نفس أبعاد الإنجليزية */
    .header-bottom-area .logo {
      order: 1 !important;
      display: flex !important;
      align-items: center !important;
      height: 45px !important;
    }
  
    .header-bottom-area .menu {
      order: 2 !important;
      flex: 1 !important;
      justify-content: center !important;
      display: flex !important;
      align-items: center !important;
      height: 45px !important;
      list-style: none !important;
      padding: 0 !important;
      margin: 0 !important;
    }
  
    /* إصلاح محاذاة عناصر القائمة بما في ذلك Contact */
    .header-bottom-area .menu li {
      display: flex !important;
      align-items: center !important;
      height: 45px !important;
      margin: 0 5px !important;
    }
  
    .header-bottom-area .menu li a {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      height: 40px !important;
      min-height: 40px !important;
      max-height: 40px !important;
      padding: 0 15px !important;
      line-height: 1 !important;
      border-radius: 6px !important;
      white-space: nowrap !important;
      vertical-align: middle !important;
      margin: 0 !important;
      box-sizing: border-box !important;
      text-align: center !important;
    }
  
            /* إصلاح قوي لجميع عناصر القائمة - 6 عناصر */
  .header-bottom-area .menu li:nth-child(1) a, /* Home */
  .header-bottom-area .menu li:nth-child(2) a, /* Contact */
  .header-bottom-area .menu li:nth-child(3) a, /* About */
  .header-bottom-area .menu li:nth-child(4) a, /* FAQ */
  .header-bottom-area .menu li:nth-child(5) a, /* Blog */
  .header-bottom-area .menu li:nth-child(6) a, /* Reviews */
  .header-bottom-area .menu li:nth-child(7) a, /* عنصر إضافي */
  .header-bottom-area .menu li:nth-child(8) a  /* عنصر إضافي */ {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    padding: 0 12px !important; /* مسافات مضبوطة لـ 6 عناصر */
    font-size: 13px !important; /* خط مناسب */
  }
  
    .header-bottom-area .d-lg-flex {
      order: 3 !important;
      margin-left: auto !important;
      margin-right: 0 !important;
      justify-content: flex-end !important;
      display: flex !important;
      align-items: center !important;
      height: 45px !important;
      gap: 12px !important;
    }
  
    /* أخفِ "الشروط/القائمة اليمنى" على الدِيسكْتوب */
    .rules-container,
    .smart-rules-alert,
    .header-bottom .header-bottom-menu,
    .rules-menu,
    .terms-menu,
    .conditions-menu{
      display:none !important;
    }
    
    /* تحسين الأزرار */
    .btn-orange{background:linear-gradient(135deg,#ff8c00,#ff6b35) !important; color:#fff !important; border:none !important;}
    .btn-orange-outline{border:2px solid #ff8c00 !important; color:#ff8c00 !important; background:transparent !important;}
  }
  
  /* ===== Mobile layout (<=991px) ===== */
  @media (max-width:991px){
    /* إخفاء القائمة العادية على الموبايل */
    .header-bottom .menu:not(.show){display:none !important;}
    
    /* إظهار الشروط على الموبايل فقط */
    .rules-container,
    .smart-rules-alert,
    .rules-menu,
    .terms-menu,
    .conditions-menu{
      display:block !important;
    }
  
      /* ترتيب جديد للموبايل: Logo شمال، Language وسط، Hamburger يمين */
  .header-bottom-area {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 15px !important;
    height: 70px !important;
  }

  /* سليكتور اللغة في المنتصف على الموبايل */
  .header-bottom-area .custom--dropdown {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: 36px !important;
    min-width: 80px !important;
    padding: 6px 8px !important;
    font-size: 11px !important;
    order: 2 !important;
    margin: 0 auto !important;
  }
  
    /* Logo على الشمال */
    .header-bottom-area .logo {
      order: 1 !important;
      margin-left: 0 !important;
      margin-right: auto !important;
      flex-shrink: 0 !important;
    }
  
      /* إخفاء Dashboard/Logout على الموبايل - موجودة في القائمة المنسدلة */
  .header-bottom-area .d-lg-flex {
    display: none !important;
  }
  
    /* Hamburger على اليمين */
    .header-trigger-wrapper {
      order: 3 !important;
      margin-left: auto !important;
      margin-right: 0 !important;
      flex-shrink: 0 !important;
    }
    
    /* 🚀 القائمة المنسدلة - تم استبدالها بالنسخة الاحترافية أدناه */
    
    .header-bottom .menu.show li{
      list-style:none !important;
      margin:5px 0 !important;  /* 🔥 تقليل المسافات */
      text-align:center !important;
      flex-shrink:0 !important;  /* منع الانكماش */
    }
    
    .header-bottom .menu.show li a{
      display:block !important;
      padding:12px 20px !important;
      color:#333 !important;
      text-decoration:none !important;
      font-weight:600 !important;
      font-size:16px !important;
      border-radius:8px !important;
      background:rgba(255,140,0,0.05) !important;
      border:1px solid rgba(255,140,0,0.1) !important;
      margin:5px auto !important;
      max-width:200px !important;
      transition:all 0.3s ease !important;
    }
    
    .header-bottom .menu.show li a:hover{
      background:rgba(255,140,0,0.1) !important;
      color:#ff8c00 !important;
      transform:translateY(-2px) !important;
    }

    /* تحسين آخر عنصر في القائمة - Dashboard/Logout */
    .header-bottom .menu.show li:last-child {
      margin-top: 15px !important;
      padding-top: 15px !important;
      border-top: 1px solid rgba(255,140,0,0.2) !important;
    }

    .header-bottom .menu.show li:last-child .d-flex {
      display: flex !important;
      justify-content: space-between !important;
      align-items: center !important;
      gap: 15px !important;
      width: 100% !important;
      max-width: 250px !important;
      margin: 0 auto !important;
    }

    .header-bottom .menu.show li:last-child .btn {
      flex: 0 0 auto !important;
      padding: 10px 15px !important;
      font-size: 13px !important;
      border-radius: 6px !important;
      min-width: 100px !important;
      text-align: center !important;
    }

    /* Dashboard على اليسار */
    .header-bottom .menu.show li:last-child .btn-orange {
      order: 1 !important;
    }

    /* Logout على اليمين */
    .header-bottom .menu.show li:last-child .btn-orange-outline {
      order: 2 !important;
    }
  
    
    
    
    /* الهامبرغر على اليمين */
    .header-trigger-wrapper{
      display: flex !important;
      margin-left: auto !important;
      margin-right: 0 !important;
      z-index: 9999999 !important;
      order: 3 !important;
    }
    
    .header-trigger{
      cursor:pointer !important;
      padding:8px !important;
      background:rgba(255,140,0,0.1) !important;
      border-radius:6px !important;
    }
    
    .header-trigger i{
      font-size:24px !important;
      color:#ff8c00 !important;
    }
  }
  
  /* ===== تنظيف عام ===== */
  .header-bottom .menu{
    /* منع أي تداخل من ملفات أخرى */
    max-height:none !important;
    overflow-y:visible !important;
  }
  
  /* إزالة أي تأثيرات جانبية */
  .header-bottom .menu *{
    box-sizing:border-box !important;
  }
  
  /* 🎯 إصلاح z-index hierarchy - القائمة فوق كل شيء */
  .updates-ticker{z-index:1 !important;}  /* البانر أقل شيء */
  .header{
    z-index:100 !important;        /* الهيدر متوسط */
    position:relative !important;  /* 🔥 ضروري للقائمة المنسدلة */
  }
  .header-trigger-wrapper{z-index:1000000 !important;}  /* زر الهامبرغر الأعلى */
  
  /* 🚨 كل التنبيهات والبانرات تحت القائمة */
  .alert, .notification, .updates-ticker, .banner{
    z-index:1 !important;  /* كلها أقل */
  }
  
  /* ===== Mobile menu overlay & stacking ===== */
  @media (max-width: 991px){
    /* البانرات/التنبيهات دائماً تحت القائمة */
    .updates-ticker,
    .alert,
    .notification,
    .banner,
    .smart-rules-alert,
    .rules-container{ z-index: 10 !important; position: relative !important; }
  
    /* الهيدر فوقهم ليكون مرجع للقائمة */
    .header{ position: relative !important; z-index: 100000 !important; }
  
    /* القائمة: تحت الهيدر مع سكرول داخلي */
    .header-bottom .menu.show{
      display: block !important;
      position: absolute !important;  /* عادية بدلاً من fixed */
      top: 100% !important;          /* تحت الهيدر مباشرة */
      left: 0 !important;
      right: 0 !important;
      width: 100% !important;
      max-height: 80vh !important;   /* ارتفاع أكبر للقائمة */
      min-height: 400px !important;  /* حد أدنى للارتفاع */
      overflow-y: auto !important;   /* سكرول عند الحاجة فقط */
      -webkit-overflow-scrolling: touch !important;
      background: #fff !important;
      z-index: 10005 !important;     /* فوق inner-banner */
      padding: 20px !important;
      box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
      border-radius: 0 0 15px 15px !important;
      text-align: center !important;
      margin: 0 !important;
      transform: none !important;
      opacity: 1 !important;
      visibility: visible !important;
    }
  
    /* 🎨 تخصيص شكل السكرول للقائمة */
    .header-bottom .menu.show::-webkit-scrollbar {
      width: 8px !important;
    }
    
    .header-bottom .menu.show::-webkit-scrollbar-track {
      background: #f1f1f1 !important;
      border-radius: 10px !important;
    }
    
    .header-bottom .menu.show::-webkit-scrollbar-thumb {
      background: #ff8c00 !important;
      border-radius: 10px !important;
    }
    
    .header-bottom .menu.show::-webkit-scrollbar-thumb:hover {
      background: #ff6b00 !important;
    }
    
    /* تم إزالة الخلفية المعتمة وقفل السكرول حسب طلب المستخدم */
  }
  
  /* 🎯 الحل النهائي - إخفاء أيقونة الهامبرغر من الديسكتوب نهائياً */
  @media (min-width: 992px){
    .js-hide-desktop,
    .header-trigger-wrapper,
    .header-trigger,
    [class*="trigger"],
    .d-lg-none,
    .hamburger,
    .menu-toggle,
    .mobile-menu-btn { 
      display: none !important; 
      visibility: hidden !important;
      opacity: 0 !important;
    }
  }
  
  /* إظهار على الموبايل فقط */
  @media (max-width: 991px){
    .js-hide-desktop{ display: block !important; }
    .header-trigger-wrapper{ display: flex !important; }
  }