/* ====== Dropdown (RTL, multi-level, fade + slide) ====== */
.navbar .dropdown-toggle::after { display: none !important; }

/* القائمة الأساسية */
.navbar .dropdown-menu {
  --ddw: 300px;
  min-width: var(--ddw);
  direction: rtl;
  text-align: right;
  border: 1px solid #eee;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  padding: 0;
  margin: .5rem 0 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: all .25s cubic-bezier(.22, .61, .36, 1);
  z-index: 999;
  background: #fff;
}

/* إظهار القائمة عند المرور أو التركيز */
.navbar .nav-item.dropdown:hover > .dropdown-menu,
.navbar .nav-item.dropdown:focus-within > .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* عناصر القائمة */
.navbar .dropdown-menu > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 16px;
  font-weight: 600;
  color: #1a1a1a;
  background: #fff;
  text-decoration: none;
  border-bottom: 1px solid #f0f0f0;
  transition: background .2s ease, color .2s ease;
}
.navbar .dropdown-menu > li:last-child > a { border-bottom: 0; }

/* ✨ عند المرور */
.navbar .dropdown-menu > li > a:hover {
  background: #7a0c18;
  color: #fff;
}

/* ✨ السهم في القوائم الرئيسية – ◀ افتراضيًا */
.navbar .nav-item.dropdown > a::after {
  content: "◀" !important;
  font-size: 0.7rem;
  color: #fff;
  margin-inline-start: auto;
  margin-left: 8px;
  display: inline-block;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
  vertical-align: middle;
}

/* عند فتح أو المرور – ▼ للأسفل */
.navbar .nav-item.dropdown.show > a::after,
.navbar .nav-item.dropdown:hover > a::after,
.navbar .nav-item.dropdown:focus-within > a::after {
  transform: rotate(90deg);
}

/* القوائم الفرعية */
.navbar .dropdown-menu > li { position: relative; }

.navbar .dropdown-menu .dropdown-menu {
  position: absolute;
  top: 0;
  right: 100%;
  left: auto;
  margin-right: -1px;
  min-width: var(--ddw);
  border-radius: 14px;
  border: 1px solid #eee;
  padding: 0;
  background: #fff;
  box-shadow: 0 10px 26px rgba(0,0,0,.07);
  opacity: 0;
  visibility: hidden;
  transform: translateX(15px);
  transition: all .25s cubic-bezier(.22, .61, .36, 1);
  z-index: 1000;
}

/* إظهار القوائم الفرعية */
.navbar .dropdown-menu > li:hover > .dropdown-menu,
.navbar .dropdown-menu > li:focus-within > .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

/* دعم المستوى الثالث */
.navbar .dropdown-menu .dropdown-menu .dropdown-menu {
  right: 100%;
  top: 0;
  margin-right: -1px;
}

.navbar .dropdown-menu > li {
  position: relative;
  padding-bottom: 10px;
}

/* ✨ سهم القوائم الفرعية – أقصى اليسار */
.navbar .dropdown-menu > li.menu-item-has-children > a {
  position: relative;
  padding-left: 0rem; /* مساحة للسهم */
  padding-right: 2rem;
}

.navbar .dropdown-menu > li.menu-item-has-children > a::after {
  content: "◀" !important;
  font-size: 0.8rem;
  position: absolute;
  left: 0px !important; /* محاذاة أقصى اليسار */
  right: 14px !important;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  color: #7a0c18;
  transition: transform 0.3s ease, color 0.3s ease;
}

/* عند المرور – ▼ للأسفل */
.navbar .dropdown-menu > li.menu-item-has-children:hover > a::after {
  content: "▼" !important;
  transform: translateY(-50%) rotate(0deg);
  color: #fff;
}

/* عند المرور – خلفية عنابية والنص أبيض */
.navbar .dropdown-menu > li.menu-item-has-children:hover > a {
  background: #7a0c18;
  color: #fff;
}

/* تحسين المحاذاة */
.navbar .navbar-nav .dropdown-menu { text-align: right; }
.navbar .dropdown-menu,
.navbar .dropdown-menu .dropdown-menu { pointer-events: auto; }
.navbar .dropdown-menu > li > a { line-height: 1.6; }

/* ✨ حركة الدخول */
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateX(15px); }
  to { opacity: 1; transform: translateX(0); }
}
.navbar .dropdown-menu .dropdown-menu {
  animation: fadeSlideIn .25s ease forwards;
}
