:root {
  --button-color: #03a9f4;
  --green: #23c10c;
  --gray: #ced4db;
  --text: #FFFFFF;
  --t-black: #202020;
  --blue: #0d4082;
  --bg-primary: #ffffff;
  --bg-secondary: #f3f5f6;
  --bg-dark: #121212;
  --bg-card: #1e1e1e;
}

/* Dark Mode Styles */
.dark {
  --text: #000000;
  --t-black: #FFFFFF;
  --gray: #4a5568;
  --bg-primary: #000000;
  --bg-secondary: #1a1a1a;
  --bg-dark: #ffffff;
  --bg-card: #2d2d2d;
}

/* Apply dark mode to body */
body.dark-mode {
  background-color: var(--bg-primary);
  color: var(--text);
}

/* Dark mode specific overrides for common elements */
.dark body {
  background-color: #000000 !important;
  color: #ffffff !important;
}

.dark header,
.dark .header {
  background-color: #1a1a1a !important;
}

.dark .bg-white,
.dark [style*="background-color: #fff"],
.dark [style*="background-color:#fff"] {
  background-color: #1e1e1e !important;
}

.dark .text-gray-500,
.dark .text-\[\#8290a3\] {
  color: #a0aec0 !important;
}

.dark .shadow-xl {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}

.dark [style*="background-color: #fdfdfd"] {
  background-color: #1e1e1e !important;
}

.dark [style*="background-color: #f3f5f6"] {
  background-color: #2d2d2d !important;
}

.dark input,
.dark textarea,
.dark select {
  background-color: #2d2d2d !important;
  color: #ffffff !important;
  border-color: #4a5568 !important;
}

.dark .bg-\[\#f3f5f6\] {
  background-color: #2d2d2d !important;
}

.dark .bg-\[\#8290a3\] {
  background-color: #4a5568 !important;
}

.dark a,
.dark .link a {
  color: #ffffff !important;
}

.dark .mobile-nav-item a {
  color: #ffffff !important;
}

/* Dark mode for inline styles in blade files */
/* Blue color #000675 */
.dark [style*="#000675"],
.dark [style*="background-color: #000675"] {
  background-color: #1a1a2e !important;
}

/* Cyan color #00FFCE */
.dark [style*="#00FFCE"],
.dark [style*="background-color: #00FFCE"] {
  background-color: #00ccaa !important;
}

/* White backgrounds */
.dark [style*="background-color: #fff"],
.dark [style*="background-color: #ffffff"],
.dark [style*="background-color:#fff"],
.dark [style*="background-color:#ffffff"] {
  background-color: #1e1e1e !important;
}

/* Text colors */
.dark [style*="color: #000"],
.dark [style*="color: #000000"],
.dark [style*="color:#000"],
.dark [style*="color:#000000"] {
  color: #ffffff !important;
}

/* Border colors */
.dark [style*="border-color"] {
  border-color: #4a5568 !important;
}

/* Gradient backgrounds */
.dark .gradient,
.dark [style*="background-image: linear-gradient"] {
  background-image: linear-gradient(to top, #1a1a2e 0%, #0d0d2b 35%, #0d0d2b 60%, #0d0d2b 100%) !important;
}

/* Sky blue backgrounds */
.dark .bg-sky-400,
.dark [style*="background-image: linear-gradient"] {
  background: linear-gradient(to top right, #1a1a2e, #0d0d2b) !important;
}

/* Blue text colors */
.dark [style*="color: #000675"],
.dark .text-\[\#000675\] {
  color: #00FFCE !important;
}

/* Green text */
.dark [style*="color: #00FFCE"],
.dark .text-green-400 {
  color: #00ccaa !important;
}

/* Button backgrounds */
.dark [style*="background-color"] {
  filter: brightness(0.9);
}

/* Images in dark mode - make them slightly brighter */
.dark img {
  opacity: 0.9;
  filter: brightness(0.95);
}

/* updatre container for chrome broser screen */
.container {
  @media (width >=96rem) {
    max-width: 90rem !important;
  }
}


.drop-shadow-salem {
  filter: drop-shadow(-10px 10px 20px #8494c1a9);
}





/* updatre container for chrome broser */