/* Comprehensive CSS fix for missing Tailwind classes */

/* Background colors */
.bg-slate-50 { background-color: #f8fafc !important; }
.bg-slate-100 { background-color: #f1f5f9 !important; }
.bg-slate-200 { background-color: #e2e8f0 !important; }
.bg-slate-300 { background-color: #cbd5e1 !important; }
.bg-slate-400 { background-color: #94a3b8 !important; }
.bg-slate-500 { background-color: #64748b !important; }
.bg-slate-600 { background-color: #475569 !important; }
.bg-slate-700 { background-color: #334155 !important; }
.bg-slate-800 { background-color: #1e293b !important; }
.bg-slate-900 { background-color: #0f172a !important; }

.bg-blue-50 { background-color: #eff6ff !important; }
.bg-blue-100 { background-color: #dbeafe !important; }
.bg-blue-200 { background-color: #bfdbfe !important; }
.bg-blue-300 { background-color: #93c5fd !important; }
.bg-blue-400 { background-color: #60a5fa !important; }
.bg-blue-500 { background-color: #3b82f6 !important; }
.bg-blue-600 { background-color: #2563eb !important; }
.bg-blue-700 { background-color: #1d4ed8 !important; }
.bg-blue-800 { background-color: #1e40af !important; }
.bg-blue-900 { background-color: #1e3a8a !important; }

.bg-indigo-50 { background-color: #eef2ff !important; }
.bg-indigo-100 { background-color: #e0e7ff !important; }
.bg-indigo-200 { background-color: #c7d2fe !important; }
.bg-indigo-300 { background-color: #a5b4fc !important; }
.bg-indigo-400 { background-color: #818cf8 !important; }
.bg-indigo-500 { background-color: #6366f1 !important; }
.bg-indigo-600 { background-color: #4f46e5 !important; }
.bg-indigo-700 { background-color: #4338ca !important; }
.bg-indigo-800 { background-color: #3730a3 !important; }
.bg-indigo-900 { background-color: #312e81 !important; }

.bg-white { background-color: #ffffff !important; }
.bg-black { background-color: #000000 !important; }
.bg-transparent { background-color: transparent !important; }

/* Additional background colors */
.bg-purple-50 { background-color: #faf5ff !important; }
.bg-purple-100 { background-color: #f3e8ff !important; }
.bg-purple-200 { background-color: #e9d5ff !important; }
.bg-purple-300 { background-color: #c4b5fd !important; }
.bg-purple-400 { background-color: #a78bfa !important; }
.bg-purple-500 { background-color: #8b5cf6 !important; }
.bg-purple-600 { background-color: #7c3aed !important; }
.bg-purple-700 { background-color: #6d28d9 !important; }
.bg-purple-800 { background-color: #5b21b6 !important; }
.bg-purple-900 { background-color: #4c1d95 !important; }

.bg-green-50 { background-color: #f0fdf4 !important; }
.bg-green-100 { background-color: #dcfce7 !important; }
.bg-green-200 { background-color: #bbf7d0 !important; }
.bg-green-300 { background-color: #86efac !important; }
.bg-green-400 { background-color: #4ade80 !important; }
.bg-green-500 { background-color: #22c55e !important; }
.bg-green-600 { background-color: #16a34a !important; }
.bg-green-700 { background-color: #15803d !important; }
.bg-green-800 { background-color: #166534 !important; }
.bg-green-900 { background-color: #14532d !important; }

.bg-orange-50 { background-color: #fff7ed !important; }
.bg-orange-100 { background-color: #ffedd5 !important; }
.bg-orange-200 { background-color: #fed7aa !important; }
.bg-orange-300 { background-color: #fdba74 !important; }
.bg-orange-400 { background-color: #fb923c !important; }
.bg-orange-500 { background-color: #f97316 !important; }
.bg-orange-600 { background-color: #ea580c !important; }
.bg-orange-700 { background-color: #c2410c !important; }
.bg-orange-800 { background-color: #9a3412 !important; }
.bg-orange-900 { background-color: #7c2d12 !important; }

.bg-rose-50 { background-color: #fff1f2 !important; }
.bg-rose-100 { background-color: #ffe4e6 !important; }
.bg-rose-200 { background-color: #fecdd3 !important; }
.bg-rose-300 { background-color: #fda4af !important; }
.bg-rose-400 { background-color: #fb7185 !important; }
.bg-rose-500 { background-color: #f43f5e !important; }
.bg-rose-600 { background-color: #e11d48 !important; }
.bg-rose-700 { background-color: #be123c !important; }
.bg-rose-800 { background-color: #9f1239 !important; }
.bg-rose-900 { background-color: #881337 !important; }

/* Text colors */
.text-white { color: #ffffff !important; }
.text-black { color: #000000 !important; }
.text-slate-50 { color: #f8fafc !important; }
.text-slate-100 { color: #f1f5f9 !important; }
.text-slate-200 { color: #e2e8f0 !important; }
.text-slate-300 { color: #cbd5e1 !important; }
.text-slate-400 { color: #94a3b8 !important; }
.text-slate-500 { color: #64748b !important; }
.text-slate-600 { color: #475569 !important; }
.text-slate-700 { color: #334155 !important; }
.text-slate-800 { color: #1e293b !important; }
.text-slate-900 { color: #0f172a !important; }

.text-blue-50 { color: #eff6ff !important; }
.text-blue-100 { color: #dbeafe !important; }
.text-blue-200 { color: #bfdbfe !important; }
.text-blue-300 { color: #93c5fd !important; }
.text-blue-400 { color: #60a5fa !important; }
.text-blue-500 { color: #3b82f6 !important; }
.text-blue-600 { color: #2563eb !important; }
.text-blue-700 { color: #1d4ed8 !important; }
.text-blue-800 { color: #1e40af !important; }
.text-blue-900 { color: #1e3a8a !important; }

.text-cyan-300 { color: #67e8f9 !important; }
.text-cyan-400 { color: #22d3ee !important; }
.text-yellow-400 { color: #facc15 !important; }

/* Additional color utilities */
.text-purple-50 { color: #faf5ff !important; }
.text-purple-100 { color: #f3e8ff !important; }
.text-purple-200 { color: #e9d5ff !important; }
.text-purple-300 { color: #c4b5fd !important; }
.text-purple-400 { color: #a78bfa !important; }
.text-purple-500 { color: #8b5cf6 !important; }
.text-purple-600 { color: #7c3aed !important; }
.text-purple-700 { color: #6d28d9 !important; }
.text-purple-800 { color: #5b21b6 !important; }
.text-purple-900 { color: #4c1d95 !important; }

.text-green-50 { color: #f0fdf4 !important; }
.text-green-100 { color: #dcfce7 !important; }
.text-green-200 { color: #bbf7d0 !important; }
.text-green-300 { color: #86efac !important; }
.text-green-400 { color: #4ade80 !important; }
.text-green-500 { color: #22c55e !important; }
.text-green-600 { color: #16a34a !important; }
.text-green-700 { color: #15803d !important; }
.text-green-800 { color: #166534 !important; }
.text-green-900 { color: #14532d !important; }

.text-orange-50 { color: #fff7ed !important; }
.text-orange-100 { color: #ffedd5 !important; }
.text-orange-200 { color: #fed7aa !important; }
.text-orange-300 { color: #fdba74 !important; }
.text-orange-400 { color: #fb923c !important; }
.text-orange-500 { color: #f97316 !important; }
.text-orange-600 { color: #ea580c !important; }
.text-orange-700 { color: #c2410c !important; }
.text-orange-800 { color: #9a3412 !important; }
.text-orange-900 { color: #7c2d12 !important; }

.text-rose-50 { color: #fff1f2 !important; }
.text-rose-100 { color: #ffe4e6 !important; }
.text-rose-200 { color: #fecdd3 !important; }
.text-rose-300 { color: #fda4af !important; }
.text-rose-400 { color: #fb7185 !important; }
.text-rose-500 { color: #f43f5e !important; }
.text-rose-600 { color: #e11d48 !important; }
.text-rose-700 { color: #be123c !important; }
.text-rose-800 { color: #9f1239 !important; }
.text-rose-900 { color: #881337 !important; }

.text-indigo-50 { color: #eef2ff !important; }
.text-indigo-100 { color: #e0e7ff !important; }
.text-indigo-200 { color: #c7d2fe !important; }
.text-indigo-300 { color: #a5b4fc !important; }
.text-indigo-400 { color: #818cf8 !important; }
.text-indigo-500 { color: #6366f1 !important; }
.text-indigo-600 { color: #4f46e5 !important; }
.text-indigo-700 { color: #4338ca !important; }
.text-indigo-800 { color: #3730a3 !important; }
.text-indigo-900 { color: #312e81 !important; }

/* Layout */
.relative { position: relative !important; }
.absolute { position: absolute !important; }
.overflow-hidden { overflow: hidden !important; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }

/* Opacity */
.opacity-10 { opacity: 0.1 !important; }
.opacity-30 { opacity: 0.3 !important; }

/* Z-index */
.z-10 { z-index: 10 !important; }

/* Grid */
.grid { display: grid !important; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
.grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
@media (min-width: 1024px) {
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* Gap */
.gap-4 { gap: 1rem !important; }
.gap-8 { gap: 2rem !important; }

/* Width & Height */
.h-full { height: 100% !important; }
.w-2 { width: 0.5rem !important; }
.h-2 { height: 0.5rem !important; }
.w-5 { width: 1.25rem !important; }
.h-5 { height: 1.25rem !important; }
.w-12 { width: 3rem !important; }
.h-12 { height: 3rem !important; }

/* Container */
.container { width: 100%; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container { max-width: 640px; } }
@media (min-width: 768px) { .container { max-width: 768px; } }
@media (min-width: 1024px) { .container { max-width: 1024px; } }
@media (min-width: 1280px) { .container { max-width: 1280px; } }
@media (min-width: 1536px) { .container { max-width: 1536px; } }

.mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* Text alignment */
.text-center { text-align: center !important; }

/* Max width */
.max-w-4xl { max-width: 56rem !important; }

/* Margins */
.mb-20 { margin-bottom: 5rem !important; }
.mb-6 { margin-bottom: 1.5rem !important; }
.mb-4 { margin-bottom: 1rem !important; }

/* Padding */
.py-24 { padding-top: 6rem !important; padding-bottom: 6rem !important; }
.px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-8 { padding-left: 2rem !important; padding-right: 2rem !important; }
@media (min-width: 1024px) {
  .lg\:px-8 { padding-left: 2rem !important; padding-right: 2rem !important; }
}

/* Spacing */
.space-x-2 > * + * { margin-left: 0.5rem !important; }
.space-x-4 > * + * { margin-left: 1rem !important; }

/* Border radius */
.rounded-full { border-radius: 9999px !important; }
.rounded-2xl { border-radius: 1rem !important; }

/* Flexbox */
.flex { display: flex !important; }
.inline-flex { display: inline-flex !important; }
.items-center { align-items: center !important; }
.justify-center { justify-content: center !important; }

/* Typography */
.text-4xl { font-size: 2.25rem !important; line-height: 2.5rem !important; }
.text-5xl { font-size: 3rem !important; line-height: 1 !important; }
@media (min-width: 1024px) {
  .lg\:text-5xl { font-size: 3rem !important; line-height: 1 !important; }
}
.text-lg { font-size: 1.125rem !important; line-height: 1.75rem !important; }
.text-sm { font-size: 0.875rem !important; line-height: 1.25rem !important; }

.font-bold { font-weight: 700 !important; }
.font-semibold { font-weight: 600 !important; }
.font-medium { font-weight: 500 !important; }

/* Transitions */
.transition-all { transition-property: all !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 150ms !important; }
.duration-300 { transition-duration: 300ms !important; }

/* Hover effects */
.hover\:bg-white\/10:hover { background-color: rgba(255, 255, 255, 0.1) !important; }
.hover\:text-blue-300:hover { color: #93c5fd !important; }
.hover\:text-blue-400:hover { color: #60a5fa !important; }
.hover\:text-blue-600:hover { color: #2563eb !important; }
.hover\:text-blue-700:hover { color: #1d4ed8 !important; }
.hover\:text-purple-600:hover { color: #7c3aed !important; }
.hover\:text-purple-700:hover { color: #6d28d9 !important; }
.hover\:text-green-600:hover { color: #16a34a !important; }
.hover\:text-green-700:hover { color: #15803d !important; }
.hover\:text-orange-600:hover { color: #ea580c !important; }
.hover\:text-orange-700:hover { color: #c2410c !important; }
.hover\:text-rose-600:hover { color: #e11d48 !important; }
.hover\:text-rose-700:hover { color: #be123c !important; }
.hover\:text-indigo-600:hover { color: #4f46e5 !important; }
.hover\:text-indigo-700:hover { color: #4338ca !important; }

/* Borders */
.border { border-width: 1px !important; }
.border-white\/10 { border-color: rgba(255, 255, 255, 0.1) !important; }

/* Backdrop filters */
.backdrop-blur-sm { backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; }
.backdrop-blur-xl { backdrop-filter: blur(24px) !important; -webkit-backdrop-filter: blur(24px) !important; }

/* Background gradients */
.bg-gradient-to-r { background-image: linear-gradient(to right, var(--tw-gradient-stops)) !important; }
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)) !important; }

/* Gradient color stops */
.from-blue-500\/20 { --tw-gradient-from: rgba(59, 130, 246, 0.2); --tw-gradient-to: rgba(59, 130, 246, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-purple-500\/20 { --tw-gradient-to: rgba(168, 85, 247, 0); --tw-gradient-stops: var(--tw-gradient-from), rgba(168, 85, 247, 0.2), var(--tw-gradient-to); }
.to-cyan-500\/20 { --tw-gradient-to: rgba(6, 182, 212, 0.2); }

.from-cyan-400 { --tw-gradient-from: #22d3ee; --tw-gradient-to: rgba(34, 211, 238, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-blue-400 { --tw-gradient-to: #60a5fa; }

/* Specific gradient combinations for feature cards */
.bg-gradient-to-br.from-blue-500.to-blue-600 {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
}
.bg-gradient-to-br.from-purple-500.to-purple-600 {
  background: linear-gradient(135deg, #a855f7 0%, #9333ea 100%) !important;
}
.bg-gradient-to-br.from-green-500.to-green-600 {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
}
.bg-gradient-to-br.from-orange-500.to-orange-600 {
  background: linear-gradient(135deg, #f97316 0%, #ea580c 100%) !important;
}
.bg-gradient-to-br.from-rose-500.to-rose-600 {
  background: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%) !important;
}
.bg-gradient-to-br.from-indigo-500.to-indigo-600 {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
}

/* Text clip */
.bg-clip-text { -webkit-background-clip: text !important; background-clip: text !important; }
.text-transparent { color: transparent !important; }

/* Glass morphism */
.glass-panel {
  background: rgba(255, 255, 255, 0.25) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37) !important;
}

/* Background opacity utilities */
.bg-white\/5 { background-color: rgba(255, 255, 255, 0.05) !important; }
.bg-white\/10 { background-color: rgba(255, 255, 255, 0.1) !important; }

/* Responsive design for body gradient */
.bg-gradient-to-br.from-slate-50.via-blue-50.to-indigo-100 {
  background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 50%, #e0e7ff 100%) !important;
}

/* Additional body styles */
body {
  min-height: 100vh !important;
  position: relative !important;
}