@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&family=Tajawal:wght@400;700&display=swap");

/* Extracted CSS from all HTML files */
:root {
  --background: 218 80% 98%; /* خلفية فاتحة جداً تميل للأزرق */
  --foreground: 218 80% 10%; /* نص داكن مناسب */
  --card: 0 0% 100%;
  --card-foreground: 218 80% 10%;
  --primary: 218 87% 16%; /* #05254c */
  --primary-foreground: 0 0% 100%; /* أبيض للنصوص فوق الأزرق الداكن */
  --primary-glow: 218 87% 26%; /* تدرج أفتح من الأساسي */
  --secondary: 218 60% 92%; /* أزرق فاتح جداً */
  --secondary-foreground: 218 87% 16%;
  --orange: hsl(1.3deg 85.98% 58.04%); /* برتقالي زاهي */
  --muted: 218 60% 94%;
  --muted-foreground: 218 20% 40%;
  --accent: 218 87% 16%; /* نفس الأساسي للتماسك */
  --accent-foreground: 0 0% 100%;
  --destructive: 0 84.2% 60.2%;
  --border: 218 40% 85%;
  --radius: 0.75rem;
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: "Cairo", "Tajawal", "Segoe UI", "Tahoma", "Arial", sans-serif;
  direction: rtl;
}

header a .logo,
footer .logo {
  width: 80px;
  height: 80px;
}
header .contact-btn {
  border-radius: 16px;
  border: 1px solid hsl(1.3deg 85.98% 58.04%);
  transition: all 0.3s ease;
}
header .contact-btn:hover {
  background-color: hsl(1.3deg 85.98% 58.04%);
  color: #fff;
  border-color: hsl(1.3deg 85.98% 58.04%);
}
#slider .hero-btn {
  background: hsl(1.3deg 85.98% 58.04%);
  transition: all 0.3s ease;
}
#slider .hero-btn:hover {
  transform: translateY(-2px);
}

.gradient-primary {
  background: linear-gradient(
    135deg,
    hsl(1.3deg 85.98% 58.04%),
    hsl(1, 70%, 46%)
  );
}

.gradient-warm {
  background: linear-gradient(45deg, hsl(45 60% 90%), hsl(40 50% 95%));
}

.shadow-elegant {
  box-shadow: 0 10px 30px -10px hsl(var(--primary) / 0.15);
}

.shadow-warm {
  box-shadow: 0 4px 20px -5px hsl(25 25% 50% / 0.2);
}

.animate-fade-in {
  animation: fadeIn 0.6s ease-out;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.bleuu {
  color: hsl(1.3deg 85.98% 58.04%);
}
#addProductModal {
  overflow: scroll;
}
.more-btn {
  background: linear-gradient(
    135deg,
    hsl(var(--primary)),
    hsl(var(--primary-glow))
  );
  color: hsl(var(--primary-foreground));
  transition: all 0.3s ease;
}