@import "tailwindcss"; @source "../components/*.{js,ts,jsx,tsx}"; @source "../components/ui/*.{js,ts,jsx,tsx}"; @source "*.{js,ts,jsx,tsx}"; @custom-variant hover (&:hover); @theme { --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; /* Custom animations */ --animate-gradient: gradient 8s linear infinite; --animate-float: float 3s ease-in-out infinite; --animate-glow: glow 2s ease-in-out infinite alternate; --animate-fade-in: fadeIn 0.3s ease-in-out; --animate-slide-up: slideUp 0.4s ease-out; --animate-slide-down: slideDown 0.4s ease-out; --animate-scale-in: scaleIn 0.2s ease-out; @keyframes gradient { 0%, 100% { background-size: 200% 200%; background-position: left center; } 50% { background-size: 200% 200%; background-position: right center; } } @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-20px); } } @keyframes glow { from { box-shadow: 0 0 20px rgba(139, 92, 246, 0.3); } to { box-shadow: 0 0 30px rgba(139, 92, 246, 0.6), 0 0 40px rgba(139, 92, 246, 0.3); } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @keyframes slideDown { from { transform: translateY(-20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @keyframes scaleIn { from { transform: scale(0.95); opacity: 0; } to { transform: scale(1); opacity: 1; } } } :root, .dark { color-scheme: dark; /* CORPORATE DARK THEME (The Standard) */ --background: #0a0a0f; --foreground: #ffffff; --card: rgba(255, 255, 255, 0.03); --card-foreground: #ffffff; --popover: #0f0f15; --popover-foreground: #ffffff; --primary: #8b5cf6; --primary-foreground: #ffffff; --secondary: rgba(255, 255, 255, 0.05); --secondary-foreground: #ffffff; --muted: rgba(255, 255, 255, 0.05); --muted-foreground: #a1a1aa; --accent: rgba(255, 255, 255, 0.08); --accent-foreground: #ffffff; --destructive: #ef4444; --destructive-foreground: #ffffff; --border: rgba(255, 255, 255, 0.15); --input: rgba(255, 255, 255, 0.05); --ring: rgba(139, 92, 246, 0.5); --radius: 1rem; } .light { color-scheme: light; /* LIGHT ADAPTATION (Keeping the "Glass" look) */ --background: oklch(98% 0.005 255); --foreground: oklch(20% 0.04 255); --card: rgba(255, 255, 255, 0.4); --card-foreground: oklch(20% 0.04 255); --popover: oklch(100% 0 0); --popover-foreground: oklch(20% 0.04 255); --primary: oklch(55% 0.22 270); --primary-foreground: oklch(100% 0 0); --secondary: rgba(0, 0, 0, 0.02); --secondary-foreground: oklch(20% 0.04 255); --muted: rgba(0, 0, 0, 0.02); --muted-foreground: oklch(45% 0.04 255); --accent: rgba(0, 0, 0, 0.03); --accent-foreground: oklch(15% 0.05 255); --destructive: oklch(60% 0.2 25); --destructive-foreground: oklch(100% 0 0); --border: rgba(0, 0, 0, 0.2); --input: rgba(0, 0, 0, 0.08); --ring: rgba(139, 92, 246, 0.4); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; font-family: var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Fix native select dropdown styling */ select option { @apply bg-popover text-popover-foreground; } } html { scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } @utility text-balance { text-wrap: balance; } @utility glass { background: var(--card); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid var(--border); } @utility gradient-purple-blue { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); } @utility gradient-cyan-purple { background: linear-gradient(135deg, #2dd4bf 0%, #8b5cf6 100%); } @utility gradient-indigo-purple { background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%); } @utility gradient-yellow-amber { background: linear-gradient(135deg, #eab308 0%, #f59e0b 100%); } @utility gradient-green-teal { background: linear-gradient(135deg, #10b981 0%, #06b6d4 100%); } @utility gradient-brand { background: linear-gradient(to right, #a78bfa, #f472b6, #22d3ee); }