* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;

  }
  
  /* إعداد عام للـ body */
  body {
	line-height: 1.6;
  overflow-x: hidden;

  }
  
  /* تعديلات بسيطة */
  section {
	padding: 60px 0;
  }
  
  
  .logo-img {
    max-height: 55px;
    width: auto;
  }
  
  .partner-img {
    max-height: 40px;
    width: auto;
  }
 
  .nav-item{
    font-size: 20px;
  }
    /* إخفاء القائمة المنسدلة في البداية */
.nav-item.dropdown .dropdown-menu {
  display: none;
}

/* إظهار القائمة المنسدلة عند التفاعل مع العنصر */
.nav-item.dropdown:hover .dropdown-menu {
  display: block;
  position: absolute;
  background-color: #fff; /* أو أي لون تفضله */
  border: 1px solid #ddd; /* لإضافة حدود للقائمة */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* إضافة ظل للقائمة */
  z-index: 1000; /* لجعل القائمة تظهر فوق المحتوى الآخر */
}

/* تحسين المظهر عند الوقوف على العناصر داخل القائمة */
.nav-item.dropdown .dropdown-menu .dropdown-item:hover {
  background-color: #f8f9fa;
}
  /* نتأكد إن النصوص في منتصف الشاشة بالظبط */
  header .container {
    z-index: 2;
    position: relative;
    
    a{
      background-color: #F77016;
    }
    
  }

















  @media (max-width: 768px) {
    .footer-container {
      flex-direction: column;
      align-items: center;
    }
  }
  
  .footer-container {
    display: flex; /* تنسيق العناصر بشكل أفقي */
    justify-content: space-between; /* توزيع الأعمدة بشكل متساوي */
    gap: 30px; /* إضافة مسافة ثابتة بين الأعمدة */
    flex-wrap: wrap; /* يسمح بتوزيع الأعمدة في صفوف متعددة في حالة كانت الشاشة صغيرة */
  }
  
  .footer-column {
    flex-grow: 1; /* يجعل الأعمدة تتوزع بالتساوي */
    min-width: 220px; /* تحديد الحد الأدنى للعرض */
  }
  
  .footer-column h3 {
    margin-bottom: 15px; /* إضافة مسافة أسفل العنوان */
  }
  
  .footer-column ul {
    padding-left: 0;
    list-style: none;
  }
  
  .footer-column ul li {
    margin-bottom: 10px;
  }
  
  .footer-column ul li a {
    color: white; /* تغيير اللون إلى الأبيض */
    text-decoration: none; /* إزالة الخط السفلي */
  }
  
  .footer-column ul li a:hover {
  color: #F77016;
  }