/* 🌐 القاعدة العامة */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;

  overflow-x: hidden;
  overflow-y: auto;

  list-style: none;
  text-decoration: none;
}
 .main-container {
  max-width: 100%;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
  justify-content: flex-start;
}






/* 📱 الوضع العمودي على الهواتف */
@media (orientation: portrait) {
  body {
    background-image: url('images/background-portrait.jpg');
    background-attachment: scroll; /* مهم جداً لتفادي مشاكل iOS */
      background-size: contain;
  }
}

/* 📱 الوضع الأفقي - شاشات صغيرة (أقل من 667px) */
@media (max-width: 666px) and (orientation: landscape) {
  body {
    background-image: url('images/background-l1.jpg');
    background-attachment: scroll;
     background-size: contain;
   
  }
 

}

/* 📱 الوضع الأفقي - شاشات متوسطة (667px إلى 950px) */
@media (min-width: 667px) and (max-width: 950px) and (orientation: landscape) {
  body {
    background-image: url('images/background-l.jpg');
    background-attachment: scroll;
     background-size: contain;
   
  }
 

}

/* 💻 الشاشات الكبيرة (أكثر من 950px) */
@media (min-width: 951px) {
  body {
    background-image: url('images/background.jpg');
    background-attachment: scroll;
  }
}