/* Custom styles for JanSamachar */

:root {
  /* Light Theme (Default) */
  --background: 0 0% 98%;
  --foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 3.9%;
  --primary: 38 92% 50%;
  --primary-foreground: 0 0% 2%;
  --secondary: 240 4.8% 95.9%;
  --secondary-foreground: 240 5.9% 10%;
  --muted: 240 4.8% 90%;
  --muted-foreground: 240 3.8% 46.1%;
  --accent: 240 4.8% 95.9%;
  --accent-foreground: 240 5.9% 10%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 5.9% 90%;
  --input: 240 5.9% 90%;
  --ring: 38 92% 50%;
}

.dark {
  /* Dark Theme */
  --background: 224 71% 4%;
  --foreground: 213 31% 91%;
  --card: 224 50% 8%;
  --card-foreground: 213 31% 91%;
  --primary: 38 92% 50%;
  --primary-foreground: 0 0% 2%;
  --secondary: 223 47% 11%;
  --secondary-foreground: 215 20.2% 65.1%;
  --muted: 223 47% 11%;
  --muted-foreground: 215 20.2% 55.1%;
  --accent: 216 34% 17%;
  --accent-foreground: 210 40% 98%;
  --destructive: 0 62.8% 50.6%;
  --destructive-foreground: 0 0% 98%;
  --border: 216 34% 17%;
  --input: 216 34% 17%;
  --ring: 38 92% 50%;
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  -webkit-tap-highlight-color: transparent;
  /* Slightly larger base text for Hindi clarity */
  font-size: 16px;
  line-height: 1.6;
}

/* Scrollbar */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: hsl(var(--muted)); border-radius: 9999px; }

/* Hide scrollbar for horizontal scroll areas */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Safe area padding for mobile */
.pb-safe { padding-bottom: env(safe-area-inset-bottom, 20px); }

/* Glassmorphism */
.glass {
  background: hsl(var(--background) / 0.85);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}

/* Animations */
.animate-slide-up { animation: slide-up 0.4s ease forwards; }
.animate-fade-in { animation: fade-in 0.3s ease forwards; }

.stagger > * { opacity: 0; animation: slide-up 0.4s ease forwards; }
.stagger > *:nth-child(1) { animation-delay: 0ms; }
.stagger > *:nth-child(2) { animation-delay: 60ms; }
.stagger > *:nth-child(3) { animation-delay: 120ms; }
.stagger > *:nth-child(4) { animation-delay: 180ms; }
.stagger > *:nth-child(5) { animation-delay: 240ms; }

@keyframes slide-up {
  0% { opacity: 0; transform: translateY(16px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes fade-in {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

/* Base Tailwind resets via CSS vars to work with CDN */
*, ::before, ::after {
  border-color: hsl(var(--border));
}