/* Add custom CSS styles below */ 
/* ✅ الخلفية الأساسية */
body {
  background-color: #f7f3e7 !important; /* عاجي */
  color: #8b9e71 !important;           /* الزيتوني للنصوص */
}

/* ✅ الروابط */
a, a:visited {
  color: #8b9e71 !important;
}
a:hover {
  color: #6f7e58 !important; /* أغمق سنة عند الهوفر */
}

/* ✅ العناوين */
h1, h2, h3, h4, h5, h6 {
  color: #8b9e71 !important;
}

/* ✅ الأزرار */
button, .btn, .btn-primary {
  background-color: #8b9e71 !important;
  color: #f7f3e7 !important;
  border: none !important;
}
button:hover, .btn:hover, .btn-primary:hover {
  background-color: #6f7e58 !important;
}

/* ✅ أيقونات */
svg, i {
  color: #8b9e71 !important;
  fill: #8b9e71 !important;
}

/* ✅ الفورمات + حقول البحث */
input, textarea, select {
  border: 1px solid #8b9e71 !important;
  background-color: #f7f3e7 !important;
  color: #8b9e71 !important;
}
input::placeholder, textarea::placeholder {
  color: #8b9e71 !important;
}

/* ✅ الهيدر والفوتر */

header, footer {
  background-color: #f7f3e7 !important;
  color: #8b9e71 !important;
}
/* ✅ تغيير لون الـ Header */
header {
  background-color: #8b9e71 !important;  /* زيتوني */
  color: #f7f3e7 !important;             /* عاجي للنصوص */
}
header a:hover {
  color: #e6dfd0 !important; /* عاجي أغمق شوية عند الهوفر */
}

/* ✅ الأيقونات داخل الـ Header */
header svg, 
header i {
  color:#8b9e71 !important;
  fill: #8b9e71 !important;
}


/* أيقونات داخل الزرار */
button i, .btn i, .salla-button i, .tw-button i,
button svg, .btn svg, .salla-button svg, .tw-button svg {
  color: #F8F6E7 !important; /* الأيقونة باللون العاجي */
  fill: #F8F6E7 !important;
}

/* Hover effect */
button:hover, .btn:hover, .salla-button:hover, .tw-button:hover {
  background: linear-gradient(180deg, #7DAA33 0%, #5E7520 100%); /* افتح وأجمل */
  transform: translateY(-2px);
}
}



}