/* ===== Navbar Styles مظبوطة ===== */

/* خلفية الشريط */

.navbar {

  background-color: #181830 !important;

  border: none !important;

  box-shadow: none !important;

}

/* اللوجو */

.navbar-brand img {

  max-height: 48px !important;

  height: auto !important;

  object-fit: contain !important;

}

/* الروابط */

.navbar a {

  color: #fff !important;

  text-decoration: none !important;

  padding: 10px 15px;

  display: block;

  position: relative;

}

/* hover */

.navbar a:hover {

  color: #ffcc00 !important;

}

/* active */

.navbar .active > a,

.navbar .nav-item.active > a,

.navbar a.active {

  color: #4da6ff !important;

  background-color: transparent !important;

  position: relative;

}

.navbar .active > a::after,

.navbar .nav-item.active > a::after,

.navbar a.active::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  height: 3px;

  width: 100%;

  background-color: #4da6ff !important;

}

/* زرار الثلاث شرطات */

.navbar-toggler {

  border: none !important;

  outline: none !important;

}

.navbar-toggler-icon {

  filter: invert(100%) !important; /* يخليها بيضا */

}

/* اللوجو */

.navbar-brand {

  padding: 0 13px !important;   /* وسّع المساحة يمين وشمال */

}

.navbar-brand img {

  max-height: 55px !important;  /* كبّر اللوجو شوية */

  height: auto !important;

  object-fit: contain !important;

}

🎯 المستطيلات

/* روابط المنيو كمستطيلات */

.navbar a {

  color: #fff !important;

  padding: 8px 18px !important;

  margin: 0 5px !important;

  border-radius: 8px !important;   /* زوايا ناعمة */

  transition: all 0.3s ease !important;

  display: inline-block !important;

}

/* عند المرور */

.navbar a:hover {

  background-color: rgba(77, 166, 255, 0.15) !important; /* خلفية خفيفة */

  color: #4da6ff !important;

}

/* العنصر النشط */

.navbar a.active,

.navbar .nav-item.active > a {

  color: #fff !important;

  background-color: #4da6ff !important; /* أزرق ثابت للمستطيل */

}