/* 🎀 خلفية عامة */
body {
  background-color: #FDECEF; /* وردي فاتح جدًا */
  color: #3A2B2F;
  font-family: "Tajawal", sans-serif;
}

/* 🎀 العناوين */
h1, h2, h3, h4, h5, h6 {
  color: #7C2F49;
  font-weight: 700;
}

/* 🎀 الروابط */
a {
  color: #7C2F49;
  text-decoration: none;
  transition: 0.3s;
  font-weight: 600;
}
a:hover {
  color: #E48AAE;
}

/* 🎀 الأزرار */
button, .btn, .btn-primary {
  background-color: #E48AAE !important;
  color: #fff !important;
  border-radius: 10px;
  border: none;
  transition: 0.3s;
  font-weight: 600;
}
button:hover, .btn:hover, .btn-primary:hover {
  background-color: #7C2F49 !important;
  color: #fff !important;
}

/* 🎀 الصناديق والبطاقات */
.card, .box, .product-card, .form-control {
  background-color: #fff;
  border: 2px solid #E48AAE;
  color: #3A2B2F;
  border-radius: 12px;
  padding: 15px;
}

/* 🎀 الهيدر */
header {
  background-color: #E48AAE !important;
  color: #fff !important;
  border-bottom: 3px solid #7C2F49;
}
header a {
  color: #fff !important;
  font-weight: 600;
}
header a:hover {
  color: #FDECEF !important;
}

/* 🌸 أقسام المتجر في الأعلى (تداخل وردي ناعم في المنتصف) */
header .main-menu, 
header .nav, 
header .navbar, 
header .nav-links, 
header .menu, 
header .categories-menu {
  background: radial-gradient(circle at center, #FBD2E0 0%, #FFFFFF 70%) !important; 
  /* وردي فاتح بالمنتصف، أبيض على الجوانب */
  border-bottom: 2px solid #EFB8C8;
}

header .main-menu a,
header .nav a,
header .navbar a,
header .nav-links a,
header .menu a,
header .categories-menu a {
  color: #7C2F49 !important; /* نص وردي غامق */
  font-weight: 600;
  transition: 0.3s;
}

header .main-menu a:hover,
header .nav a:hover,
header .navbar a:hover,
header .nav-links a:hover,
header .menu a:hover,
header .categories-menu a:hover {
  color: #E48AAE !important;
  transform: scale(1.05);
}

/* 🎀 الفوتر */
footer {
  background-color: #FFFFFF !important;
  color: #D47A9C !important;
  border-top: 3px solid #EFB8C8;
  text-align: center;
  padding: 20px 10px;
}

footer a, 
footer p, 
footer span, 
footer li {
  color: #D47A9C !important;
  font-weight: 600;
}

footer a:hover {
  color: #7C2F49 !important;
}

footer i, footer svg {
  color: #D47A9C !important;
  transition: 0.3s;
}
footer i:hover, footer svg:hover {
  color: #7C2F49 !important;
}

/* 🎀 شريط التوعية */
.alert, .notice-bar {
  background-color: #7C2F49;
  color: #fff;
  border-radius: 6px;
  padding: 8px 12px;
  font-weight: 600;
  text-align: center;
}